WordPress Custom Fields

WordPress Custom Fields sind kleine Content-Blöcke, die man irgendwo auf der Seite anzeigen kann. Sie besitzen erst einmal kein festgelegtes Format oder Funktion. Was Custom Fields so praktisch macht möchte ich euch anhand von einem Beispiel erklären.

Zunächst einmal benutze ich das Advanced Custom Fields Plugin (ACF). In der Grundversion kann man eigentlich schon alles damit anstellen, was das Herz begehrt. Man muss allerdings ein klein wenig programmieren und sollte sich mit PHP und der Theme Hierarchy in WordPress auskennen.

Beispiel: Produkt

Nehmen wir an, wir haben eine Reihe von Produktreviews und unter jeder Review soll ein Kasten erscheinen mit folgendem Inhalt:

– Produktbild
– Produktname
– Produktbeschreibung
– Link zum Produkt

Mit dem ACF Plugin können wir nun einen “Field Group” erstellen, die genau diese Felder zur Verfügung stellt.

Zunächst geben wir unserer Field Group einen Namen: “Produkt Box”. Danach entscheiden wir, wo diese “Field Group” überall erscheinen soll. Es gibt sehr viele Kombinationen, die wir hier aussuchen können, in diesem Fall entscheiden wir uns dafür, die Field Group nur auf “Post-Seiten” anzuzeigen.

Unter Options können wir noch die Reihenfolge festlegen, falls wir mehrere Field Groups auf einer Seite anzeigen wollen, ob die Box in der Sidebar angezeigt wird und was für einen Style die Box haben soll. Diese Optionen beziehen sich nur auf die Anzeige im Backend und hat keinen Einfluss auf die Darstellung im eigentlichen Artikel.

Wenn wir das erledigt haben, können wir die Felder zu unserer Group hinzufügen. Zunächst geben wir das Field Label an, das Label erscheint als Feldbezeichnung auf der Post Seite. Der Fieldname wird aus dem Field Label generiert, kann aber auch selbst benannt werden. Wir fügen hier einfach ein “pro_” Prefix ein, falls wir später noch weitere Field Groups mit Bildern erstellen wollen.

Nun kommt der wichtigste Teil, der Field Type. Hier können wir den passenden Field Type für unsere Zwecke heraussuchen. Wir wählen hier Image aus, da wir als erstes ein Produktbild einfügen wollen. Wir können noch eine Beschreibung hinzufügen, falls das Feld eine genauere Beschreibung erfordert und wir können auswählen, ob das Feld ein Pflichteld ist.

Return Value und Preview Size sind Feld spezifische Einstellungen. Return Value ist wichtig, falls man eine genaue Vorstellung hat, wie man das Bild später einbauen möchte. Wir lassen hier einfach die Standardeinstellung, welches ein komplettes <img> Tag zurück gibt. Preview Size ist die größe des Vorschaubildes, nach dem man es hochgeladen hat.

Wenn alles eingestellt ist, einfach auf “Add Field” klicken und das nächste Feld hinzufügen. Wir wollen ein Produkttitel eingeben, dazu wählen wir als “Field Type” einfach Text aus, welches uns ein ganz normales einzeiliges Eingabefeld gibt. Hier können wir noch die Einstellung Formatting eingeben, welches festlegt ob HTML-Tags interpretiert werden sollen.

Für die Produktbeschreibung nehmen wir den Field Type Text Area, welches uns eine Textbox gibt. Wir könnten hier auch Wysiwyg Editor auswählen, was uns einen Texteditor ähnlich dem Post Editor in Wordrpess gibt. Auch hier können wir unter Formatting verschiedene Optionen, bezüglich des HTML Formattings, auswählen. Zu guter letzt fügen wir noch ein Text Field hinzu, um den Link zum Produkt zu speichern.

Wenn wir mit unserer Asuwähl zufrieden sind, müssen wir nur noch auf oben rechts auf “Veröffentlichen” klicken.

Jetzt wollen wir natürlich die Felder, die wir soeben angelegt haben, in unserem Theme anzeigen. Wie zu beginn angekündigt, müssen wir hier zu ein wenig programmieren. Also öffnen wir die single.php aus unserem Themes Verzeichnis und suchen die Stelle, an der der Inhalt ausgegeben wird typischerweise mit der Worpdress Funktion the_content(). Darunter fügen wir den folgenden Code ein:

Der Code gibt nun alle Daten aus, die wir zu diesem Artikel eingegeben haben. An dieser Stelle fehlt natürlich noch das Styling.

Fazit

Wir haben hier nur an der Oberfläche gekratzt, was man mit Custom Fields anstellen kann. Beispielsweise könnte man eine Field Group anlegen um Top 10 Listen zu erstellen. Man könnte sogar einen Text Spinner bauen (wozu auch immer man so etwas benutzen würde) der einem bestimmte Worte aus dem Text mit Worten aus einer Liste ersetzt. Benutzt habe ich das Plugin zum Beispiel um individuelle Überschriften für Artikel anzuzeigen, individuelle Headerbilder ein zu bauen und um technische Produktlisten in die Sidebar zu realisieren.

Wie Du WordPress mit Amazon verbindest, das kannst Du hier nachlesen.

Geschrieben von

Nico Graff

Nico Graff ist selbstständiger Webentwickler aus Köln. Er baut Programme und Services und schreibt über die Selbstständigkeit unter graff.cc.