Anzeigen von Shortcodes innerhalb von Formularfeld-Labels

Möchten Sie Ihre Formularbeschriftungen mit interaktiven Tooltips oder dynamischen Inhalten mithilfe von Shortcodes verbessern? Während WPForms Shortcodes in Beschriftungen nicht standardmäßig unterstützt, können Sie diese Funktionalität einfach mit PHP hinzufügen.

Diese Anleitung zeigt Ihnen, wie Sie beliebige Shortcodes in Ihren Formularfeld-Beschriftungen anzeigen.

Installation des Shortcodes Ultimate Plugins (optional)

Wenn Sie noch kein Shortcode-Plugin haben, können Sie Shortcodes Ultimate aus dem WordPress-Plugin-Repository installieren. Dieser Schritt ist optional, wenn Sie bereits ein anderes Shortcode-Plugin haben oder integrierte Shortcodes Ihres Themes verwenden.

Wenn Sie Hilfe bei der Installation von Plugins benötigen, können Sie die Anleitung von WPBeginner zur Installation eines Plugins lesen.

Erstellen Ihres Formulars

Sie können ein neues Formular erstellen oder ein vorhandenes bearbeiten. Wenn Sie Hilfe beim Erstellen eines Formulars benötigen, lesen Sie bitte diese Dokumentation.

Wir benötigen die Beschriftung für das Telefon-Formularfeld nicht, da wir den Tooltip-Text als Beschriftung verwenden werden. Wählen Sie daher im Tab Erweitert des Formularfelds die Option Beschriftung ausblenden und klicken Sie dann im Formular auf Speichern.

Hinzufügen des Codes

Um Shortcodes in Ihren Formularbeschriftungen anzuzeigen, müssen Sie einen Code-Snippet zu Ihrer Website hinzufügen. Wenn Sie nicht sicher sind, wie Sie benutzerdefinierten Code hinzufügen, lesen Sie bitte unsere Anleitung zum Hinzufügen von Code-Snippets.

Im obigen Code-Snippet müssen Sie drei Schlüsselwerte ändern:

• In Zeile 10: Ersetzen Sie 1055 durch Ihre Formular-ID
• In Zeile 10: Ersetzen Sie 4 durch Ihre Feld-ID
• In Zeile 12: Ersetzen Sie den Shortcode durch Ihren gewünschten Shortcode

Wenn Ihre Besucher nun das Formular sehen und auf den Tooltip klicken, sehen sie Ihre Nachricht.

FAQ

F: Wie füge ich unterschiedliche Shortcodes für verschiedene Formulare und Beschriftungen hinzu?

A: Wenn Sie dieses Snippet für andere Formulare mit unterschiedlichen Shortcodes wiederverwenden möchten, könnten Sie dies sicherlich tun.

/**
 * Run shortcodes on the form label field.
 *
 * @link   https://wpforms.com/developers/how-to-display-shortcodes-inside-the-label-of-the-form-field/
 */
 
function add_shortcode_to_label( $field, $form_data ) {
         
        // Check that the form ID is 1055 and the field id is 4 for the Phone field
    if ( 1055 === absint( $form_data[ 'id' ] ) && 4 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="Your information is completely protected and will not be sold!<br><a href=&ldquo;https://myexamplesite.com/privacy/&ldquo;>Click here to learn more.</a>" behavior="click" hide_delay="500"]Click Me![/su_tooltip] ' );
     
        }
     
        // Check that the form ID is 1055 and the field id is 2 for the Name field
    if ( 1055 === absint( $form_data[ 'id' ] ) && 2 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="I am a different tooltip for a different field on the same form." behavior="click" hide_delay="500"]Click Me Too![/su_tooltip] ' );
     
        }   
 
        // Check that the form ID is 1072 and the field id is 6 for the Comments field
    if ( 1072 === absint( $form_data[ 'id' ] ) && 6 === absint( $field[ 'id' ] ) ) {
 
        echo do_shortcode( ' [su_tooltip text="I am a different tooltip for a different field on a completely different form." behavior="click" hide_delay="500"]Click Me Too![/su_tooltip] ' );
     
        }
     
}
add_action( 'wpforms_display_field_before', 'add_shortcode_to_label', 16, 2 );

Und das ist alles, was Sie benötigen, um beliebige Shortcodes in einem Beschriftungs-Formularfeld anzuzeigen. Möchten Sie Shortcodes im HTML-Feld anzeigen? Schauen Sie sich unseren Artikel über Anzeigen von Shortcodes im HTML-Feld an.

Referenzaktion

wpforms_display_field_before