Globale Elemente verstehen und verwenden

In diesem Beitrag lernst du, was globale Elemente sind und wie du sie verwendest.

Globale Elemente verstehen

Ein globales Element ist ein Bereich, der nicht nur in einem Template oder einer Seite sitzt, sondern über mehrere Templates oder Seiten hinweg eingesetzt werden kann.

Machst du einen Bereich global, werden alle Elemente, die du löscht oder reinziehst und alle vorgenommenen Stylings automatisch in allen anderen Templates und Seiten umgesetzt, wo dieser globale Bereich ebenfalls vorkommt.

Das ist z. B. besonders nützlich für den Header oder Footer, der in den meisten Templates und Seiten identisch ist. Wäre der Header zum Beispiel nicht global, müsstest du eine Änderung in allen Templates und Seiten vornehmen.

Die Bereiche der Call-to-Action und Formular-Elemente sind automatisch immer global.

Globale Elemente verwenden

Um einen Bereich global zu machen, ziehe einen Bereich an die gewünschte Stelle oder wähle einen bereits vorhandenen Bereich aus.

Navigiere danach zu den Einstellungen des Bereichs, öffne den Reiter „Global“ und aktiviere die Funktion. In diesem Beispiel nehmen wir mal den gesamten Testimonial-Bereich aus dem Template „Startseite“, weil wir ihn öfter in einigen Templates und Seiten verwenden möchten:

Fullscreen 08 05 18 11 33

Nach dem Aktivieren erscheinen zwei neue Felder. Vergebe unter „Name“ einen Namen, wenn du ein neues globales Element erstellen möchtest. Klicke alternativ auf „Element laden“, um ein bereits vorhandenes globales Element zu laden.

In diesem Fall möchten wir einen neuen globalen Bereich erstellen, also benennen wir ihn einfach in „Testimonials“:

Screen Shot 2018 05 08 at 11 37 20

Zack, färbt sich der Bereich rot. Das signalisiert dir, dass es sich um ein globales Element handelt und du etwas vorsichtiger mit den Elementen und Stylings dadrin sein solltest.

Navigiere jetzt in ein anderes Template oder in eine Seite. In unserem Beispiel gehen wir zum Template „Seite“, weil wir hier den Testimonial-Bereich unter dem Inhalt hinhaben möchten.

Schiebe jetzt einen leeren Bereich aus der Übersicht der Element in der Sidebar an die gewünschte Stelle:

Fullscreen 08 05 18 11 52

Manchmal ist es schwer, ein Element genau an die gewünschte Stelle zu ziehen. Schiebe es in dem Fall so nah wie möglich an den gewünschten Platz heran. Navigiere danach zur Baumstruktur in der Sidebar und platziere das Element per Drag and Drop an die richtige Stelle.

Wähle danach den Bereich aus, klicke auf Einstellungen und aktiviere die globale Funktion. Klicke dieses mal auf das Auswahlfeld und wähle dein globales Element aus. In diesem Fall wählen wir „Testimonials“ aus:

Fullscreen 08 05 18 11 54

Schwupps ist der Testimonial-Bereich drin und rot markiert. Außerdem siehst du im Selector anhand des Globus-Icons, dass es sich um ein globales Element handelt:

Fullscreen 08 05 18 11 55

Jede Änderung die du in diesem globalen Element vornimmst (Elemente löschen, Elemente reinziehen, Stylings vornehmen), wird automatisch in allen Templates und Seiten vorgenommen, wo das globale Element vorkommt. In diesem Fall sind es die Templates „Startseite“ und „Seite“. Aber wenn du das globale Element an sich, also den globalen Bereich löscht, dann gehen die Elemente und Stylings dadrin nicht verloren.

Wäre der Bereich nicht leer gewesen, muss dieser überschrieben werden. Deshalb fragt dich Chimpify sicherheitshalber, ob du es wirklich machen willst.

Eine Besonderheit beim Header-Element: Dieser hat eigene globale Elemente. Das heißt, bei der Auswahl siehst du nicht alle globalen Elemente, sondern nur die globalen Header-Elemente.

© 2012-2018 by Chimpify UG (haftungsbeschränkt)