Sind Sie daran interessiert, benutzerdefinierte Smart Tags auf der Grundlage von Feldern zu erstellen, die mit ACF (Advanced Custom Fields) generiert wurden? In diesem Tutorial führen wir Sie durch den Prozess der Erstellung dieser speziellen Smart Tags anhand eines prägnanten Code-Snippets.
Zur Veranschaulichung dieses Tutorials betrachten wir eine WordPress-Website, die Beiträge als Verkaufsportfolio verwendet. Wir werden ein einzelnes Formular entwickeln, das auf jeder Beitragsseite angezeigt wird, und es nahtlos in die PHP-Vorlage integrieren.
Damit die Autoren ihre Artikel jedoch effektiv zum Verkauf anbieten können, müssen sie die entsprechenden Preise eingeben. Mithilfe des ACF-Plugins haben wir ein Preisfeld in die Beitragseinstellungen integriert.
Dieses Preisfeld wird im Formular vorausgefüllt und dynamisch auf der Grundlage des angezeigten Beitrags aktualisiert. Da das Formular in allen Beiträgen gleich bleibt, der Preis aber variiert, werden wir ein Smart Tag für dieses Feld verwenden, um seine Anpassungsfähigkeit bei jeder Aktualisierung der Beitragsinformationen zu gewährleisten.
Erstellen des benutzerdefinierten Feldes mit ACF
Zunächst erstellen wir unser benutzerdefiniertes Feld mit dem Advanced Custom Fields Plugin.
In Anlehnung an die ACF-Dokumentation haben wir ein neues Feld mit der Bezeichnung portfolio_price zu unseren Beiträgen hinzugefügt.
In dieser Anleitung wird davon ausgegangen, dass Sie Ihr(e) Feld(er) bereits zu Ihrem Beitrag hinzugefügt haben. Wenn Sie Hilfe beim Hinzufügen von Feldern zu WordPress-Beiträgen mit dem Advanced Custom Fields-Plugin benötigen, lesen Sie bitte dessen Dokumentation.
Erstellen eines Smart Tags aus dem ACF-Feld
Normalerweise würden wir zuerst das Formular erstellen. Da wir jedoch wissen, dass wir dieses neue Smart Tag in unserem Form Builder verwenden möchten, fügen wir das Snippet vor der Erstellung des Formulars hinzu.
Wenn Sie Hilfe beim Hinzufügen von Snippets zu Ihrer Website benötigen, lesen Sie bitte dieses Tutorial.
/**
* Register the Smart Tag so it will be available to select in the form builder.
*
* @link https://wpforms.com/developers/how-to-create-a-smart-tag-from-an-acf-field/
*/
function wpf_dev_register_smarttag( $tags ) {
// Key is the tag, item is the tag name.
$tags[ 'portfolio_price' ] = 'Portfolio Price';
return $tags;
}
add_filter( 'wpforms_smart_tags', 'wpf_dev_register_smarttag' );
/**
* Process the Smart Tag.
*
* @link https://wpforms.com/developers/how-to-create-a-smart-tag-from-an-acf-field/
*/
function wpf_dev_process_smarttag( $content, $tag ) {
// Only run if it is our desired tag.
if ( 'portfolio_price' === $tag ) {
//Get the field name from ACF
$my_acf_field = get_field( 'portfolio_price', get_the_ID() );
// Replace the tag with our link.
$content = str_replace( '{portfolio_price}', $my_acf_field, $content );
}
return $content;
}
add_filter( 'wpforms_smart_tag_process', 'wpf_dev_process_smarttag', 10, 2 );
Wir wollen diese beiden Funktionen aufschlüsseln.
Die erste Funktion erstellt ein leeres Smart Tag mit dem Namen "Portfolio Price". Diesem Tag wird noch nichts zugewiesen, wir erstellen es lediglich mit dieser Funktion.
In der nächsten Funktion definieren wir den Smart Tag und woher er die Informationen beziehen soll.
Mit der Zeile $my_acf_field = get_field( 'portfolio_price', get_the_ID() ); teilen wir dem Code mit, dass er zu Advance Custom Fields gehen und diesen Feldwert abrufen muss. Hier müssen Sie den Feldnamen eingeben. Für unser Tutorial haben wir unser Feld portfolio_price genannt.
Wenn Sie Hilfe bei der Suche nach dem Feldnamen benötigen, bearbeiten Sie einfach das Feld, das Sie in ACF erstellt haben, und suchen Sie nach der Bezeichnung Feldname.
Erstellen des Formulars
Wir haben unser Formular so erstellt, dass es die Formularfelder Name, E-Mail, Produkttitel (einzeiliger Text), Produktpreis (einzeiliger Text) und Kommentare (Absatztext) enthält.
Wenn Sie Hilfe bei der Erstellung eines Formulars benötigen, lesen Sie bitte diese Anleitung.
Hinzufügen der Smart Tags
Für unser Formular werden wir den Produkttitel einfügen, der der Titel des Beitrags ist. Wir können eine eingebaute Smart Tag, dass WPForms bereits für diese bietet verwenden.
Sobald Sie das einzeilige Textfeld für den Produkttitel hinzugefügt haben, klicken Sie einfach auf die Registerkarte Erweitert. Klicken Sie im Feld Standardwert für das Feld auf den Link Intelligente Tags anzeigen und wählen Sie Eingebetteter Beitrags-/Seitentitel, damit der Beitragstitel automatisch in dieses Formularfeld eingetragen wird.
Als nächstes wiederholen wir diesen Schritt für das Feld Produktpreis.
Wählen Sie auf der Registerkarte Erweitert des Feldes Produktpreis das Smart Tag {portfolio_price} Smart Tag aus den verfügbaren Smart Tags.
Hinzufügen des WPForms-Shortcodes zu einer PHP-Vorlage
Wenn Sie Hilfe beim Hinzufügen eines Shortcodes zu einer PHP-Vorlage benötigen, lesen Sie bitte dieses Tutorial.
Für dieses Tutorial haben wir unseren Shortcode am unteren Rand der Vorlage für eine einzelne Beitragsseite hinzugefügt.
Jetzt können Sie sehen, dass sich mit der Änderung Ihrer Beiträge auch der Produktpreis und der Produkttitel Ihres Formulars ändern.
Möchten Sie weitere benutzerdefinierte Smart Tags erstellen? Schauen Sie sich unser Tutorial über die Erstellung eines benutzerdefinierten Smart Tags an.