Erstellen eines Smart Tags aus einem ACF-Feld

Möchten Sie benutzerdefinierte Smart Tags basierend auf Feldern erstellen, die mit ACF (Advanced Custom Fields) generiert wurden? In diesem Tutorial führen wir Sie durch den Prozess der Erstellung dieser spezialisierten Smart Tags mit einem prägnanten Code-Snippet.

Zur Veranschaulichung dieses Tutorials betrachten wir eine WordPress-Website, die Beiträge als Verkaufsobjekte verwendet. Wir werden ein einzelnes Formular entwerfen, das auf jeder Beitragsseite angezeigt wird, und es nahtlos in die PHP-Vorlage integrieren.

Damit Autoren ihre Artikel jedoch effektiv zum Verkauf anbieten können, müssen sie die entsprechenden Preise eingeben. Mithilfe des ACF-Plugins haben wir ein Feld namens Preis in die Beitragseinstellungen integriert.

Dieses Preis-Feld wird im Formular vorausgefüllt und aktualisiert sich dynamisch basierend auf dem angezeigten Beitrag. Da das Formular über alle Beiträge hinweg konstant bleibt, der Preis jedoch variiert, werden wir für dieses Feld einen Smart Tag verwenden, um seine Anpassungsfähigkeit bei jeder Aktualisierung der Beitragsinformationen sicherzustellen.

Erstellen des benutzerdefinierten Felds mit ACF

Zuerst erstellen wir unser benutzerdefiniertes Feld mit dem Advanced Custom Fields Plugin.

Gemäß der ACF-Dokumentation haben wir unseren Beiträgen ein neues Feld namens portfolio_price hinzugefügt.

Erstellen eines Smart Tags aus dem ACF-Feld

Normalerweise würden wir zuerst das Formular erstellen. Da wir jedoch wissen, dass wir diesen neuen Smart Tag in unserem Formular-Builder verwenden möchten, fügen wir den Snippet hinzu, bevor wir das Formular erstellen.

Wenn Sie Hilfe beim Hinzufügen von Snippets zu Ihrer Website benötigen, sehen Sie bitte dieses Tutorial an.

/**
 * 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 );

Lassen Sie uns diese beiden Funktionen aufschlüsseln.

Die erste Funktion erstellt einen leeren Smart Tag mit dem Namen „Portfolio Price“. Diesem Tag wird noch nichts zugewiesen, wir erstellen ihn nur mit dieser Funktion.

Die nächste Funktion ist, wo wir den Smart Tag definieren und woher er die Informationen abrufen soll.

Mit der Zeile $my_acf_field = get_field( ‘portfolio_price’, get_the_ID() ); weisen wir den Code an, zu Advance Custom Fields zu gehen und diesen Feldwert abzurufen. Sie müssen hier den Feldnamen eingeben. Für unser Tutorial haben wir unser Feld portfolio_price genannt.

Wenn Sie Hilfe beim Finden Ihres Feldnamens benötigen, bearbeiten Sie einfach das von Ihnen in ACF erstellte Feld und suchen Sie nach der Bezeichnung Feldname.

Erstellung 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.

Hinzufügen der Smart Tags

Für unser Formular werden wir den Produkttitel, der der Beitragstitel ist, übernehmen. Wir können dafür einen integrierten Smart Tag verwenden, den WPForms bereits bereitstellt.

Sobald Sie das Feld Einzeiliger Text für den Produkttitel hinzugefügt haben, klicken Sie einfach auf die Registerkarte Erweitert. Klicken Sie im Standardwert für das Feld auf den Link Smart Tags anzeigen und wählen Sie Eingebetteter Beitrags-/Seiten-Titel aus, damit der Beitragstitel dieses Formularfeld automatisch ausfüllt.

Als Nächstes wiederholen wir diesen Schritt für das Feld Produktpreis.

Wählen Sie auf der Registerkarte Erweitert des Feldes Produktpreis den Smart Tag {portfolio_price} aus den verfügbaren Smart Tags aus.

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 Ende der Vorlage für einzelne Beitragseiten hinzugefügt.

Jetzt können Sie sehen, wie sich mit der Änderung Ihrer Beiträge auch der Produktpreis und der Produkttitel Ihres Formulars ändern.

Möchten Sie weitere benutzerdefinierte Smart Tags erstellen? Sehen Sie sich unser Tutorial So erstellen Sie einen benutzerdefinierten Smart Tag an.

Referenzfilter

• wpforms_smart_tags
• wpforms_smart_tag_process