Formulare auf Ihrer Website anzeigen

Möchten Sie mehr über die verschiedenen Möglichkeiten erfahren, die von Ihnen erstellten Formulare auf Ihrer WordPress-Website anzuzeigen? WPForms kann problemlos in jeden Aspekt Ihrer Website integriert werden.

Dieses Tutorial zeigt Ihnen verschiedene Möglichkeiten, mit WPForms erstellte Formulare auf einer WordPress-Website anzuzeigen.

Hinweis: Die folgenden Schritte gelten für WordPress Version 5 oder neuer. Wenn Sie eine ältere Version von WordPress verwenden, lesen Sie bitte unser Tutorial zum Arbeiten mit Formularen im WordPress Classic Editor.


Stellen Sie vor Beginn sicher, dass WPForms auf Ihrer WordPress-Website installiert und aktiviert ist und dass Sie Ihre Lizenz verifiziert haben.

Dieses Tutorial konzentriert sich darauf, wie Formulare auf Ihrer Website innerhalb einer Seite oder eines Widgets angezeigt werden.

Einbetten Ihres Formulars auf einer WordPress-Seite

Es gibt zwei verschiedene Möglichkeiten, Ihre Formulare auf einer WordPress-Seite einzubetten. Sie können den integrierten Einrichtungsassistenten im Formular-Generator verwenden oder Ihr Formular manuell mit dem Block-Editor zu einer Seite hinzufügen.

Einbetten eines Formulars mit dem WPForms Einrichtungsassistenten

Zuerst müssen Sie ein neues Formular erstellen oder ein vorhandenes bearbeiten, um auf den Formular-Generator zuzugreifen. Sobald Sie Ihr Formular angepasst haben, können Sie den Einrichtungsassistenten direkt aus dem Formular-Generator verwenden, indem Sie auf die Schaltfläche Einbetten klicken.

Zugriff auf den WPForms-Einbettungsassistenten im Formular-Generator

Der Formular-Einbindungs-Assistent wird mit sechs Optionen zum Veröffentlichen Ihres Formulars geöffnet.

Die drei Optionen auf der linken Seite decken die traditionellen Wege ab, Ihr Formular auf Ihrer Website einzubinden:

  • Vorhandene Seite: Fügen Sie Ihr Formular zu einer Seite hinzu, die Sie bereits erstellt haben.
  • Neue Seite: Erstellen Sie eine neue Seite mit Ihrem bereits eingebetteten Formular.
  • Shortcode: Kopieren Sie den Shortcode Ihres Formulars, um ihn überall auf Ihrer Website einzufügen.

Die drei Optionen auf der rechten Seite öffnen dedizierte Landingpage-Erlebnisse für Ihr Formular mithilfe unserer Add-ons Conversational Forms, Form Pages und Lead Forms. Jedes Add-on hat seine eigene Anleitung.

Nachfolgend behandeln wir jede der drei traditionellen Einbindungsoptionen.

Vorhandene Seite

Klicken Sie auf Vorhandene Seite, wählen Sie dann die Seite aus dem Dropdown-Menü aus, auf der Sie Ihr Formular einbinden möchten. Klicken Sie auf die Schaltfläche Zur Seite hinzufügen, um fortzufahren.

Sie werden zum Block-Editor der ausgewählten Seite weitergeleitet. Sehen Sie sich den Abschnitt Formular mit dem Block-Editor einbinden unten für den Rest des Ablaufs an.

Neue Seite

Klicken Sie auf Neue Seite, geben Sie einen Namen für die Seite ein und klicken Sie auf die Schaltfläche Seite erstellen.

Sie werden zu einer neuen Seite mit dem eingebetteten Formular weitergeleitet. Klicken Sie auf die Schaltfläche Veröffentlichen, um die Seite live zu schalten.

Kurzcode

Klicken Sie auf Shortcode. Der Shortcode des Formulars wird in Ihre Zwischenablage kopiert und kann überall auf Ihrer Website eingefügt werden, wo Shortcodes akzeptiert werden.

Einbetten eines Formulars mit dem Block-Editor

Sobald Sie den Seiten-Editor geöffnet haben, können Sie einen neuen Block hinzufügen, indem Sie oben links auf das Pluszeichen (+) klicken.

Hinzufügen eines neuen Blocks zu einer Seite

Dadurch wird ein Menü mit Blockoptionen geöffnet. Um den WPForms-Block zu finden, können Sie nach „WPForms“ suchen oder zur Kategorie Widgets scrollen. Klicken Sie dann auf den WPForms-Block.

Hinzufügen des WPForms-Blocks zu einer Seite

Dadurch wird der WPForms-Block zum Seiten-Editor hinzugefügt. Wählen Sie als Nächstes das Formular aus, das Sie einbetten möchten, aus der Dropdown-Liste Formular auswählen.

Auswählen eines Formulars aus dem WPForms-Block

Nachdem Sie einen Formulartitel ausgewählt haben, wird das vollständige Formular innerhalb des WPForms-Blocks angezeigt. Im rechten Seitenleistenmenü sehen Sie zusätzliche Anpassungseinstellungen. Innerhalb dieser Blockoptionen können Sie die folgenden Einstellungen anpassen:

Die Einstellungen des WPForms-Blocks

  • Formular: Mit dieser Einstellung können Sie ein anderes Formular zum Anzeigen auswählen.
  • Titel anzeigen und Beschreibung anzeigen: Mit diesen Optionen können Sie zusätzliche Formulardetails ausblenden oder anzeigen.
  • Formular-Designoptionen: WPForms ermöglicht es Ihnen, Ihre Formulare im Block-Editor zu gestalten, ohne CSS schreiben zu müssen. Um mehr zu erfahren, lesen Sie unbedingt unser Tutorial zum Gestalten Ihres Formulars im Block-Editor.
  • Erweitert: Hier können Sie alle Anpassungen, die Sie an diesem Formular vorgenommen haben, kopieren und auf ein anderes Formular wiederverwenden. Sie können Ihrem Formular auch CSS-Klassen hinzufügen. Diese Option wird nur erfahrenen Benutzern empfohlen.

Sobald Sie mit Ihrem Formular und seinen Einstellungen zufrieden sind, veröffentlichen Sie die Seite und besuchen Sie das Frontend Ihrer Website, um Ihr Formular in Aktion zu sehen. So würde unser Beispiel auf einer Live-Site aussehen:

Probieren Sie diese Formular-Demo!
Name

Einbetten Ihres Formulars in ein Widget

Hinweis: Diese Anweisungen gelten für den Block-Widgets-Editor, der mit WordPress 5.8 ausgeliefert wurde. Wenn Sie noch den Classic-Widgets-Editor verwenden, lesen Sie bitte unser Tutorial zur Verwendung von Formularen mit dem Classic Editor, um ein Formular in ein Widget einzubetten.

Ein WordPress-Widget ist ein kleiner Inhaltsblock auf Ihrer Website, der eine bestimmte Funktion erfüllt. Sie können beispielsweise den WPForms-Block zu einem Widget-Bereich hinzufügen, um ein Formular in der Seitenleiste oder im Footer Ihrer Website einzubetten.

Hinweis: Möchten Sie mehr über WordPress-Widgets erfahren? Sehen Sie sich den Leitfaden zur Verwendung von Widgets von WPBeginner an.

Um auf die Widgets Ihrer Website zuzugreifen, navigieren Sie im WordPress-Adminbereich zu Design » Widgets. Dadurch wird der Bearbeitungsbildschirm Widgets geöffnet.

Zugriff auf den Widgets-Editor-Bildschirm

Von hier aus ist der Vorgang dem Einbetten eines Formulars in einen Beitrag oder eine Seite sehr ähnlich. Finden Sie zuerst den Widget-Bereich, zu dem Sie Ihr Formular hinzufügen möchten. Klicken Sie darauf, um sicherzustellen, dass Sie den richtigen Bereich bearbeiten.

Auswählen eines Widget-Bereichs zum Hinzufügen eines Formulars

Klicken Sie dann auf die blaue Plus (+)-Schaltfläche in der oberen linken Ecke des Editors.

Öffnen der Widget-Block-Bibliothek

Suchen Sie in der Blockbibliothek nach „WPForms“ oder scrollen Sie zum Abschnitt Widgets und klicken Sie auf den WPForms-Block.

Hinzufügen des WPForms-Blocks zu einem Widget

Dadurch wird der WPForms-Block zu Ihrem ausgewählten Widget-Bereich hinzugefügt. Sie können Blöcke per Drag & Drop verschieben, um sie nach Bedarf neu anzuordnen. Wählen Sie dann das Formular aus, das Sie anzeigen möchten, aus dem Dropdown-Menü Formular auswählen.

Auswählen eines Formulars zur Anzeige in einem Widget

Klicken Sie unbedingt auf die Schaltfläche Aktualisieren in der oberen rechten Ecke des Bearbeitungsbildschirms für Widgets, um Ihre Änderungen zu speichern.

Widgets aktualisieren, um Änderungen zu speichern

Hier ist ein Beispiel dafür, wie ein Formular im Footer einer Live-Site aussehen würde:

Beispiel eines Formulars, das in einem Footer-Widget angezeigt wird

Häufig gestellte Fragen

Nachfolgend beantworten wir einige häufig gestellte Fragen zur Erstellung Ihres ersten Formulars.

Kann ich das Formular auf einer Elementor-Seite einbetten?

Ja, Sie können das WPForms Elementor-Widget verwenden, um einfach ein Formular zu Ihrer Elementor-Seite hinzuzufügen. Sobald Sie sich im Elementor-Builder befinden, ziehen Sie einfach das WPForms-Widget per Drag & Drop auf Ihre Seite.

WPForms zu einer Elementor-Seite hinzufügen

Für eine vollständige Anleitung lesen Sie unbedingt unseren Leitfaden zum Hinzufügen von WPForms zu einer Elementor-Seite.

Das ist alles! Jetzt kennen Sie die verschiedenen Möglichkeiten, WPForms in Ihre WordPress-Website einzubetten.

Möchten Sie als Nächstes die von Benutzern über Ihre WordPress-Formulare eingereichten Einträge anzeigen? Lesen Sie unbedingt unseren vollständigen Leitfaden zur Verwaltung von Einträgen in WPForms für eine vollständige Anleitung.

Das beste WordPress Drag-and-Drop-Formular-Builder-Plugin

Einfach, schnell und sicher. Schließen Sie sich über 6 Millionen Website-Besitzern an, die WPForms vertrauen.