Einleitung

Individuelle CSS-Anpassungen

Visforms erzeugt eine klare HTML-Struktur und CSS-Struktur. Diese Strukturen unterstĂŒtzen und vereinfachen in fast allen FĂ€llen, punktgenaue individuelle CSS-Anpassungen. Es ist empfehlenswert, die notwendigen CSS-Selektoren möglichst einfach und treffsicher zu formulieren.

Dieser Abschnitt listet alle notwendigen Informationen in ĂŒbersichtlichen Tabellen, um Sie bei der Formulierung der CSS-Selektoren zu unterstĂŒtzen. Die in den Tabellen genannten CSS-Klassen können Sie verwenden, um den anzupassenden Bereich, einfach und direkt mit CSS-Selektoren anzusprechen.

Individuelle JavaScript-Anpassungen

Auch im Falle von JavaScript-Anpassungen ist diese Dokumentation der HTML-Struktur und CSS-Struktur nĂŒtzlich. Denn fĂŒr JavaScript-Anpassungen ist es ebenfalls von großem Verteil, direkt und spezifisch die notwendigen HTML-Bereiche ansprechen zu können.

EinfĂŒgen von CSS-Anpassungen und JavaScript-Anpassungen mit Visforms

Es gibt zahlreiche Möglichkeiten, auf mehr oder weniger einfachen Wegen, Visforms individuelles CSS und JavaScript hinzuzufĂŒgen.
Einen Überblick bietet dieser Abschnitt: JavaScript und CSS hinzufĂŒgen.
Ganz besonders einfach erfolgt dabei das HinzufĂŒgen von individuellem CSS und JavaScript mit den Visforms Front-End-Web-Assets.

Die 3 HTML-Hauptbereiche

Äußerer HTML-Bereich

Visforms erzeugt immer ein Ă€ußerstes div-Element: <div class="visforms …"></div>.
CSS-Klassen, die in diesem Ă€ußersten div-Element erscheinen, bilden den Ă€ußersten HTML-Bereich.

Innerer HTML-Bereich

Je nachdem, ob das Formular oder die gespeicherten Übertragungen (Formular-Daten) angezeigt werden, erzeugt Visforms im Weiteren unterschiedliche HTML-Elemente.
CSS-Klassen, die in diesen inneren HTML-Elementen erscheinen, bilden den inneren HTML-Bereich:

  • form-Element
  • table-Element
  • dl-Element

Feld-nahe HTML-Bereich

Alle HTML-Element, um ein einzelnes Formular-Feld herum erzeugt werden, bilden den Feld-nahen HTML-Bereich.

Visforms besondere Strategie der passiven Integration

Bei Layout-Fragen verfolgt Visforms eine besondere Strategie der passiven Integration in das gewÀhlte Joomla Site-Template.

Visforms versucht sich so weit wie möglich ins Look&Feel Ihrer Webseite anzupassen, indem es nur das minimale allernötigste eigene CSS mitbringt.
Die meisten Formatierungsregeln kommen daher aus dem CSS Ihres Templates.

EinfĂŒhrung in Layout-Konfiguration und Layout-Fragen

Wir empfehlen die folgenden Abschnitte in der Dokumentation als EinfĂŒhrung in Layout-Konfiguration und Layout-Fragen.

Grundlegende Layout-Fragen und Settings

Die grundlegenden Layout-Fragen und Settings sind:

  • welches UI-Framework das gewĂ€hlte Template verwendet,
  • welches UI-Framework in Visforms eingestellt ist (Formular-Konfiguration, Reiter ‘Erweitert’, Gruppe ‘Layout’),
  • welches Sublayout in Visforms eingestellt ist, falls vorhanden (Formular-Konfiguration, Reiter ‘Erweitert’, Gruppe ‘Layout’).

Die Aufgaben des Templates

Es ist Aufgabe des Templates, die Anzeige zu steuern und auch responsiv zu reagieren.
Ausschlaggebend ist auch, ob und wie weit das Template die Anforderungen des UI-Frameworks auch tatsÀchlich umsetzt.