✅ WEB- und WordPress-Nachrichten, Themen, Plugins. Hier teilen wir Tipps und beste Website-Lösungen.

Kodierung für erweiterte benutzerdefinierte Felder: Eine Einführung

57

Advanced Custom Fields (ACF) ist ein WordPress-Plugin, das ein großartiges Tool zum Einrichten von benutzerdefinierten Post-Meta ist. Es ermöglicht Ihnen, komplexe und benutzerfreundliche Metaboxen mit allen Arten von Feldern und Einstellungen für Beitragstypen, Taxonomie, Benutzerbildschirme und Optionsseiten einfach zu erstellen und zu konfigurieren. Und es ist super entwicklerfreundlich.

Jetzt könnten Sie Ihre eigenen Metaboxen oder Einstellungen manuell einrichten, aber für komplexere Einstellungen müssen Sie ziemlich viel codieren, einschließlich Styling, Javascript, Validierung und Handhabung des Speicherns. Stellen Sie sich zum Beispiel vor, manuell einen Repeater mit einer Gruppe von Einstellungen zu schreiben, eine Mehrfachauswahl von Beiträgen durch eine bestimmte Abfrage. Oder die Behandlung von Anzeigeeinstellungen, die von bestimmten Variablen abhängen, z. B. welcher Begriff oder welche Seitenvorlage zugewiesen ist (was Javascript erfordert). Advanced Custom Fields handhabt all dies, und das auf wunderbare Weise.

Denken Sie daran, dass erweiterte benutzerdefinierte Felder keine Ihrer benutzerdefinierten Metadaten in Ihren Vorlagen ausgeben. Das Ausgeben oder Ausführen von etwas basierend auf den mit ACF eingerichteten Feldern und Einstellungen liegt bei Ihnen als Entwickler. Dies lässt sich jedoch leicht mit einer der Methoden von ACF bewerkstelligen. Es ist auch schön zu wissen, dass ACF die Metafunktionalität des WordPress-Kerns (Post, Begriff, Benutzer) nutzt. Das heißt, es speichert z. B. Einstellungen für Posts tatsächlich als Post-Meta – die Sie mit Kernfunktionen wie get_post_meta().

Erweiterte benutzerdefinierte Felder gibt es in einer kostenlosen Version und einer kostenpflichtigen Pro-Version. Die kostenlose Version ist für die meisten Fälle mehr als ausreichend, aber in der Pro-Version erhalten Sie einige zusätzliche Funktionen wie ein Repeater-Feld, ein Galeriefeld, Gutenberg-Blöcke (siehe später) und die Möglichkeit, mit ACF Ihren eigenen benutzerdefinierten Admin einzurichten Optionsseiten. ACF ist auch so beliebt, dass Sie problemlos hochwertige Erweiterungen für alles finden können, was das Kern-ACF nicht selbst abdeckt.

Erweiterte benutzerdefinierte Felder: Der Admin-Teil

Wenn Sie das Advanced Custom Fields-Plugin installieren, erhalten Sie ein neues Admin-Menü für „Custom Fields”. Hier können Sie Ihre „Meta-Boxen” oder Gruppen von Einstellungen einrichten und konfigurieren.

Innerhalb einer Gruppe können Sie beliebig viele Felder unterschiedlichen Typs anlegen. Die gebräuchlichsten sind Texteingabe, Textbereich, Richtext-Editor, Datei, Bild, wahr/falsch (Umschalter), Kontrollkästchen, Optionsfelder und Auswahlfelder. Andere gängige sind mehrere Möglichkeiten, Beiträge auszuwählen, Taxonomie auszuwählen, Benutzer auszuwählen, Datumsauswahl, Farbauswahl, Google Maps und viele, viele mehr. Je nachdem, welchen Feldtyp Sie auswählen, erhalten Sie eine Reihe zusätzlicher Optionen zum Anpassen des Felds. Sie können jedem Feld auch bedingte Logik hinzufügen. Bedingte Logik dient zum Ausblenden oder Anzeigen von Feldern in Abhängigkeit von anderen Optionen innerhalb der Gruppe.

Für jede Gruppe von Einstellungen können Sie festlegen, in welchen Fällen diese Einstellungen erscheinen sollen. Beispiele sind das Bearbeiten von Beiträgen, eines Taxonomiebegriffs oder das Bearbeiten eines Benutzers. Sie können die Sichtbarkeit Ihrer Einstellungen beispielsweise für den Beitragstyp weiter anpassen. Oder wenn einem Beitrag ein bestimmter Begriff oder eine Seitenvorlage zugeordnet ist, wenn ein Beitrag von einem bestimmten Autor stammt, wenn die Benutzerrolle so oder so ist, die Rolle des aktuell angemeldeten Benutzers oder wenn die Seite eine übergeordnete Seite ist oder nicht. Sie können auch anpassen, wo die Metabox erscheinen soll. Allerdings ist diese Funktionalität jetzt mit dem neuen Gutenberg-Editor etwas eingeschränkt.

Kodierung für erweiterte benutzerdefinierte Felder: Eine Einführung

Gruppe gründen

Kodierung für erweiterte benutzerdefinierte Felder: Eine Einführung

Einstellungen für ein einzelnes Feld

Erweiterte benutzerdefinierte Felder: Der Codeteil

Werfen wir einen Blick auf den interessanteren Teil: wie Sie erweiterte benutzerdefinierte Felder per Code nutzen können. Wie bereits erwähnt, ist ACF super entwicklerfreundlich und bietet eine breite Palette an Anpassungsmöglichkeiten.

Das Erfassen von Werten und deren Ausgabe in Ihren Vorlagen ist mit den Methoden von ACF einfach möglich. Beispielsweise the_field('your_meta_key')zum direkten Echo oder get_field('your_meta_key')zum Speichern in einer PHP-Variablen. Geben Sie die Post-ID als zweites Argument an, wenn Sie Daten außerhalb der Schleife abrufen müssen. Kinderleicht. Sie könnten verwenden get_post_meta(), aber es wird empfohlen, die Methoden von ACF zu verwenden, da ACF den Wert in etwas Aussagekräftigeres umwandeln kann, bevor er Ihnen zurückgegeben wird.

Eine weitere Sache, die Sie beachten sollten, ist das Export-Tool in ACF. Sie können erstellte Gruppen in zwei Formate exportieren; entweder eine herunterladbare JSON-Datei oder reiner PHP-Code. Die JSON-Datei ist nützlich, wenn Sie Einstellungen zwischen Test- und Live-Servern oder einem anderen WordPress exportieren müssen. Der Export in reines PHP gibt Ihnen die Möglichkeit, es direkt in Ihre Theme- oder Plugin-PHP-Dateien einzufügen.

Wie Sie daraus schließen könnten; Sie können PHP-Code verwenden, indem Sie ihn entweder manuell schreiben oder nach dem Einrichten in Admin exportieren, um Ihre Gruppen und Felder hinzuzufügen. Dies ermöglicht mehr Kontrolle und Möglichkeiten, benutzerdefinierte Auswahlmöglichkeiten zu generieren.

Aber warte, es gibt noch mehr! ACF bietet auch eine breite Palette von Aktionen und Filtern, um die Felder oder ihre Werte weiter anzupassen. Es gibt Hooks für das Speichern oder Rendern eines Felds sowie Hooks zum Registrieren von Gruppen nach Code (oben erwähnt) und Filter zum Anpassen der Werte, Einstellungen oder Auswahlmöglichkeiten des Felds vor dem Speichern oder vor dem Rendern. Sie können außerdem angeben, ob der Filter alle Felder, Felder eines bestimmten Typs oder Felder eines bestimmten Metaschlüssels betreffen soll. Allen Hooks und Filtern ist das Präfix vorangestellt acf/.

Werfen Sie einen Blick auf die Dokumentationsseite von ACF ; Klicken Sie auf ‘Funktionen’, ‘Aktionen’ oder ‘Filter’ für eine Übersicht. Auf dieser Website finden Sie auch großartige Tutorials und Anleitungen.

Ein Hinweis zu erweiterten benutzerdefinierten Feldern und Gutenberg

Das Erstellen benutzerdefinierter Gutenberg-Blöcke ist im Moment ziemlich entmutigend. Die Dokumentation ist nicht ganz vorhanden, es werden häufig Änderungen daran vorgenommen, und es erfordert einiges an Javascript-Kenntnissen, um zu programmieren. Vorzugsweise benötigen Sie Kenntnisse über React und wie man Compiler von JSX/ES6 mit Webpack und Babel einrichtet.

In Version 5.8 führte ACF Pro jedoch eine Funktion ein, um eine Feldgruppe als Gutenberg-Block einzurichten – so dass Sie benutzerdefinierte Blöcke nur mit ACF- und PHP-Code hinzufügen können. Keine Javascript-Kenntnisse notwendig!

Alles, was Sie tun müssen, ist, die Gruppen wie gewohnt in admin oder per Code einzurichten. Aber dann definieren sie ihren Standort als Gutenberg-Block. Alles, was bleibt, ist das Hinzufügen von etwas PHP-Code, um sie als benutzerdefinierten Gutenberg-Block mit zu registrieren acf_register_block(). Zu dieser Funktion definieren Sie einen Rückruf zu einer PHP-Funktion oder Vorlagendatei, die für das Rendern der Blockausgabe verantwortlich ist. Sie schreiben diesen Funktions- oder Vorlagenteil vollständig in PHP und verwenden vertraute Methoden, z. B. get_field()zum Abrufen der Einstellungswerte.

Kodierung für erweiterte benutzerdefinierte Felder: Eine Einführung

Wie ein ACF-Block im Gutenberg-Editor aussieht

Bleiben Sie in der Kategorie „Erweiterte benutzerdefinierte Felder” auf dem Laufenden, um Tutorials zur Verwendung dieses Plugins zu erhalten!

Aufnahmequelle: awhitepixel.com

Diese Website verwendet Cookies, um Ihre Erfahrung zu verbessern. Wir gehen davon aus, dass Sie damit einverstanden sind, Sie können sich jedoch abmelden, wenn Sie möchten. Annehmen Weiterlesen