So ändern Sie das Pre-Loader-Symbol bei der Übermittlung

Einleitung

Möchten Sie das Pre-Loader-Symbol auf Ihren WPForms ändern? Es gibt ein Standard-Pre-Loading-Symbol, das auf allen WPForms verwendet wird, wenn die Einstellung AJAX-Formularübermittlung aktivieren in Ihrem Formular aktiviert ist. Wenn Sie dieses Symbol mit Ihrem eigenen anpassen möchten, müssen Sie einen kleinen PHP-Snippet hinzufügen, um dies zu tun. In diesem Tutorial zeigen wir Ihnen, wie Sie dies erreichen.

Erstellung des Formulars

Zuerst erstellen wir unser Formular und fügen unsere Felder hinzu.

AJAX in den Formulareinstellungen aktivieren

Als Nächstes müssen Sie sicherstellen, dass Sie AJAX aktivieren. Klicken Sie dazu auf Einstellungen und unter Allgemein auf Erweitert, um die erweiterten Optionen zu öffnen, und schalten Sie AJAX-Formularübermittlung aktivieren ein, um AJAX zu aktivieren.

Hinzufügen des Snippets

Als Nächstes müssen Sie diesen Snippet auf Ihre Website kopieren und einfügen. Wenn Sie Hilfe beim Hinzufügen von Snippets zu Ihrer Website benötigen, lesen Sie bitte dieses Tutorial

/**
 * Change the pre-loader icon
 *
 * @link https://wpforms.com/developers/how-to-change-the-pre-loader-icon-on-submit/
 */
 
function custom_wpforms_display_submit_spinner_src( $src, $form_data ) {
 
    // Enter the URL to the loading image in between the single quotes
    return 'http://yoursite.com/your-image.svg';

}

add_filter( 'wpforms_display_submit_spinner_src', 'custom_wpforms_display_submit_spinner_src', 10, 2 );

Das Hinzufügen dieses Snippets ändert die URL, unter der das Ladesymbol gefunden wird.

Und das ist alles! Sie haben das Symbol erfolgreich geändert. Möchten Sie lernen, wie Sie die Beschreibung eines Feldes über dem Formularfeld positionieren? Schauen Sie sich den Artikel über Positionieren der Feld-Beschreibung über dem Formularfeld an.

Verwandt

Filterreferenz: wpforms_display_submit_spinner_src