Flexibler Inhalt ist der leistungsstärkste Feldtyp in Field Forge. Er verwandelt deinen WordPress-Editor in einen vereinfachten Seitenbuilder, indem er es Content-Managern ermöglicht, aus einer Reihe von vordefinierten Abschnittstypen auszuwählen und diese in beliebiger Reihenfolge anzuordnen. Jeder Abschnittstyp (genannt “Layout”) hat sein eigenes Set von Feldern, und Redakteure kombinieren Layouts, um einzigartige Seiten zu erstellen, ohne Code zu schreiben oder Design-Tools zu verwenden.
Denke so darüber nach: Dein Entwickler gestaltet die Abschnittsvorlagen (Hero Banner, Features Grid, Testimonials, CTA usw.) und definiert, welche Inhalte jeder benötigt. Dein Content-Team stellt dann Seiten zusammen, indem es auswählt, welche Abschnitte enthalten sein sollen, und die Inhalte ausfüllt. Jede Seite kann eine andere Kombination und Reihenfolge von Abschnitten haben.
Wie sich flexibler Inhalt von Wiederholern und Gruppen unterscheidet
| Funktion | Gruppe | Wiederholer | Flexibler Inhalt |
|---|---|---|---|
| Anzahl der Instanzen | Immer 1 | Mehrere Zeilen, alle identisch | Mehrere Abschnitte, jeder kann unterschiedlich sein |
| Unterfeldstruktur | Ein festes Set | Ein festes Set pro Zeile | Unterschiedliches Set für jeden Layouttyp |
| Redakteur fügt mehr hinzu | Nein | Ja — fügt identische Zeilen hinzu | Ja — wählt aus, welches Layout hinzugefügt werden soll |
| Beste Analogie | Ein einzelnes Formular | Eine Tabelle (gleiche Spalten) | Ein Seitenbuilder (verschiedene Abschnittstypen) |
Schritt-für-Schritt: Einen vollständigen Landing Page Builder erstellen
Das Szenario: Du verwaltest das Marketing für ein SaaS-Unternehmen. Dein Marketing-Team muss Landing Pages für Kampagnen, Produkteinführungen und Webinare erstellen. Jede Landing Page hat eine andere Struktur — einige beginnen mit einem Hero und enden mit einem CTA, andere haben Testimonials, gefolgt von einem Features Grid und dann einer Preistabelle. Du musst den Marketern die Flexibilität geben, alles zu erstellen, was sie brauchen, ohne jedes Mal einen Entwickler einzubeziehen.So erstellst du ein flexibles Inhaltsfeld mit fünf Layouttypen:
#### Erstellen der Feldgruppe
- Gehe zu Field Forge > Neue Feldgruppe
- Gib den Titel ein: Landing Page Builder
- Klicke auf Feld hinzufügen, wähle Flexibler Inhalt (unter Kombinierte Felder, PRO)
- Konfiguriere:
– Name: page_sections
– Anweisungen: Baue deine Seite, indem du die Abschnitte unten hinzufügst. Ziehe, um die Reihenfolge zu ändern. Jeder Abschnittstyp hat sein eigenes Set von Feldern.
– Schaltflächenbezeichnung: “Abschnitt hinzufügen” (passt den Standardtext der Schaltfläche “Layout hinzufügen” an)
#### Layout 1: Hero Banner
- Klicke in den Einstellungen für flexiblen Inhalt auf Layout hinzufügen
- Nenne es: Hero Banner
- Setze die Anzeige: Block
- Füge Unterfelder hinzu:
– Untertitel (Textarea) — Zeilen: 2, Wrapper: 100%
– Hintergrundbild (Bild) — Anweisungen: “Lade ein hochauflösendes Bild (mindestens 1920×1080) hoch,” Wrapper: 50%
– Hintergrundüberlagerung (Auswahl: Keine, Hell, Dunkel) — Wrapper: 50%
– Schaltflächentext (Text) — Platzhalter: “Loslegen”, Wrapper: 50%
– Schaltflächen-URL (URL) — Wrapper: 50%
#### Layout 2: Features Grid
- Klicke erneut auf Layout hinzufügen
- Nenne es: Features Grid
- Füge Unterfelder hinzu:
– Abschnittsuntertitel (Textarea) — Wrapper: 100%
– Spalten (Auswahl: 2 Spalten, 3 Spalten, 4 Spalten) — Standard: 3 Spalten, Wrapper: 50%
– Features (Wiederholer) — mit Unterfeldern:
– Icon (Bild) — Wrapper: 20%
– Titel des Features (Text) — Wrapper: 40%
– Beschreibung des Features (Textarea) — Zeilen: 2, Wrapper: 40%
#### Layout 3: Testimonials Carousel
- Klicke erneut auf Layout hinzufügen
- Nenne es: Testimonials
- Füge Unterfelder hinzu:
– Hintergrundfarbe (Farbauswahl) — Wrapper: 50%
– Zitate (Wiederholer) — Mindestzeilen: 2, mit Unterfeldern:
– Zitattext (Textarea) — Erforderlich: Ja, Wrapper: 100%
– Autorname (Text) — Erforderlich: Ja, Wrapper: 33%
– Autorentitel (Text) — Platzhalter: “CEO, Acme Corp”, Wrapper: 33%
– Autorenfoto (Bild) — Wrapper: 34%
#### Layout 4: Video Abschnitt
- Klicke erneut auf Layout hinzufügen
- Nenne es: Video Abschnitt
- Füge Unterfelder hinzu:
– Video-URL (oembed) — Anweisungen: “Füge eine YouTube- oder Vimeo-URL ein”, Wrapper: 100%
– Bildunterschrift (Text) — Wrapper: 100%
– Play-Button-Überlagerung anzeigen (Wahr/Falsch) — Standard: Ja, Wrapper: 50%
#### Layout 5: Call to Action Banner
- Klicke erneut auf Layout hinzufügen
- Nenne es: Call to Action
- Füge Unterfelder hinzu:
– Beschreibung (Textarea) — Zeilen: 2, Wrapper: 100%
– Schaltflächentext (Text) — Erforderlich: Ja, Platzhalter: “Kostenlose Testversion starten”, Wrapper: 33%
– Schaltflächen-URL (URL) — Erforderlich: Ja, Wrapper: 34%
– Hintergrundfarbe (Farbauswahl) — Wrapper: 33%
#### Standortregeln festlegen und speichern
- Scrolle nach unten zu den Standortregeln
- Setze: Seitentemplate ist gleich Landing Page
- Klicke auf Feldgruppe speichern
[Screenshot: der Editor für flexiblen Inhalt zeigt fünf zusammengeklappte Layouts — Hero Banner, Features Grid, Testimonials, Video Abschnitt und Call to Action — jeweils mit einem Layoutnamen und Feldanzahl]
Wie Redakteure eine Landing Page erstellen
Hier ist, was ein Mitglied des Marketing-Teams tut, wenn es eine neue Kampagnen-Landing Page erstellt:
- Erstelle eine neue Seite und wähle die Vorlage “Landing Page”
- Scrolle nach unten zum Metabox “Landing Page Builder”
- Klicke auf Abschnitt hinzufügen — ein Dropdown zeigt alle fünf Abschnittstypen
- Wähle Hero Banner — die Hero-Felder erscheinen in einer erweiterbaren Karte
- Fülle die Überschrift (“Transformiere deinen Workflow”), den Untertitel aus, lade ein Hintergrundbild hoch, setze die Überlagerung auf Dunkel, gib den Schaltflächentext und die URL ein
- Klicke erneut auf Abschnitt hinzufügen, wähle Features Grid
- Gib die Abschnittsüberschrift (“Warum Teams uns wählen”) ein, wähle 3 Spalten und verwende dann den Features-Wiederholer, um Feature-Karten mit Icons, Titeln und Beschreibungen hinzuzufügen
- Klicke auf Abschnitt hinzufügen, wähle Testimonials
- Füge 3-4 Kunden-Zitate mit Namen, Titeln und Fotos hinzu
- Klicke auf Abschnitt hinzufügen, wähle Video Abschnitt
- Füge eine YouTube-URL für ein Produktdemovideo ein, füge eine Bildunterschrift hinzu
- Klicke auf Abschnitt hinzufügen, wähle Call to Action
- Gib die CTA-Überschrift (“Starte deine kostenlose Testversion heute”), die Beschreibung, den Schaltflächentext, die URL ein und wähle eine Markenfarbe für den Hintergrund
- Überprüfe die Seitenstruktur — 5 Abschnitte sind jetzt vertikal aufgelistet
- Ziehe den Video Abschnitt über die Testimonials, wenn es so mehr Sinn macht
- Klicke auf Aktualisieren, um zu speichern
Die Seite hat jetzt fünf unterschiedliche Abschnitte, die jeweils vollständig angepasst sind, in der Reihenfolge, die der Redakteur gewählt hat.
Abschnitte im Editor verwalten
| Aktion | So geht’s |
|---|---|
| Neuen Abschnitt hinzufügen | Klicke auf Abschnitt hinzufügen und wähle einen Abschnittstyp aus dem Dropdown |
| Abschnitte neu anordnen | Ziehe einen Abschnitt über seine Kopfzeile nach oben oder unten |
| Einen Abschnitt duplizieren | Klicke auf das Duplikat-Symbol in der Abschnittsüberschrift (nützlich, um ähnliche Abschnitte schnell zu erstellen) |
| Einen Abschnitt entfernen | Klicke auf die X-Schaltfläche in der Abschnittsüberschrift — der Abschnitt und seine Daten werden entfernt |
| Einen Abschnitt einklappen | Klicke auf die Abschnittsüberschrift, um ihn zu öffnen oder zu schließen (hält den Bildschirm übersichtlich) |
| Den gleichen Typ zweimal hinzufügen | Wähle das gleiche Layout erneut — es gibt keine Begrenzung. Zwei Hero Banners oder drei CTAs sind vollkommen gültig |
Layout-Limits
Du kannst Mindest- und Höchstgrenzen für jeden Layouttyp festlegen:
| Einstellung | Beispiel | Zweck |
|---|---|---|
| Mindestanzahl für Hero Banner: 1 | Jede Landing Page muss mindestens einen Hero haben | Gewährleistet Konsistenz |
| Höchstanzahl für Hero Banner: 1 | Kann keine zwei Heroes hinzufügen (würde seltsam aussehen) | Verhindert Fehler |
| Höchstanzahl für Call to Action: 2 | Höchstens zwei CTAs pro Seite | Hält Seiten fokussiert |
| Keine Limits für Features Grid | Redakteure können so viele Feature-Abschnitte hinzufügen, wie sie benötigen | Maximale Flexibilität |
Tipps für effektives Design flexibler Inhalte
- Beginne mit 4-6 Layouts. Zu viele Optionen überfordern Redakteure. Du kannst später immer mehr hinzufügen.
- Benenne Layouts klar. Redakteure sehen diese Namen im Dropdown. “Hero Banner” ist besser als “Layout 1.”
- Passe den Schaltflächentext an. Ändere “Layout hinzufügen” in “Abschnitt hinzufügen” oder “Block hinzufügen” — das liest sich natürlicher.
- Verwende Layoutbeschreibungen. Jedes Layout kann eine kurze Beschreibung haben, die im Dropdown erscheint, um Redakteuren bei der Auswahl zu helfen.
- Füge einen Screenshot oder eine Mockup-Beschreibung in die Layoutanweisungen ein, damit Redakteure wissen, wie der Abschnitt auf der Website aussehen wird.
- Setze sinnvolle Standardwerte. Wenn die meisten CTAs die gleiche Hintergrundfarbe verwenden, setze sie als Standardwert, damit Redakteure sie nur ändern, wenn sie etwas anderes wollen.
> Was passiert ohne PRO: Flexibler Inhalt ist ausschließlich ein PRO-Feature. Ohne ihn müsstest du separate Feldgruppen für jeden Abschnittstyp erstellen und dich auf deinen Entwickler verlassen, um die Seitenstruktur hart zu codieren. Redakteure können Abschnitte nicht mischen oder ihre Reihenfolge steuern. Flexibler Inhalt ist das einzige, am stärksten wirkende PRO-Feature für Content-Teams, die Landing Pages erstellen.
> Gut zu wissen: Flexible Inhaltslayouts können jeden Feldtyp enthalten, einschließlich Wiederholern und Gruppen. Ein “Testimonials”-Layout kann einen Wiederholer enthalten, um mehrere Zitate zu haben. Ein “Hero Banner”-Layout kann eine Gruppe für “Schaltflächeneinstellungen” mit Text, URL und Farbe haben. Die Verschachtelungsmöglichkeiten ermöglichen es dir, sehr komplexe Seitenstrukturen zu modellieren und gleichzeitig die Bearbeitungserfahrung organisiert zu halten.
> Häufiger Fehler: Zu viele Layouts auf einmal zu erstellen. Beginne mit 4-5, die dein Team tatsächlich verwenden wird. Frage nach einem Monat deine Redakteure, welche Abschnittstypen sie sich wünschen würden, und füge diese hinzu. 15 Layouts am ersten Tag zu erstellen, bedeutet, dass die meisten ungenutzt bleiben und das Dropdown überladen.