ACF – Flexible Inhalte

Mit dem Feld-Typ Flexible Inhalte lassen sich Accordions erstellen. Diese lassen sich beliebig erweitern und per drag&drop bequem mit der Maus nachträglich sortieren. Hier ein Beispiel an Hand einer DSGVO.

So soll das Ergebnis aussehen

Schritt 1: Feldgruppe anlegen


Unter dem Menüpunkt „Eigene Felder“ erstellen wir eine neue Feldgruppe mit dem Namen „DSGVO“ und erstellen als erstes ein Feld vom Typ Flexible Inhalte. Als Name habe ich Datenschutz geählt.

Innerhalb dieses Feldes erscheint der blaue „Feld hinzufügen“ Button und wir legen drei weitere Felder an:
Name, Typ und Bezeichnung stehen in der Liste.

NAME FELD-NAME TYP
Datenschutz datenschutz Flexible Inhalte
Admin Title layout_title Text einzeilig
Titel titel Text einzeilig
Content content WYSIWYG-Editor

Vor dem Speichern sollte man das Ganze noch einem Template oder anderem Inhaltstyp zuweisen.

Schritt 2. Javascript Datei in das Theme einfügen

So gut wie alle Themes haben einen Ordner namens „js“. Dorthin kopiert ihr die javascript-Datei, die ich im nächsten Schritt zum Download anbiete.
Damit euer Theme diese auch verwenden kann, fügt ihr in der functions.php unter „Enqueue scripts and styles“ folgende Zeile ein:

wp_enqueue_script( ‚Themename-acfacc‘, get_template_directory_uri() . ‚/js/acfaccordion.js‘, array(), ‚20151215‘, true );

Dateien zum Download

Im zip-Ordner sind

  • die oben erwähne javascript-Datei
  • ein Seitentemplate (bitte in Zeile 17 den Themenamen korrekt eintragen)
  • ein Beispiel css
  • ein Export der Feldgruppe

flexible_inhalte

Ansicht im Backend

Der Titel muss einmal für das Backend (Admin Title)und einmal für die Ausgabe im Frontend (Titel) eingegeben werden. Muss aber nicht zwingend der gleiche Titel sein.
Die einzelnen Accordions lassen sich per drag&drop neu sortieren.

Die Anwendungsmöglichkeiten von Flexible Inhalte sind vielfältig, denn man kann natürlich weiter Unterfelder einfügen. Hier ein weiteres Beispiel: eine Liste von Presseveröffentlichungen.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

*