Mit WordPress 6.5 wird eine neue Funktion eingeführt: die Block Bindings API. Dies ist ein Tool, das die Verwendung des Block-Editors vereinfacht und es Ihnen erleichtert, alle Arten von Daten zu verschiedenen Teilen Ihrer Website hinzuzufügen. Das bedeutet, dass Sie bei der Bearbeitung viel weniger eigenen Code schreiben müssen.
Was ist die Block Binding API?
Angenommen, Sie haben einen Basisblock, den Sie auf einer Webseite verwenden müssen, um Informationen aus einer bestimmten Quelle anzuzeigen, z. B. die Details eines Artikels oder einige benutzerdefinierte Regeln, die in PHP-Code formuliert sind. Wie machen Sie das? Hier ist der Weg, um es einfach und klar zu machen.
Wenn Sie in früheren WordPress-Versionen spezielle Informationen auf einer Webseite anzeigen wollten, z. B. zusätzliche Details zu einem Beitrag oder einen durch PHP-Logik angepassten Inhalt, mussten Sie in der Regel einen ganz neuen benutzerdefinierten Block erstellen. Dieser Vorgang konnte sowohl kompliziert als auch zeitaufwändig sein.
Seit WordPress 6.5 sind die Dinge jedoch viel einfacher geworden. Mit der Block Binding API können Sie jetzt einen bestehenden Standardblock, wie z. B. einen Absatz oder einen Titel, Daten direkt aus einer anderen Quelle abrufen lassen, ohne selbst einen völlig neuen Block erstellen zu müssen. Das bedeutet, dass ein Absatzblock direkt Metadaten für einen Beitrag oder ein Titelblock von einem Plugin generierte PHP-Logik anzeigen kann, ohne dass Sie sich in die React-Programmierung, die Blockregistrierung oder die Erstellung eines neuen benutzerdefinierten Blocks von Grund auf einarbeiten müssen.
Die Block Binding API von WordPress 6.5 ist ein wichtiges Update, das die Erweiterung des Editors und der Blöcke erheblich erleichtert. Tatsächlich wurde diese neue API verwendet, um zu demonstrieren, wie die benutzerdefinierten Felder eines Beitrags mit einem Kernblock verknüpft werden können.
Wenn Sie etwas fortgeschrittener sind, können Sie diese Funktion auch nutzen, um Blöcke anzupassen und Daten aus speziellen, von Ihnen eingerichteten Quellen abzurufen.
Einen ausführlichen Einblick in die Erstellung und Verwendung von Blockbindungen finden Sie im WordPress-Entwicklerblog auf derEinführendes Tutorial.
Wie funktioniert die Blockbindung?
skizziert.
Bevor wir uns mit der Verwendung der Blockbindungs-API zur Verknüpfung mit einer benutzerdefinierten Datenquelle befassen, werden wir kurz erklären, wie diese API funktioniert. Anschließend gehen wir näher darauf ein, wie man einen Standardblock mit einem benutzerdefinierten Feld in einem Artikel verknüpft.
Nachfolgend finden Sie eine Tabelle mit den Blöcken, die jetzt verknüpft werden können, und ihren Eigenschaften:
Es gibt zwar noch nicht viele Blöcke und Attribute, die mit dieser neuen Funktion verwendet werden können, aber sie reichen aus, um viele gängige Bedürfnisse abzudecken. Für die Zukunft ist geplant, diese Funktion auf weitere Kern- und benutzerdefinierte Blöcke zu erweitern.
Um die Blockbindung zu verwenden, müssen Sie sie so einrichten, dass WordPress bestimmte Tags verwendet, um Informationen aus den von Ihnen gewählten Datenquellen abzurufen. Nach der Einrichtung wird die Logik aus diesen Datenquellen verwendet, um den Inhalt anzuzeigen, wenn er im Frontend der Seite angezeigt wird.
Sobald eine Eigenschaft gebunden ist, können Sie sie im Editor nicht mehr ändern, und der Editor zeigt eine Markierung an, die Ihnen mitteilt, dass die Eigenschaft bereits mit einer Datenquelle verbunden ist.
Hier ein Beispiel dafür, wie Sie die Vorteile der integrierten Unterstützung für benutzerdefinierte Felder nutzen können.
Benutzerdefinierte Felder
In der ersten Version der Block Binding API gab es keine direkte Schnittstelle, um Eigenschaften mit benutzerdefinierten Feldern zu verknüpfen. Das bedeutet, dass Sie manuell in den Code-Editor von Gutenberg gehen müssen, um spezifischen Code hinzuzufügen.
Wenn Sie die unterstützten Attribute mit den benutzerdefinierten Feldern des Artikels verbinden möchten, können Sie den Code in folgendem Format hinzufügen:
<!-- wp:paragraph {
"metadata":{
"bindings":{
"content":{
"source":"core/post-meta",
"args":{
"key":"book-genre"
}
}
}
}
} -->
<p></p>
<!-- /wp:paragraph -->Damit dies funktioniert, müssen Sie einen Code in die Datei functions.php Ihres Themes oder ein Plugin einfügen, um sicherzustellen, dass Ihre benutzerdefinierten Felder erfolgreich in den Metadaten des Beitrags registriert wurden.
register_meta(
'post',
'book-genre'.
array(
show_in_rest' => true,
'single' => true,
'type' => 'string', 'single' => true, 'type' => 'string', 'single' => true
'default' => 'Standard-Textfeld',
)
);Denken Sie daran, dass Sie zur Sicherheit diezeigen_in_ruheEigenschaft wird aufwahr.
Mehr Datenquellen für die Zukunft
Die Unterstützung von Beitrags-Metadaten ist nur der erste Schritt. Wir planen, in WordPress 6.6 weitere Datenquellen hinzuzufügen, z. B. Standortinformationen, Benutzerinformationen und Kleinanzeigen.
Und mit der Block Binding API können Sie jetzt Ihre eigenen Datenquellen registrieren, was dieselbe Funktionalität ist, die wir für die Registrierung von Artikelmetadaten verwenden.
Registrieren einer benutzerdefinierten Quelle
skizziert.
Um eine neue blockgebundene Datenquelle zu erstellen, müssen Sie eine blockgebundene Datenquelle namensregister_block_bindings_source()Funktion, hier ist das grundlegende Format:
register_block_bindings_source(
string $source_name,
array $source_properties
).Um eine neue Blockbindungsquelle zu registrieren, können Sie zwei Parameter verwenden:
- $Quelle_nameNamespace: Dies ist der eindeutige Bezeichner Ihrer benutzerdefinierten Datenquelle und sollte das Format "namespace/name" haben. Denken Sie daran, dass jede Datenquelle einen eindeutigen Namespace benötigt.
- $source_propertiesDatenquelle: Dies ist ein Array, das die Merkmale der Datenquelle definiert, einschließlich:
- EtikettText: Dies ist ein Text, der Ihre Datenquelle beschreibt, obwohl diese Bezeichnung derzeit nicht in der Schnittstelle sichtbar ist.
- get_value_callbackPHP-Funktion: Dies ist eine PHP-Funktion oder -Schließung, die aufgerufen wird, wenn die Bindungsquelle des Blocks die Daten verwenden muss.
- verwenden_kontext(optional): Dies ist ein Array, das angibt, was enthalten sein soll, wenn Ihre Datenquelle zusätzliche Informationen benötigt (z. B. die ID des aktuellen Artikels).
Wenn WordPress den Block verarbeitet und eine benutzerdefinierte Datenquelle zum Laden findet, ruft es dieget_value_callbackFunktion. Die Funktion sollte wie folgt aufgebaut sein:
projectslug_bindings_callback(
Array $source_args,
WP_Block $block_instance,
string $attribut_name
).Nutzung von Registrierungsmechanismen
In der Praxis können Sie die folgenden Registrierungsfunktionen verwenden, um einfache Bindungen für Urheberrechtsinformationen zu erstellen:
add_action( 'init', 'projectslug_register_block_bindings' );
function projectlug_register_block_bindings() {
register_block_bindings_source( 'projectslug/copyright', array(
label' => __( 'Copyright', 'projectslug' ),
'get_value_callback' => 'projectlug_copyright_binding'
) );
}
function projectlug_copyright_binding() {
return '© ' . date( 'Y' ); } function projectslug_copyright_binding() { return '© ' .
}Das folgende Beispiel zeigt, wie ein Absatzblock mit einer Datenquelle für Copyright-Informationen verknüpft werden kann und wie dies auf dem Frontend einer Website aussieht:
<!-- wp:paragraph {
"metadata":{
"bindings":{
"content":{
"source":"projectslug/copyright"
}
}
}
} -->
<p>Copyright Block</p>
<!-- /wp:paragraph -->
Natürlich ist dies nur ein einfaches Beispiel. Sie können andere Parameter in der Funktion verwenden, um komplexere Funktionen zu erstellen.
Andere API-Funktionen
Darüber hinaus gibt es eine Reihe weiterer Funktionen, die derzeit öffentlich zugänglich sind:
- unregister_block_bindings_source($source_name)Datenquelle: Dient zum Aufheben der Registrierung einer bereits eingestellten Datenquelle.
- get_all_registered_block_bindings_sources()Liste: Dient dazu, eine Liste aller registrierten Datenquellen zu erhalten.
- get_block_bindings_source($source_name)Wird verwendet, um die Details einer bestimmten registrierten Datenquelle zu erhalten.
Beachten Sie auch, dass die wichtigsten Datenquellen zwar in der Benutzeroberfläche des Editors zur Verfügung stehen, diese APIs für den Editor aber derzeit noch privat sind. Das bedeutet, dass wir noch darüber diskutieren, wie wir die Verwendung dieser Funktionen in der Benutzeroberfläche standardisieren können.
Wenn Sie also eine benutzerfreundliche Schnittstelle für die Bearbeitung benutzerdefinierter Felder wünschen, müssen Sie diese Funktionalität nun selbst entwickeln.
Weitere Studien und nächste Schritte
Möchten Sie sich noch mehr von der Verwendung von Blockbindungen in Ihren Projekten inspirieren lassen? Werfen Sie einen Blick auf dieblock-bindings.phpDer Registrierungscode in der Datei und der eingebauteKern/Post-MetaDatenquellen, und verpassen Sie nicht unsere Blockbindungen!Einführende Tutorial-Serie.
Das Blockbinden steckt noch in den Kinderschuhen.Für die Zukunft planen wirDie folgenden Funktionen sind implementiert:
- Ermöglicht die Bearbeitung von Metafeldwerten direkt in der Benutzeroberfläche.
- Hinzufügen von Funktionen zum Editor, die es den Benutzern ermöglichen, auf einfache Weise Bindungen hinzuzufügen.
- Einführung neuer integrierter Datenquellen, einschließlich Standortdaten, Artikeldaten und Kategoriedaten.
- Erweiterte Unterstützung für weitere Kernblöcke.
- Stellt Entwicklern Werkzeuge zur Verfügung, um die Benutzeroberfläche des Editors zu erweitern.
Ihr Feedback ist uns sehr willkommen! Mehr über uns erfahren Sie unterGithuboder WordPress Slack, um Ihre Ideen und Anwendungsfälle mit uns zu teilen, damit wir die Blockbindungs-API gemeinsam weiterentwickeln können.
