Übersicht der Builder-Elemente

Unser Chimpify Builder hat viele Elemente, die du für deine Templates und Seiten verwenden kannst.

In diesem Beitrag lernst du, was diese Elemente genau bedeuten und wofür sie zu gebrauchen sind.

Bevor wir anfangen, solltest du mit folgenden Beiträgen vertraut sein:




Sektion

Ist ein wichtiges Element, um die Struktur deiner Seite zu bestimmen. Es sind einzelne Blöcke, die dein Layout einteilen. Eine Sektion hat eine feste Breite von 100% und geht somit über den gesamten Bildschirm.

Umgang mit Layout-Elementen (Sektion, Container, Spalten, Bereich)




Container

Ist eine Sammelbox für Elemente mit fester Breite, die automatisch zentriert wird. Er besitzt eine maximale Breite von 1170px auf großen Bildschirmen und wird bei kleineren Auflösungen automatisch berechnet.

Umgang mit Layout-Elementen (Sektion, Container, Spalten, Bereich)




Spalten

Spalten dienen dazu, deine Inhalte nebeneinander zu platzieren. Ähnlich wie bei einer Zeitung. Dabei existiert jede Spalte in einem Spalten-Element.

Umgang mit Layout-Elementen (Sektion, Container, Spalten, Bereich)




Bereich

Ein Bereich ist eine Sammelbox für Elemente. Ähnlich wie ein Container. Nur ist dieser wesentlich flexibler und kann ineinander verschachtelt werden. Du kannst einen Bereich als Layout-Element, Trennstrich und Form verwenden.

Umgang mit Layout-Elementen (Sektion, Container, Spalten, Bereich)




Bild

Ist ein Platzhalter, um per Doppelklick ein Bild auszuwählen bzw. hochzuladen. In den Einstellungen des Elements kannst du es dynamisch machen.




Überschrift

Ist ein Element einer H1-H5-Überschrift. Diese Hierarchie kannst du in den Einstellungen des Elements ändern. Außerdem kannst du sie dort auch dynamisch machen.




Text

Ist ein einfaches Text-Element, das du oft gebrauchen kannst. Auch hier kannst du es in den Einstellungen dynamisch machen.




Call-to-Action (CTA)

Ist ein Bereich für deinen CTA. Dort kannst du einen bestehenden Call-to-Action laden oder einen neuen erstellen. Damit dieser funktioniert, musst du Elemente wie z. B. „Eingabfeld Kontakte“ und „Button“ hineinziehen. Ein Call-to-Action-Element ist immer automatisch global.

Call-to-Action (CTA) erstellen und bearbeiten




Formular

Ist ein Bereich für deine Formulare, wie z. B. ein Kontaktformular. Du kannst ein bestehendes Formular laden oder ein neues erstellen. Ziehe dafür z. B. „Eingabefeld und Label“ und "Button" hinein. Ein Formular ist automatisch immer global.




Eingabefeld und Label

Ist ein Formularfeld mit Label. Brauchst du, um es in einen Formular-Bereich reinzuziehen. Mit einem Doppelklick auf ein Element in diesem Element (z. B. das Label), kannst du es anvisieren und danach stylen.




Text und Label

Ist ein großes Textfeld mit Label. Brauchst du, um es in einen Formular-Bereich reinzuziehen. Mit einem Doppelklick auf ein Element in diesem Element (z. B. das Label), kannst du es anvisieren und danach stylen.




Eingabefeld Kontakte

Ist ein Formularfeld, das du brauchst, um es in einen Call-to-Action-Bereich reinzuziehen. Damit wird nach der Eingabe ein E-Mail-Kontakt in Chimpify (oder einem anderen E-Mail-Marketing-Anbieter) generiert.




Eingabfeld Custom

Ist ein Eingabefeld, bei dem du den Namen des Formulars selbst bestimmten kannst. Brauchst du, um eigene Formulare zu erstellen. //Verstehe ich nicht




Checkbox

Ist eine Checkbox für ein Formular. Du kannst sie in den Einstellungen des Elements als Pflichtfeld markieren.




Button

Ist ein Button, den du entweder als Link oder als Formular-Button einstellen kannst. Wenn er als Formular-Button dargestellt werden soll, muss dieser in einem CTA- oder Formular-Bereich platziert werden.




Ist ein Header-Element, das das Logo und die Navigation beinhaltet.

Header-Element bearbeiten




Share Buttons

Sind die Social Share Buttons zum Teilen der aktuellen Seite. Diese kannst du „Absolut“ platzieren, dann kleben sie links, oben, rechts oder unten am Bildschirmrand. Alternativ kannst du diese „Inline“ positionieren, dann kleben sie nicht am Bildschirmrand, sondern sind in einem Bereich und du kannst sie verschieben. Mit einem Doppelklick auf ein Element in diesem Element kannst du es anvisieren und danach stylen. Unter Einstellungen > Allgemein > Social kannst du die Sozialen Netzwerke verwalten.




Meta-Daten

Ist eine Anzeige für Autor, Datum und Anzahl der Kommentare sowie Shares des Beitrags oder der Content-Seite. Brauchst du in der Regel für dein Beitrags-Template. Mit einem Doppelklick auf ein Element in diesem Element (z. B. auf den Namen), kannst du es anvisieren und danach stylen.




Autorenbox

Ist eine Autorenbox, die den Autorennamen, Autorenbild, Autorentext und die Sozialen Netzwerke des Autoren beinhaltet. Die einzelnen Elemente in diesem Element kannst du in den Einstellungen ausblenden. Du brauchst die Autorenbox in der Regel für dein Beitrags-Template. Mit einem Doppelklick auf ein Element in diesem Element (z. B. auf das Autorenbild), kannst du es anvisieren und danach stylen.




Kommentare

Ist ein Kommentar-Bereich, der die Kommentare sowie das Kommentar-Formular beinhaltet. Brauchst du in der Regel für dein Beitrags-Template. Mit einem Doppelklick auf ein Element in diesem Element (z. B. auf den Kommentar-Namen), kannst du es anvisieren und danach stylen.




Loop

Ist ein Bereich, in dem du dynamische Elemente wie ein dynamisches Bild, Überschrift und Text sowie Meta-Daten reinziehen kannst. Diese dynamischen Elemente werden dann immer in einem Loop ausgegeben, solange, wie du es in den Einstellungen des Loops hinterlegt hast. Brauchst du in der Regel für dein Beitragsübersicht-Template.

Loop-Element verstehen verwenden




Seitenumbruch

Ist passend für dein Loop-Element, um einen Seitenumbruch zu ermöglichen. Muss sich außerhalb des Loop-Elements befinden, damit es ordentlich funktioniert. Am besten direkt darunter. Mit einem Doppelklick auf die Seitenzahl (die Seitenzahl 5 ist der Mouseover), kannst du sie anvisieren und danach stylen.




Blog-Suche

Ist ein Suchfeld für einen Blog. Brauchst du in der Regel für dein Suchergebnisse-Template. Mit einem Doppelklick auf das Eingabfeld, kannst du es anvisieren und somit stylen. // Brauche ich hier ein Loop-Element für?




Icon

Ist ein einfaches Element, um Icons von Font Awesome in dein Design zu integrieren.




HTML

Ist ein Element, um HTML-Code hinzufügen.




JavaScript

Ist ein Element, um JavaScript-Code hinzufügen.

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