Visual Composer: Grundlagen

Newspaper: Termine
13. November 2016
AdWords
23. Dezember 2016

Grundlagen

Der Visual Composer für WordPress ist ein mächtiges Plugin, dass es ermöglicht, Inhalte in einem einfachen WYSIWYG (what you see is what you get) Schema zu arrangieren. Der Visual Composer kann für alle Textfelder einer Seite genutzt werden, also z.B. Seiten und Beiträge.

Das Beispiel zeigt eine Seite, die komplett mithilfe des Visual Composer gesetzt wurde. Das besondere am Visual Composer gegenüber der normalen, visuellen Ansicht in WordPress, ist die Funktion, Spalten in beliebiger Breite anzulegen und damit Inhalte einfach nebeneinander zu arrangieren.

Die gezeigte Seite beginnt mit einer 1/1 Teilung, dass heißt einer vollen Seitenbreite und wechselt danach in eine 1/3 + 2/3 Teilung. Die linke Spalte bekommt eine Breite von 1/3 und der Hauptteil 2/3. Der Visual Composer arbeitet auf einer 12er Teilung, dass heißt es ist jede Art von Teilung möglich, die sich am Ende durch 12 teilen lässt. Das heißt, Werte wie 1/5 als Spaltenbreite sind nicht möglich.

Jedes Element besitzt die folgenden Buttons

  • Plus: Element hinzufügen
  • Bleistift: Element bearbeiten
  • Mülleimer: Element löschen
  • Zwei übereinander liegende Seiten: Element duplizieren

visual-composer_gesamtansicht

Element hinzufügen

Der Klick auf das Plus öffnet die im Screenshot gezeigt Ansicht. Je nachdem welche Funktion benötigt wird, kann aus der Liste des Visual Composer gewählt werden. Abhängig von Theme und erweiternden Plugins enthält der Visual Composer weniger oder mehr Elemente. Die Auswahl ist nicht statisch, sondern kann durch spezielle Plugins erweitert werden.

Durch Klick auf eines der Elemente öffnet sich die Ansicht zur Konfiguration des entsprechenden Elements. Ist die Konfiguration abgeschlossen kann das Element durch speichern hinzugefügt werden.

Jedes Element erscheint an der Stelle, an der auf das Plus geklickt wurde. Wird die Maus über eines der Elemente bewegt, erscheint in der Mitte ein Kreuz und die Beschriftung des Elements. Durch klicken und ziehen, kann ein bereits platziertes Element nachträglich an eine andere Stelle verschoben werden.

visual-composer_add-element

Ähnliche Einträge