Zeilen & Spalten anpassen
Gerade eben haben wir bereits einige Möglichkeiten kennengelernt Spalten auf den verschiedenen Geräten unterschiedlich auszugeben. Darüber hinaus gibt es aber natürlich noch eine ganze Menge gestalterischer Möglichkeiten Zeilen und Spalten den individuellen Vorstellungen anzupassen.
Vorab möchte ich aber nochmal deutlich machen wo ihr in WP-Bakery eine Zeile bearbeitet – und wo eine Spalte:
Schauen wir uns zuerst die wichtigsten Einstellungsmöglichkeiten der Zeile an – und zwar im TAB „Allgemeine Einstellungen“:
ZEILE STRECKEN
Diese Option ist hilfreich wenn man einer Zeile gerne Hintergrundfarben/Bild verpassen möchte. Hier könnt ihr nämlich bestimmen ob die Zeile aus dem allgemeinen Seitenraster ausbrechen und ausnahmsweise breiter werden darf.
– Standard: Die Zeile kann maximal so breit werden wie die Inhaltsbreite von euerm Theme vorgegeben wird.
– Zeile strecken: Die Zeile darf so breit werden wie Bildschirm breit ist – der eigentliche Inhalt bleibt aber weiterhin maximal so breit wie von euerm Theme vorgegeben. Das macht z.B. Sinn wenn die Zeile eine Hintergrundfarbe hat.
– Zeile und Inhalt strecken: Jetzt wird die Zeile wirklich komplett gestreckt inklusive Inhalt. Selten wirklich sinnvoll.
– Zeile und Inhalt strecken ohne Abstände: Auch hier wird die Zeilte inklusive Inhalt gestreckt, jedoch werden zusätzlich noch sämtliche Innenabstände entfernt. Ein Anwendungsfall wäre z.B. wenn in einer Spalte ein Bild platziert ist und dieses randlos eingebunden werden soll.
COLUMNS GAP
Hier könnt ihr die Abstände zwischen den Spalten vergrößern/verkleinern.
FULL HEIGHT ROW
Soll die Zeile die gesamte Browser-Fensterhöhe einnehmen? Dann könnt ihr das hier aktivieren. Die Zeile passt sich also immer an die Browser-Fensterhöhe an.
EQUAL HEIGHT
Alle Spalten einer Zeile haben die gleiche Höhe – nämlich die der größten in dieser Zeile (oder, wenn ihr die FULL HEIGHT ROW zusätzlich aktiviert habt, die gesamte Bildschirm-Höhe).
INHALTSPOSITION
Vertikale Positionierung der Inhalte in den Spalten (Oben, Mitte oder Unten).
ZEILE DEAKTIVEREN
Blendet die Zeile über alle Geräte hinweg aus.
ZEILEN-ID
Hier könnt ihr der Zeile eine individuelle ID/Namen verpassen. Damit könnt ihr diese anschließend z.B. mit CSS noch individueller gestalten (aber das würde hier den Rahmen sprengen 😉 ABER: Ihr könnt diese ID auch nutzen um z.B. über einen Anker-Link zu dieser Spalte zu springen.
ZEILEN-KLASSE
Dient auch in erster Linie um die Zeile via CSS noch individueller gestalten zu können. Wie bei einer ID könnt ihr hier der Zeile eine ID/Namen geben und diese dann per CSS gezielt ansprechen. Ihr fragt euch nun sicherlich, wo ist nun der Unterschied zur Zeilen-ID!? Im Gegensatz zu einer Zeilen-ID dürft ihr eine Zeilen-Klasse auch mehreren Elementen geben. Den Namen den Ihr bei Zeilen-ID hinterlegt, sollte wirklich nur einmal vorkommen.
Schauen wir uns noch den TAB „Designeinstellungen“ an. Dieser findet sich im Übrigen bei fast allen Elementen, auch bei Spalten. Diesen habe ich bereits in Teil 1 meines WPBakery Tutorials näher erklärt. Siehe Feintuning – Abstände und Farben
Sowohl bei Zeilen als auch bei Spalten habt ihr die Möglichkeit Parallax-Effekte zu ergänzen, dazu mehr im nächsten Abschnitt.