„Du kennst Advanced Custom Fields (ACF) nicht? Ohne ACF würde ich WordPress definitiv nicht mehr verwenden.“ Dies hat mir ein Kollege vor einigen Wochen via Slack geschrieben. Er ist allerdings Entwickler, ich Designer. Spätestens zu diesem Zeitpunkt wurde mir jedoch bewusst, dass ich mich damit beschäftigen sollte (und wollte).
Was sind Advanced Custom Fields (ACF)?
WordPress an sich bietet bereits sehr vielfältige Funktionen. Mit den Advanced Custom Fields (ACF) kannst du diese Funktionen nochmals stark erweitern – in der Standard Version kostenlos. Sie erlauben dir die volle Kontrolle über den Inhalt deiner Website.
Standardmäßig finden wir im Backend für Beiträge sowie Seiten typische Felder wie Titel, Inhalt, das Datum sowie den Autor. Advanced Custom Fields, bzw. das weiter unten erwähnte Plugin, geben dir die Möglichkeit, WordPress und damit Seiten sowie Beiträge praktisch beliebig und individuell zu erweitern.
Damit ist mit WordPress so gut wie alles möglich – Advanced Custom Fields gewissermaßen als Tuning für WordPress.
Du verwaltest 5, 50 oder 500 WordPress Projekte? Wir zeigen dir, wie es einfacher geht
Wofür benötige ich Advanced Custom Fields?
Kurz zusammengefasst: Du benötigst Advanced Custom Fields vermutlich dann, wenn du mit den Bordelementen im WordPress Backend nicht mehr weiterkommst. Du stehst vor einer Herausforderung, die mit Hilfe von Seiten oder Beiträgen nicht oder nur teilweise realisiert werden kann. Dies kann, je nach Kundenwunsch, relativ schnell der Fall sein.
Bei mir war es beispielsweise so, dass ich eine Suche mit Filterkriterien bauen durfte. Also keine einfache Textsuche, welche über die ganze Website nach passenden Inhalten sucht, sondern eine Suche, bei der zuvor via Formular spezifische Daten eingegeben werden können. Der User hat verschiedene Filterkriterien zur Verfügung. Unter anderem sind dies:
- Name (Textfeld)
- Postleitzahl (Textfeld)
- Land (Dropdown)
- Zertifikate (Checkbox)
Dazu aber später noch mehr. Dieser Anwendungsfall hat mich auf die Idee gebracht, Advanced Custom Fields (ACF) einzusetzen. Eine derartig individuelle Suche ist mit WordPress Bordelementen ohne ACF schlicht nicht möglich.
Advanced Custom Fields: Das kostenlose Plugin
Ich habe somit nach einer Lösung gesucht, diese Filtersuche mithilfe von Advanced Custom Fields umzusetzen.
Das gleichnamige Plugin im offiziellen WordPress Plugin Verzeichnis wird ständig weiterentwickelt, sodass immer wieder neue Funktionen erscheinen. Wer ganz nahe am Geschehen dran sein möchte, kann ACF auf Twitter folgen.
Das ACF Plugin ist auf weit über 1 Million Websites aktiv. Es wird intensiv getestet und funktioniert mit der neuesten WordPress Version tadellos. Ebenfalls beeindruckend ist, dass das Plugin bereits mehr als 1.000 Bewertungen mit 5 Sternen erhalten hat. Dem gegenüberstehen mickrige 40 Bewertungen mit nur einem Stern – sehr wahrscheinlich User, welche nach (sehr) kurzer Zeit aufgegeben haben.
Bei einem solchen Plugin ist klar: Es erfordert etwas Zeit und Geduld, bis du die Anwendung verstanden hast. Auch ich habe selbstverständlich erst an der Oberfläche von Advanced Custom Fields gekratzt. Ich möchte damit lediglich zum Ausdruck bringen, dass es andere Plugins gibt, die du installierst und dann funktionieren diese bequem im Hintergrund – das ist bei ACF anders. Du musst aktiv gestalten und den Gesamtzusammenhang zwischen Datenbank, Backend und Frontend erkennen.
Was bei diesem Plugin, welches doch ziemlich technisch ist, ebenfalls unentbehrlich ist: der Support.
Diesen habe ich bisher selber noch nicht beanspruchen müssen. Der Grund ist denkbar simpel: Die erstklassige Dokumentation, welche Feld Typen, Funktionen, Filter sowie FAQ abhandelt.
Abonniere den Raidboxes Newsletter!
Wir liefern dir einmal monatlich topaktuelle WordPress Insights, Business Tipps & mehr.
Was sind Custom Post Types?
Zuvor hatte ich erwähnt, dass eine aktive Gestaltung notwendig ist. Dies bedeutet bei Advanced Custom Fields auch, dass dir diese allein in gewissen Fällen nicht viel Nutzen bringen. Erst in Kombination mit Custom Post Types ergeben sich weitere Optionen.
Zuerst stellt sich die Frage: Was ist ein (normaler) Post Type?
Die zwei bekanntesten in WordPress sind Seiten (Pages) und Beiträge (Blog Posts). Bei jedem neu zu erstellenden Inhalt für eine Website entscheidest du also, welcher Post Type der Passende ist. Dies ist von verschiedenen Faktoren abhängig, unter anderem der Art, wie die Informationen sichtbar sein sollen und welche Felder du dafür im Backend benötigst.
Wie verhält es sich jedoch, wenn du Inhalte bereitstellen möchtest, die weder von einer normalen Seite noch mit einem Beitrag abgedeckt werden können?
Du ahnst es vielleicht schon: Du benötigst eine neue Art, die Inhalte im Backend einzupflegen. Quasi eine Eingabemaske mit exakt den Feldern, welche du benötigst. Das können dir die Advanced Custom Fields bieten. Das oben erwähnte gleichnamige Plugin erlaubt es dir, diese Felder bequem im Backend zu definieren und zu erstellen. Steht diese Struktur einmal, kommt der nächste Schritt.
Dann kommen nämlich Custom Post Types zum Einsatz. Ganz wichtig ist hier, dass es sinnvoll ist, für die Nutzung von Advanced Custom Fields einen eigenen Custom Post Type zu erstellen. In meinem Fall nenne ich den Custom Post Type (CPT) einfach mal „Therapeuten“.
Du kannst den Custom Post Type natürlich auch selbst programmieren. Ich habe dafür jedoch das Plugin «Custom Post Type UI» genutzt, welches ich im nächsten Abschnitt noch genauer erläutern werde.
Custom Post Type UI: Kostenloses Plugin
Falls das bisher für dich lediglich mit den Advanced Custom Fields (ACF) zu wenig Magie war, kommt hier das Beste: ACF in Kombination mit Custom Post Type UI, kurz CPT UI.
Damit kannst du Datenbankinhalte nach Wunsch direkt im Frontend anzeigen. In meinem Fall stand ich vor der Herausforderung, eine Filtersuche mit verschiedenen Feldern bauen zu wollen. Ich musste somit zuerst alle Daten mittels eines CSV Imports ins Backend hochladen.
Danach habe ich mit Hilfe des Custom Post Type sowie den Advanced Custom Fields die Basis für die Filtersuche im Frontend aufgebaut. Mehr dazu gleich im nächsten Abschnitt.
Praxisbeispiel: Suche mit Filterkriterien bauen
Soviel für den Moment zum Backend. Jetzt geht es in das Frontend. Damit du das Ganze auch anwenden und die individuellen Advanced Custom Fields für deinen Fall nutzen kannst.
Ich habe die ACF eingesetzt, um eine individuelle Suche mit Filterkriterien zu bauen. Wie ist es jedoch möglich, die Inhalte vom Backend elegant im Frontend zu präsentieren, sodass eine Interaktion durch den User möglich ist?
Auch hier hast du wieder die Wahl zwischen selbst entwickeln und einem Plugin. Ich habe erneut lange nach einem guten Helferlein gesucht und bin dann schlussendlich auf Search & Filter Pro gestoßen.
Damit habe ich auf eine geniale Art und Weise die Möglichkeit, die im Backend vorhandenen Daten für die Darstellung im Frontend zu nutzen. In meinem Beispiel sind das:
- Search (normales Suchfeld)
- Post Meta (Zugriff und Suche auf das jeweilige Advanced Custom Field in der Datenbank)
- Submit Button (Button zum Abschicken der Suchabfrage bzw. des Formulars)
Im Backend kann dies dann wie folgt aussehen:
Anschließend kannst du mittels Shortcode die soeben erstellte Filtersuche an beliebiger Stelle im Backend (beispielsweise auf einer Seite) einfügen.
Du wirst jedoch sehen, dass diese dann noch etwas unschön ausschauen wird. Ich habe dies durch einige CSS Handgriffe verbessert und finde, das Resultat im Frontend kann sich durchaus sehen lassen:
Links
Ich bin gespannt, was ich in Zukunft noch mit Advanced Custom Fields umsetzen darf. Hast du Fragen oder Bemerkungen zu diesem Artikel? Dann freue ich mich über zahlreiche Rückmeldungen.
Deine Fragen zu ACF
Welche Fragen zu ACF und WordPress hast du? Nutze gerne die Kommentarfunktion. Du willst über neue Beiträge zum Thema WordPress und Webdesign informiert werden? Dann folge uns auf Facebook, LinkedIn oder über unseren Newsletter.
Schreibe einen Kommentar zu Ana Nas Antworten abbrechen