Vertrauenswürdige WordPress-Tutorials, wenn Sie sie am dringendsten benötigen.
Anfängerleitfaden für WordPress
WPB Cup
25 Millionen+
Websites, die unsere Plugins verwenden
16+
Jahre WordPress-Erfahrung
3000+
WordPress-Tutorials von Experten

So betten Sie Formulare in WordPress ein (ultimativer Leitfaden für Anfänger)

Wenn Sie jemals versucht haben, ein Formular in Ihre WordPress-Website einzubetten, haben Sie wahrscheinlich festgestellt, dass es nicht so einfach ist, wie es aussieht. Sie fügen möglicherweise einen Code von Microsoft Forms, Google Forms oder einem anderen Dienst ein, nur um am Ende ein Layout zu erhalten, das fehlerhaft ist, oder ein Formular, das überhaupt nicht funktioniert.

Deshalb stellen sich so viele Website-Besitzer die gleiche Frage: Was ist der richtige Weg, um Formulare zu WordPress hinzuzufügen?

Die gute Nachricht ist, dass es viel einfacher ist, als Sie vielleicht denken, sobald Sie die richtigen Werkzeuge verwenden.

Egal, ob Sie ein einfaches Kontaktformular, eine Newsletter-Anmeldung oder etwas Fortgeschritteneres benötigen, es gibt anfängerfreundliche Lösungen, die sofort funktionieren.

In diesem Leitfaden führen wir Sie Schritt für Schritt durch die besten Methoden, die wir getestet haben, damit Sie das Ausprobieren überspringen und Ihre WordPress-Formulare in wenigen Minuten zum Laufen bringen können. ✅

Formulare in WordPress einbetten

Was ist ein WordPress-Formular und warum ist es wichtig?

Ein WordPress-Formular ist ein Werkzeug zum Sammeln wertvoller Informationen und Erkenntnisse auf Ihrer Website. Es ermöglicht Besuchern, ihre Daten einzugeben, wie z. B. ihren Namen, ihre E-Mail-Adresse und ihr Feedback.

Formulare haben viele Anwendungsfälle.

Sie können zum Beispiel ein Kontaktformular erstellen, um Benutzern die Kontaktaufnahme mit Ihnen zu ermöglichen und eine E-Mail-Liste aufzubauen, eine Umfrage zum Sammeln von Meinungen oder ein Registrierungsformular für Veranstaltungen.

Sie können Formulare auch für die Buchung von Terminen oder das Sammeln von Spenden verwenden. Einige Unternehmen nutzen Formulare auch zur Bearbeitung von Kundensupportanfragen.

Ohne Formulare verpassen Sie möglicherweise Gelegenheiten, mit Besuchern in Kontakt zu treten. Daher ist das Hinzufügen von Formularen zu Ihrer WordPress-Website ein kluger Schachzug für jeden Website-Besitzer.

Formulare in WordPress einbetten

In den folgenden Abschnitten führen wir Sie durch jeden Schritt, um Formulare zu Ihrer WordPress-Website hinzuzufügen.

Wenn Sie an einem bestimmten Formulartyp interessiert sind, können Sie auf den Link klicken, um im Artikel vorzuspringen:

Bereit? Legen wir los.

1. WPForms in Ihre WordPress-Website einbetten

WPForms ist der beste Mehrzweck-Formularersteller auf dem Markt. Es ist auch eines der beliebtesten mit über 6 Millionen aktiven Nutzern, einschließlich uns!

Bei WPBeginner erstellen wir unsere Kontaktformulare, führen jährliche Leserumfragen durch und verwalten Website-Migrationsanfragen mit diesem Plugin. Es ist seit Jahren unser vertrauenswürdiges Werkzeug, und Sie können mehr über seine Funktionen in unserem ausführlichen WPForms-Testbericht erfahren.

WPForms' Homepage

Mit diesem Tool können Sie jede seiner über 2000 fertigen, anpassbaren Vorlagen verwenden, um jedes gewünschte Formular zu erstellen.

Sie können sogar KI nutzen, um Ihre Formulare zu erstellen. Sagen Sie einfach WPForms AI, welche Art von Formular Sie wünschen, und das Tool generiert es für Sie.

WPForms KI-Formulare in Aktion

Zusätzlich zu Kontaktformularen kann Ihnen WPForms helfen, einfache bis fortgeschrittenere Formulare zu erstellen, wie zum Beispiel:

Und wenn es darum geht, WPForms einzubetten, können Sie entweder einen WPForms-Block oder einen Shortcode verwenden.

Lassen Sie uns also WPForms installieren und aktivieren und dies gemeinsam ausprobieren. Wenn Sie Hilfe benötigen, können Sie sich auf unseren Leitfaden zur Installation eines WordPress-Plugins beziehen.

Dann können Sie unserer Schritt-für-Schritt-Anleitung zum Erstellen eines Kontaktformulars in WordPress folgen.

WPForms-Formulare mit dem WPForms-Block einbetten

Sobald das Formular zum Veröffentlichen bereit ist, klicken Sie einfach im Formular-Builder auf die Schaltfläche 'Einbetten', um das Formular mithilfe eines WPForms-Blocks zu Ihrer Webseite hinzuzufügen.

Die Schaltfläche „Einbetten“ im WPForms-Formular-Builder

Dies öffnet ein Popup-Fenster, in dem Sie eine vorhandene Seite auswählen oder eine neue Seite für das Formular erstellen können.

Wenn Sie auf die Schaltfläche „Vorhandene Seite auswählen“ klicken, sehen Sie ein Dropdown-Menü mit allen verfügbaren Seiten auf Ihrer WordPress-Website. Und wenn Sie auf „Neue Seite erstellen“ klicken, sehen Sie ein Feld „Name Ihrer Seite“, das Sie ausfüllen können.

Sobald Sie eine Seite ausgewählt oder Ihre neue Seite benannt haben, können Sie auf die Schaltfläche „Los geht’s!“ klicken.

Kontaktformular WPForms einbetten

Sie werden dann zur Block-Editor-Oberfläche der Seite weitergeleitet.

Von hier aus können Sie auf die Schaltfläche '+' klicken und nach dem WPForms-Block suchen.

WPForms-Block hinzufügen

Der nächste Schritt ist, das Dropdown-Menü im WPForms-Block zu öffnen und das Formular auszuwählen, das Sie einbetten möchten.

Sobald Sie ein Formular ausgewählt haben, lädt WPForms es in den Content-Editor.

Danach möchten Sie vielleicht mit den „Formulareinstellungen“ im rechten Bereich experimentieren.

Standardmäßig lädt WPForms nicht den Titel Ihres Formulars. Möglicherweise möchten Sie die Option „Formulartitel“ aktivieren, um einen Formulartitel hinzuzufügen und den Besuchern mehr Kontext zu geben. Wenn Sie eine Formularbeschreibung schreiben, können Sie die Option ebenfalls aktivieren.

Noch besser: Sie können Ihr Formular mit einem Design gestalten, das zum Gesamtbild Ihrer Website passt.

WPForms-Formulareinstellungen im Block-Editor

Wenn Sie mit dem Aussehen des Formulars zufrieden sind, können Sie auf „Speichern“ klicken.

Und so betten Sie WPForms mit einem WPForms-Block ein.

WPForms auf einer Live-Website eingebettet
WPForms-Formulare mit einem Shortcode einbetten

Eine weitere Möglichkeit, WPForms einzubetten, ist die Verwendung eines Shortcodes.

Um dies zu tun, möchten Sie zu WPForms » Alle Formulare gehen, um die Spalte „Shortcode“ für jedes Formular zu finden.

Die Spalte mit den Shortcodes auf der WPForms-Seite

Von hier aus kopieren Sie einfach den Shortcode des Formulars, den Sie einbetten möchten. Zum Beispiel kopieren wir den Shortcode unseres Formulars 'Kundenrezension'.

Der nächste Schritt ist das Öffnen des Beitrags oder der Seite, auf der Sie das Formular einbetten möchten. Gehen Sie dazu zu „Seiten“ oder „Beiträge“. Fahren Sie dann mit der Maus über einen davon und klicken Sie auf „Bearbeiten“, wenn er erscheint.

Dies bringt Sie zum Editor der Seite oder des Beitrags.

Um das Formular einzubetten, klicken wir auf die Schaltfläche '+' und suchen nach dem Block 'Shortcode'.

Der Shortcode-Block im Block-Editor

Sobald der Block hinzugefügt wurde, können Sie den Shortcode Ihres WPForms-Formulars in das Textfeld einfügen.

So könnte es aussehen:

WPForms-Shortcode hinzufügen

Der Block-Editor lädt das Formular nicht im Live-Bearbeitungsbereich.

Speichern Sie also zuerst die Änderungen und klicken Sie dann auf die Schaltfläche „Seite anzeigen“, wenn sie unten links erscheint.

WPForms, eingebettet über Shortcode auf einer Live-Website

💡 Bereit, Ihr perfektes Formular in wenigen Minuten zu erstellen? Schließen Sie sich über 6 Millionen Website-Besitzern an, die WPForms verwenden, um intelligentere Formulare und Umfragen zu erstellen.

Beginnen Sie noch heute mit WPForms – ganz ohne Programmierung!

2. So binden Sie Spendenformulare in WordPress ein

Das Hinzufügen eines Spendenformulars zu Ihrer Website erleichtert es den Menschen, Ihre Sache zu unterstützen. Besucher spenden eher, wenn sie eine klare und einfache Möglichkeit dazu sehen.

Der einfachste Weg, Spendenformulare in WordPress einzubetten, ist die Verwendung des Charitable-Plugins. Es ist das beste Spenden-Plugin für WordPress und ermöglicht es Ihnen, mehrere Spendenkampagnen mit über 100 fertigen Vorlagen zu erstellen und anzupassen.

Bei der Balkhi Foundation verlassen wir uns auf Charitable, um alle unsere Online-Spendenkampagnen zu verwalten. Es ist unglaublich zuverlässig und vereinfacht den Spendenprozess für unsere Unterstützer.

Um mehr zu erfahren, können Sie gerne unseren vollständigen Charitable-Testbericht lesen.

Die Homepage von Charitable

Lassen Sie uns zunächst Charitable installieren und aktivieren, um Ihr Spendenformular zu erstellen. Wenn Sie Hilfe benötigen, können Sie unseren Leitfaden zur Installation eines WordPress-Plugins einsehen.

Nach der Aktivierung gehen wir zu Charitable » Einstellungen, um die Pro-Lizenz zu aktivieren. Fügen Sie einfach Ihren Lizenzschlüssel ein und klicken Sie auf „Schlüssel überprüfen“, um den Vorgang zu starten.

Hinzufügen des WP Charitable-Lizenzschlüssels

Wenn das erledigt ist, können Sie Ihr Spendenformular erstellen. Detaillierte Anweisungen finden Sie in unserem Leitfaden zur Erstellung eines wiederkehrenden Spendenformulars in WordPress.

Wenn Sie mit dem Aussehen des Formulars zufrieden sind, können Sie es in einen WordPress-Beitrag oder eine Seite einbetten.

Klicken Sie dann auf „Veröffentlichen“. Charitable erstellt automatisch eine eigene Kampagnenseite für Ihr Formular. Diese Seite dient als zentrale Anlaufstelle für Ihre Spendenaktion (Sie können das Formular aber auch auf anderen Seiten, wie Ihrer Homepage, einbetten, indem Sie die unten beschriebenen Schritte befolgen).

Veröffentlichen einer Kampagne in WP Charitable

Und das war's – Sie haben erfolgreich Ihre erste Charitable-Kampagne erstellt und veröffentlicht.

Wenn Sie nun Ihre Website besuchen, können Sie Ihr Spendenformular in Aktion sehen.

WP Charitable Crowdfunding-Kampagne auf einer Live-Website

Das gesagt, Sie bemerken vielleicht auch den Link „Embed Wizard“ im Popup-Fenster oder die Schaltfläche „Embed“ im Charitable-Editor.

Sie können auch eine dieser Funktionen verwenden, um Ihr Spendenformular zu anderen Beiträgen oder Seiten hinzuzufügen.

Klicken Sie dazu einfach auf den Link „Embed Wizard“ oder die Schaltfläche „Embed“, und es wird die Einbettungsaufforderung ausgelöst.

Der Einbettungsassistent von Charitable

Im erscheinenden Popup müssen Sie zwischen der Auswahl einer vorhandenen Seite oder der Erstellung einer neuen Seite wählen.

Da wir bereits eine spezielle Spendenseiten-Formular haben, ist es eine gute Idee, „Bestehende Seite auswählen“ zu wählen. Klicken Sie einfach auf die Schaltfläche.

Bestehende Seite für die Einbettung der Spendenkampagne auswählen

Dann sehen Sie ein Dropdown-Menü mit einer Liste aller Seiten auf Ihrer WordPress-Website.

Sie können das Dropdown-Menü erweitern, eine Seite auswählen und auf die Schaltfläche „Los geht’s“ klicken.

Der 'Let's Go'-Button

Dies leitet Sie zum Block-Editor der Seite weiter.

Von hier aus können Sie auf die Schaltfläche „+“ klicken und nach dem Block „Charitable Campaign“ suchen. Klicken Sie dann einfach auf das Suchergebnis, um es zum Inhaltseditor hinzuzufügen.

Spendenkampagnen-Block

Danach können Sie ein Spendenformular aus dem Dropdown-Menü des Blocks „Charitable Campaign“ auswählen, das Sie einbetten möchten.

Erweitern Sie einfach das Dropdown-Menü und klicken Sie auf die Kampagne, die Sie hinzufügen möchten.

Auswahl einer Kampagne

Machen Sie sich keine Sorgen, wenn Sie die Vorschau im Inhaltseditor nicht sehen können. Der Block funktioniert einwandfrei.

Klicken wir also auf die Schaltfläche „Speichern“, „Aktualisieren“ oder „Veröffentlichen“, um es live zu schalten.

Und das war's – Sie können die Seite jetzt besuchen, um das Spendenformular in Aktion zu sehen:

Spendenformular auf einer Live-Website

3. So betten Sie HubSpot-Formulare in WordPress ein

HubSpot ist eine großartige Plattform für das Wachstum Ihres Unternehmens und bietet Tools wie eine Customer-Relationship-Management (CRM)-Plattform, einen Website-Builder und mehr.

Lesen Sie unseren vollständigen HubSpot-Testbericht, um mehr darüber zu erfahren, was es leisten kann.

Die gute Nachricht ist, dass es einen Formularersteller gibt, der hervorragend mit WordPress funktioniert. Wenn jemand ein Formular ausfüllt, werden seine Informationen direkt in das HubSpot CRM übertragen, sodass Sie ihn problemlos per E-Mail und Nachrichten kontaktieren können.

Homepage des HubSpot Form Builders

Sie können HubSpot sogar mit anderen Formulartools verbinden, einschließlich WPForms. Das macht die Plattform sehr praktisch, da sie mit vielen anderen Tools funktioniert, die Sie möglicherweise bereits verwenden.

In diesem Tutorial zeigen wir Ihnen, wie Sie HubSpot-Formulare mit dem Plugin HubSpot Form Builder und dem WPForms HubSpot Addon einbetten.

Einbetten von HubSpot-Formularen mit dem HubSpot-Plugin

Um HubSpot-Formulare mit dem Plugin einzubetten, müssen Sie zuerst das HubSpot-Plugin installieren. Wenn Sie Hilfe benötigen, lesen Sie unseren Leitfaden zur Installation eines WordPress-Plugins.

Nach der Aktivierung klicken Sie im WordPress-Dashboard auf das Menü 'HubSpot'. In diesem Bereich sehen Sie verschiedene Möglichkeiten, Ihre Website mit HubSpot zu verbinden:

  • Wenn Sie ein HubSpot-Konto haben, klicken Sie einfach auf „Anmelden“.
  • Wenn nicht, fahren Sie mit Ihrem Google-, Microsoft- oder Apple-Konto fort.
  • Wenn Sie möchten, können Sie dieselbe E-Mail-Adresse verwenden, mit der Sie Ihre Website registrieren.
Anmeldung bei HubSpot in WordPress

Sobald Sie sich angemeldet oder ein HubSpot-Konto erstellt haben, werden Sie aufgefordert, es mit Ihrer WordPress-Website zu verbinden.

Klicken Sie einfach auf die Schaltfläche „Website verbinden“, und HubSpot startet den Vorgang.

HubSpot mit der WordPress-Website verbinden

Sobald Sie verbunden sind, können Sie Ihr HubSpot-Formular mit dem HubSpot-Plugin erstellen.

Navigieren Sie zu HubSpot » Formulare. Dann können Sie auf die Schaltfläche „Formular erstellen“ klicken.

HubSpot-Formulare erstellen

Hier können Sie einen Formular-Typ und eine Vorlage auswählen. Anschließend werden Sie zu einem neuen Tab weitergeleitet, in dem Sie den Formular-Builder verwenden können, um Ihr HubSpot-Formular anzupassen.

Detaillierte Anweisungen finden Sie in der ersten Methode unseres Leitfadens zur Erstellung eines HubSpot-Formulars in WordPress.

Wenn Sie mit dem Aussehen Ihres Formulars zufrieden sind, besteht der nächste Schritt darin, es in Ihre Website einzubetten. Natürlich möchten Sie die Schaltfläche „Einbetten“ im Formular-Builder verwenden.

Einbetten-Schaltfläche im HubSpot-Formular-Builder

Diese Methode ist jedoch etwas verwirrend.

Es erlaubt Ihnen nur, den Formularlink zu teilen und einen HTML-Snippet in Ihrem WordPress-Beitrag oder Ihrer Seite zu verwenden.

Einbettungsmethoden im HubSpot Form Builder

Stattdessen können Sie auf die Schaltfläche „Zurück zu WordPress“ klicken und Ihre Formulare vom HubSpot-Dashboard in Ihrem Admin-Bereich einbetten.

Klicken Sie auf die Schaltfläche in der oberen linken Ecke.

Zurück zur WordPress-Schaltfläche im HubSpot-Formular-Builder

Von hier aus müssen Sie nur noch mit der Maus über das Formular fahren, das Sie einbetten möchten.

Klicken Sie danach einfach auf die Schaltfläche 'Einbetten', wenn sie erscheint.

HubSpot-Einbettungsbutton im WP-Adminbereich

Sie sehen dann ein Pop-up-Fenster, in dem HubSpot verschiedene Möglichkeiten zum Einbetten Ihres Formulars anzeigt.

Hier können Sie wählen, ob Sie Ihr HubSpot-Formular in einem Beitrag oder einer Seite mit dem HubSpot-Block einbetten möchten. Und wenn Sie zur anderen Registerkarte wechseln, finden Sie den Shortcode des Formulars.

Für dieses Tutorial klicken wir auf die Schaltfläche 'WordPress-Beitrag'.

HubSpots Popup-Fenster „Ihr Formular ist bereit“

Dies öffnet die Seite „Beiträge“ in einem neuen Tab. Öffnen Sie einen Beitrag, in den Sie das Formular einbetten möchten, indem Sie mit der Maus über einen Beitrag fahren und auf „Bearbeiten“ klicken, wenn er erscheint.

Sie können dann den HubSpot-Formularblock über den Inhaltseditor zur Seite hinzufügen.

Von hier aus können Sie auf die Schaltfläche „+“ klicken und die Suchleiste verwenden, um nach dem HubSpot-Formularblock zu suchen. Klicken Sie darauf, wenn Sie ihn sehen.

Hinzufügen eines HubSpot-Formularblocks zu einem Beitrag

Dadurch wird der HubSpot-Formularblock zum Inhaltsbereich hinzugefügt.

Als Nächstes klicken wir auf das Dropdown-Menü, um die verfügbaren Optionen zu öffnen. Dann können Sie das HubSpot-Formular auswählen, das Sie einbetten möchten.

HubSpot-Formular eingebettet

Und das war's! Sie können nun auf die Schaltfläche „Speichern“ klicken, um Ihre Änderungen zu speichern.

So sieht es auf unserer Demoseite aus:

HubSpot-Formular auf einer Live-Website
Einbetten von HubSpot-Formularen mit dem WPForms HubSpot Addon

Die Verwendung von WPForms zur Erstellung eines HubSpot-Formulars ist eine einfachere und effizientere Methode, um Formulare und Kontakte zu verwalten, ohne sich mit mehreren Plugins herumschlagen zu müssen.

WPForms kümmert sich sowohl um die Formularerstellung als auch um die HubSpot-Integration an einem Ort. Dies vereinfacht den Prozess, indem es Zugriff auf den Drag-and-Drop-Builder und die Vorlagen von WPForms bietet und gleichzeitig Ihre Formulardaten automatisch mit HubSpot synchronisiert.

✏️ Hinweis: Um das HubSpot Addon in WPForms zu verwenden, benötigen Sie den Elite-Plan.

Zusätzlich zum HubSpot-Addon und allem im Pro-Plan können Sie das Plugin für unbegrenzte WordPress-Sites nutzen und den Premium-Support freischalten. Das macht es perfekt, wenn Sie eine Marketingagentur betreiben.

Als Erstes müssen Sie das WPForms Plugin installieren und aktivieren. Lesen Sie unseren detaillierten Leitfaden zur Installation eines WordPress-Plugins.

Nach der Aktivierung müssen Sie Ihren Lizenzschlüssel unter WPForms » Einstellungen verifizieren.

Ihren Lizenzschlüssel finden Sie in Ihrem WPForms-Konto. Klicken Sie einfach auf das Clipboardsymbol, um ihn zu kopieren. Dann können Sie zu Ihrem WordPress-Tab zurückkehren und das Feld „Lizenzschlüssel“ ausfüllen.

Klicken Sie auf die Schaltfläche „Schlüssel überprüfen“, um Ihren Plan zu aktivieren.

Aktivieren des Lizenzschlüssels für WPForms

Gehen wir nun zu WPForms » Addons im Admin-Dashboard, um das HubSpot Addon zu installieren.

Scrollen Sie von hier aus nach unten und suchen Sie das HubSpot-Add-on. Klicken Sie dann auf die Schaltfläche „Add-on installieren“.

Installation des HubSpot Addons in WPForms

Nach der Aktivierung des Add-ons sollten Sie im WordPress-Dashboard zum WPForms-Panel 'Einstellungen' navigieren und dann zum Tab 'Integration' wechseln.

Hier können Sie Ihr HubSpot CRM-Konto mit WPForms verbinden. Klicken Sie einfach auf „+ Neues Konto hinzufügen“ und geben Sie Ihre Kontodaten ein.

Hinzufügen eines HubSpott-Kontos zu WPForms

Sobald dies erledigt ist, ist es an der Zeit, ein HubSpot-Formular von WPForms zu erstellen und einzubetten.

Zuerst müssen Sie Ihr Formular erstellen, indem Sie zu WPForms » Neu hinzufügen navigieren. Auf dem nächsten Bildschirm benennen Sie das Formular und wählen eine Formularvorlage aus.

Danach können Sie die Vorlage mit dem Formular-Builder anpassen.

Wenn alles gut aussieht, wechseln Sie zum Bereich „Marketing“. Öffnen Sie nun die Option „HubSpot“, um das Formular mit der Plattform zu verbinden.

Neue HubSpot-Verbindung in WPForms hinzufügen

Geben Sie Ihre HubSpot-Kontodetails ein und folgen Sie den Einrichtungshinweisen.

Sobald dies erledigt ist, können Sie das Formular mit dem WPForms-Block oder dem Shortcode des Formulars veröffentlichen. Weitere Details finden Sie in unserem Leitfaden zur Erstellung eines HubSpot-Formulars in WordPress.

4. So betten Sie Google Forms in WordPress ein

WPForms und andere WordPress-Formularersteller sind sehr einfach zu bedienen. Sie funktionieren direkt auf Ihrer WordPress-Website und ermöglichen Ihnen viele Dinge, wie z. B. die Erstellung von Formularen, die Zahlungen akzeptieren, Anmeldeformulare, benutzerdefinierte Registrierungsformulare und mehr.

Manchmal müssen Sie ein Formular jedoch auf verschiedenen Websites oder Plattformen teilen.

In diesen Fällen kann Google Forms sehr praktisch sein. Sie lassen sich einfach teilen, funktionieren hervorragend auf Mobiltelefonen und speichern alle Antworten an einem Ort. Außerdem können Sie Mitarbeiter hinzufügen, die Ihnen bei den Antworten helfen, die alle in Google Drive gespeichert sind.

Um ein Google Formular in WordPress einzubetten, können Sie zunächst ein Formular auf der Website von Google Forms erstellen. Klicken Sie einfach auf die Schaltfläche „Zu Formularen gehen“.

Die Schaltfläche „Zu Formularen gehen“ in Google Forms

Auf dem nächsten Bildschirm sehen Sie verschiedene Formularvorlagen. Klicken Sie auf eine davon, um mit dem Erstellen zu beginnen.

Sie können auch bei Null anfangen, indem Sie auf 'Leeres Formular' klicken.

Google Forms-Vorlagen

Sobald Sie eine Vorlage ausgewählt haben, können Sie mit der Anpassung des Formulars beginnen. Hier sind einige Dinge, die Sie möglicherweise tun müssen:

  • Erstellen Sie den Titel des Formulars.
  • Geben Sie die Formularbeschreibung an.
  • Passen Sie die Felder an Ihre Ziele an.
Felder zu Google Forms hinzufügen

Sie können auch KI-Tools verwenden, um die am besten geeigneten Felder für Ihre Fragen auszuwählen.

Wenn Sie mit dem Aussehen des Formulars zufrieden sind, klicken Sie auf die Schaltfläche 'Senden'. Dies öffnet ein Pop-up-Fenster, in dem Sie den Einbettungscode des Formulars erhalten können.

Einbettungscode von Google Forms kopieren

Nachdem Sie diesen Code kopiert haben, können Sie eine Seite oder einen Beitrag in WordPress öffnen, auf der Sie das Formular anzeigen möchten.

Klicken wir im Content-Editor der Seite oder des Beitrags auf die Schaltfläche „+“ und suchen nach dem Block „Benutzerdefinierter HTML-Code“.

Klicken Sie darauf, um es zu Ihrer Seite hinzuzufügen.

Benutzerdefinierten HTML-Block in WordPress hinzufügen

Fügen Sie dann einfach den Einbettungscode von Google Forms in den Custom HTML-Block ein.

Vergessen Sie nicht, nach Abschluss auf die Schaltfläche „Aktualisieren“ oder „Veröffentlichen“ zu klicken.

Wenn Sie nun Ihre Website besuchen, sollten Sie das Google-Formular in Aktion sehen:

Google Forms-Vorschau auf einer Live-WordPress-Website

Ausführlichere Schritt-für-Schritt-Anleitungen finden Sie in unserem Leitfaden „So betten Sie ein Google Formular in WordPress ein“.

5. So betten Sie Zoho Forms in WordPress ein

Zoho Forms ist ein großartiges Werkzeug, mit dem Sie ganz einfach alle Arten von Formularen erstellen können. Egal, ob Sie ein Kontaktformular, eine Umfrage, ein Registrierungsformular oder ein Bestellformular benötigen, Zoho Forms hat das Richtige für Sie.

Darüber hinaus ist das Einbetten eines Zoho-Formulars in Ihre WordPress-Website einfach. Aber bevor wir zu diesem Teil kommen, erstellen wir zuerst das Formular.

Um loszulegen, müssen Sie ein Konto auf der Zoho Forms-Website erstellen. Klicken Sie einfach auf „Kostenlos anmelden“.

Homepage von Zoho Forms

Sobald Sie ein Konto erstellt haben, können Sie mit der Erstellung Ihres Formulars beginnen.

Zuerst müssen Sie im Formular-Builder auf die Schaltfläche „Neues Formular“ klicken.

Die Schaltfläche "Neues Formular" in Zoho Forms

Sie werden dann sehen, dass Zoho Forms 3 Möglichkeiten zur Formularerstellung bietet:

  • Erstellen Sie Formulare von Grund auf neu mit dem Standard- oder Kartenformular-Typ.
  • Verwenden Sie vorgefertigte Formularvorlagen.
  • Erstellen Sie CRM-Formulare, eine Funktion, die nur mit dem Pro-Plan-Upgrade verfügbar ist.
Drei Möglichkeiten, Zoho Forms zu erstellen

Für diese Anleitung wählen wir die Vorlage „Website-Feedback“.

Klicken wir also auf die Schaltfläche „Diese Vorlage verwenden“.

Zoho Forms' Schaltfläche „Diese Vorlage verwenden“

Damit ist es erledigt, und Sie befinden sich im Zoho Forms Formular-Builder.

Das linke Bedienfeld enthält alle Anpassungsoptionen, und die Formularvorschau befindet sich auf der rechten Seite. Sie können Elemente zu Ihrem Formular hinzufügen, indem Sie sie einfach per Drag & Drop verschieben.

Mit Zoho Forms können Sie auch das Design des Formulars ändern, um es an das Design Ihrer Website anzupassen.

Um dies zu tun, können Sie zum Tab 'Themes' gehen. Fahren Sie dann einfach mit der Maus über das Theme, das Sie verwenden möchten, und klicken Sie auf 'Anwenden'.

Zoho Forms-Design anwenden

Wenn alles bereits gut aussieht, können Sie zum Tab „Teilen“ wechseln.

In diesem Tab sehen Sie, dass Zoho Forms viele Optionen zum Einbetten von Formularen bietet.

Da wir es in eine WordPress-Site einbetten werden, gehen wir zu Einbetten » Website-Builder. Klicken Sie dann auf die Schaltfläche „Zu WordPress wechseln“.

Der Button „Go to WordPress“ in Zoho Forms

Anschließend werden Sie zur Seite Zoho Forms im WordPress-Plugin-Verzeichnis weitergeleitet.

Sie müssen lediglich das Plugin installieren. Wenn Sie Hilfe benötigen, finden Sie in unserem Leitfaden „So installieren Sie ein WordPress-Plugin“.

Nach der Aktivierung können Sie einen Beitrag oder eine Seite öffnen, auf der Sie Zoho Forms einbetten möchten. Von hier aus klicken Sie auf die Schaltfläche „+“ und wählen den Zoho Forms-Block aus.

Hinzufügen des Zoho Forms-Blocks zum WP-Inhaltseditor

Sobald der Block hinzugefügt wurde, können Sie auf die Schaltfläche 'Zoho Forms aufrufen' klicken.

Es gibt auch den Link „Einbetten mit Permalink“, aber wir empfehlen diese Methode nicht, da sie nicht so anfängerfreundlich ist.

Die Schaltfläche 'Zoho Forms zugreifen' im Zoho Forms-Block

Dann werden Sie aufgefordert, die Domain auszuwählen, auf der Sie Ihr Zoho-Konto registriert haben.

In diesem Fall wählen wir „zoho.com“ aus dem Dropdown-Menü und klicken auf „Verbinden“.

Zoho-Konto verbinden

Danach können Sie das Formular auswählen, das Sie einbetten möchten.

Klicken Sie einfach auf das Dropdown-Menü und wählen Sie eine der verfügbaren Optionen aus. Scrollen Sie dann nach unten und klicken Sie auf die Schaltfläche 'Einbetten'.

Einbetten des Website-Feedback-Formulars

Ihr Inhaltseditor lädt dann Ihr Zoho-Formular.

Wenn Ihnen gefällt, was Sie sehen, klicken Sie auf die Schaltfläche 'Speichern'.

Speichern des Beitrags mit Zoho Forms

Wenn Sie die Seite jetzt besuchen, sehen Sie Ihr Zoho-Formular in Aktion.

So könnte es aussehen:

Zoho Forms auf einer Live-Website

Aus dem obigen Bild können Sie auch sehen, dass das Zoho Forms-Theme es einfacher macht, das Formular an das Design Ihrer Website anzupassen.

6. E-Mail-Anmeldeformulare in WordPress einbetten

OptinMonster ist zwar kein typischer Formularersteller, aber ein ausgezeichnetes Werkzeug zum Erstellen von Anmeldeformularen und zum Aufbau einer E-Mail-Liste.

Tatsächlich ist OptinMonster die beste Lösung zur Lead-Generierung für WordPress.

Bei WPBeginner haben wir mit diesem Lead-Generierungs-Tool hervorragende Ergebnisse erzielt. Mit OptinMonster haben wir beispielsweise unsere E-Mail-Abonnenten um 600 % gesteigert.

Benötigen Sie eine detaillierte Aufschlüsselung der Software? Sehen Sie sich unseren vollständigen OptinMonster-Testbericht an.

Beim Einrichten von E-Mail-Anmeldeformularen können Sie verschiedene Kampagnentypen verwenden, z. B. Slide-ins und Lightbox-Popups. Bevor wir also darüber sprechen, wie das OptinMonster-E-Mail-Anmeldeformular eingebettet wird, stellen wir sicher, dass das Formular bereit ist.

Zuerst müssen Sie ein OptinMonster-Konto auf deren Website erstellen, indem Sie auf die Schaltfläche „OptinMonster jetzt erhalten“ klicken.

OptinMonsters Homepage

Dies bringt Sie zur Preisgestaltungsseite.

Wir empfehlen den Pro-Tarif, da er beliebt ist und die Funktion „Exit Intent“ enthält. Sie können auch unseren exklusiven WPBeginner OptinMonster-Gutscheincode verwenden, um zusätzliche 10 % Rabatt zu erhalten.

Um Ihren Kauf abzuschließen, geben Sie einfach Ihre Zahlungsdaten ein und fahren Sie mit der Zahlung fort.

Danach installieren und aktivieren wir das OptinMonster WordPress-Plugin. Wenn Sie Hilfe benötigen, lesen Sie bitte unseren Schritt-für-Schritt-Leitfaden „So installieren Sie ein WordPress-Plugin“.

Dieses Plugin verbindet Ihre WordPress-Site mit OptinMonster. Navigieren Sie einfach in Ihrem WordPress-Admin-Panel zu OptinMonster » Einstellungen. Klicken Sie dann auf „Ihr bestehendes Konto verbinden“.

Verbinden Sie Ihr bestehendes Konto

Sobald die Verbindung hergestellt ist, können Sie Ihr OptinMonster-E-Mail-Anmeldeformular erstellen. Detaillierte Anweisungen finden Sie in unserem Leitfaden „So erstellen Sie Ihre E-Mail-Liste in WordPress mit OptinMonster“.

Die detaillierten Anzeigeregeln von OptinMonster ermöglichen es Ihnen, die richtige Kampagne zur richtigen Zeit der richtigen Person anzuzeigen, was zur Steigerung der Konversionsraten beiträgt.

Sie finden diese Einstellungen, indem Sie im Kampagnen-Builder zu „Anzeigeregeln“ gehen.

Der Tab "Anzeigeregeln" in OptinMonster

Hier können Sie steuern, wann und wo Ihre Kampagnen basierend auf dem Kundenverhalten angezeigt werden.

Sie können auch Kampagnen für verschiedene Zielgruppen anpassen, z. B. unterschiedliche Layouts für Mobil- und Desktop-Benutzer anzeigen.

Hinzufügen von Anzeigeregeln zu einer Marketing- oder Werbekampagne

OptinMonster ermöglicht es Ihnen, Regeln basierend auf bestimmten Tagen oder Standorten festzulegen, sodass Sie gezielte Kampagnen wie Black Friday-Angebote oder Feiertags-Popups für verschiedene Länder durchführen können.

Zusätzlich hilft die Exit-Intent-Technologie von OptinMonster dabei, Besucher zurückzugewinnen, die Ihre Website verlassen wollen. Diese Funktion verfolgt das Nutzerverhalten und löst kurz vor dem Verlassen eine gezielte Nachricht aus, sodass Sie mehr E-Mail-Abonnenten gewinnen und die Konversionen steigern können.

Regeln für die Anzeige beim Verlassen der Seite

Wenn Sie mit allem zufrieden sind, ist es an der Zeit, das Lead-Generierungsformular in Ihre Website einzubetten.

Klicken Sie einfach auf die Schaltfläche „Speichern“ im Builder, um den Vorgang zu starten.

OptinMonsters Speichern-Schaltfläche

Nachdem Sie sichergestellt haben, dass Sie Ihre Änderungen gespeichert haben, können Sie zum Tab „Veröffentlichen“ (Publish) wechseln.

Ändern Sie von hier aus den Status von 'Entwurf' zu 'Veröffentlichen'.

Sie sehen dann, dass sich die Registerkarte „Veröffentlichen“ in „Veröffentlicht“ geändert hat und das Pausensymbol durch ein Häkchen ersetzt wurde.

OptinMonster-Popup veröffentlichen

Sie können den Kampagnen-Editor jetzt schließen und zu OptinMonster » Kampagnen navigieren.

Der nächste Schritt ist die Änderung des Status von „Ausstehend“ zu „Veröffentlicht“ für Ihr E-Mail-Anmelde-Pop-up.

Klicken Sie einfach auf den Link „Ausstehend“, um das Dropdown-Menü zu öffnen und die Option „Veröffentlichen“ auszuwählen.

Status einer OptinMonster-Kampagne ändern

Da haben Sie es!

Wenn Sie nun Ihre Website besuchen, sehen Sie das E-Mail-Anmelde-Popup in Aktion.

OptinMonsters' E-Mail-Anmeldung auf einer Live-Website

💡 Wandeln Sie abwandernde Besucher in Abonnenten um! Mit der charakteristischen Exit-Intent®-Technologie von OptinMonster können Sie gezielte Popups und Slide-ins genau in dem Moment anzeigen, in dem ein Benutzer Ihre Website verlassen möchte.

Jetzt mit OptinMonster loslegen und Leads erfassen, die Sie sonst verloren hätten.

7. So betten Sie Zahlungsformulare in WordPress ein

Wenn Sie nur ein einzelnes Produkt verkaufen möchten oder keinen vollständigen Warenkorb einrichten wollen, dann sind umfassende E-Commerce-Plugins wie Easy Digital Downloads oder WooCommerce möglicherweise übertrieben.

Das Erstellen eines einfachen Zahlungsformulars ist oft eine bessere Option, um benutzerdefinierte Beträge zu akzeptieren oder einige Artikel zu verkaufen. Hier kann WP Simple Pay helfen.

Es ist die beste Wahl, um Stripe-Zahlungen zu akzeptieren, ohne ein vollständiges E-Commerce-Plugin zu benötigen.

WP Simple Pay

WP Simple Pay ermöglicht es Ihnen auch, andere Zahlungsmethoden wie Kreditkartenzahlungen, Apple Pay, Google Pay und mehr zu akzeptieren. Es ist ideal für gemeinnützige Organisationen, kleine Unternehmen und Freiwillige, die eine einfache Lösung zum Sammeln von Zahlungen benötigen.

Erfahren Sie mehr über die Plattform in unserem vollständigen WP Simple Pay Testbericht.

Um ein Zahlungsformular einzubetten, müssen Sie zuerst das WP Simple Pay Plugin installieren. Wenn Sie Hilfe benötigen, finden Sie hier unsere Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.

Befolgen Sie nach der Aktivierung einfach den Einrichtungsassistenten, um eine Verbindung zu Stripe herzustellen.

Verbindung Ihrer WordPress-Website mit Stripe

Sobald die Verbindung hergestellt ist, können Sie Ihr Zahlungsformular mit WP Simple Pay erstellen.

Für detaillierte Anweisungen können Sie die erste Methode in unserer Anleitung zur Erstellung eines WordPress-Formulars mit Zahlungsoptionen befolgen.

Wenn Sie mit Ihrem Zahlungsformular zufrieden sind, klicken Sie auf die Schaltfläche „Veröffentlichen“. Anschließend können Sie den Shortcode des Formulars kopieren, um ihn in Ihren Beitrag oder Ihre Seite einzubetten.

WP Simple Pay's Shortcode

Im WordPress-Inhaltseditor müssen Sie nur auf die Schaltfläche „+“ klicken und den Block „Shortcode“ auswählen.

Als Nächstes können Sie den Shortcode des Formulars in den Textbereich einfügen.

Hinzufügen eines Shortcode-Blocks in Gutenberg

Beachten Sie, dass WP Simple Pay Ihr Zahlungsformular standardmäßig im Testmodus erstellt. Das bedeutet, dass Sie noch keine Zahlungen von Besuchern annehmen können.

Um dies zu beheben, navigieren wir im WordPress-Dashboard zu WP Simple Pay » Zahlungsformulare. Dann können Sie mit der Maus über das gerade erstellte Formular fahren und auf „Bearbeiten“ klicken, wenn es erscheint.

WP Simple Pay Formular bearbeiten

In diesem Bereich möchten Sie zum Abschnitt 'Zahlungen' navigieren.

Schließlich können Sie die Option „Live-Modus“ (Live Mode) auswählen und dann auf „Aktualisieren“ (Update) klicken.

WP Simple Pay-Formular in den Live-Modus versetzen

Und so betten Sie ein WP Simple Pay-Formular ein und beginnen mit der Annahme von Zahlungen von Ihrem Publikum.

So sieht es auf unserer Demoseite aus:

Buy Me a Coffee WP Simple Pay-Schaltfläche auf einer Live-Website

💡 Akzeptieren Sie Zahlungen in wenigen Minuten! Akzeptieren Sie einmalige oder wiederkehrende Zahlungen direkt auf Ihrer Website. Perfekt für den Verkauf eines einzelnen Produkts, das Sammeln von Spenden oder das Berechnen von Gebühren für eine Dienstleistung.

Bringen Sie Ihr Zahlungsformular mit WP Simple Pay live – kein komplizierter Warenkorb erforderlich.

8. Wie man Formidable Forms in WordPress einbettet

Formidable Forms ist ein großartiges Werkzeug zur Erstellung von erweiterten Formularen, wie z. B. einem Hypotheken-, Autozahlungs- oder Lebensversicherungsrechner. Es bietet über 300 Formularvorlagen, die Sie für Ihre WordPress-Website verwenden können.

Details zur Erstellung eines Formulars mit Formidable Forms finden Sie in unserem vollständigen Formidable Forms Testbericht.

Formidable Forms

Formidable Forms macht es super einfach, Ihre Formulare in jeden Beitrag oder jede Seite einzufügen.

Sobald Sie mit der Erstellung Ihres Formulars fertig sind, können Sie im Formular-Builder auf die Schaltfläche „Einbetten“ klicken.

Formidable Forms' Embed-Schaltfläche

Dies öffnet ein Popup-Fenster, in dem Sie auswählen können, wo das Formular hinzugefügt werden soll. Es gibt 3 Optionen: „Bestehende Seite auswählen“, „Neue Seite erstellen“ und „Manuell einfügen“.

Wenn Sie die Option „Manuell einfügen“ wählen, müssen Sie sich mit etwas Code auseinandersetzen. Das kann für Anfänger etwas einschüchternd sein, daher empfehlen wir es nicht.

Für dieses Tutorial wählen wir „Vorhandene Seite auswählen“.

Formidable Forms' Embed-Formularoptionen

Als Nächstes erscheint ein weiteres Eingabeaufforderungsfenster.

Hier möchten Sie das Dropdown-Menü öffnen und eine Seite auswählen. Wir haben zum Beispiel das Formular auf der 'Startseite' unserer Demo-Website eingebettet.

Auswahl einer Seite zum Einbetten von Formidable Forms

Nachdem Sie die Seite ausgewählt haben, klicken Sie auf die Schaltfläche „Formular einfügen“.

Dadurch wird der Block-Editor der Seite geöffnet, und Sie sollten sehen, dass das Formular bereits auf der Seite eingebettet ist.

Formidable Forms im Block-Editor eingebettet

Jetzt sind Sie bereit, die Seite zu aktualisieren – klicken Sie einfach auf die Schaltfläche „Speichern“.

So sieht es auf unserer Demoseite aus:

Formidable Forms auf einer Live-Website

9. So binden Sie Gravity Forms in WordPress ein

Gravity Forms ist ein leistungsstarkes Formular-Builder-Plugin für WordPress, aber hier ist der Haken – es ist nur Premium.

Dieses Formular-Tool bietet eine breite Palette von Funktionen und Anpassungsoptionen. Es ermöglicht Ihnen, viele Arten von Formularen zu erstellen, wie z. B. Umfragen, Quiz, Registrierungen und Bestellformulare.

Wir haben es ausprobiert, um alle Funktionen zu testen, die Sie in unserem umfassenden Gravity Forms Testbericht finden können.

Gravity Forms Homepage

Um ein Formular mit Gravity Forms zu erstellen, müssen Sie das Plugin von der Gravity Forms-Website erwerben.

Dann können Sie es auf Ihrer Website installieren und aktivieren. Wenn Sie Hilfe benötigen, beachten Sie bitte unsere Anleitung zur Installation eines WordPress-Plugins.

Nach der Aktivierung navigieren Sie in Ihrem WordPress-Dashboard zu Gravity Forms » Neues Formular und klicken auf „Neu hinzufügen“.

Erstellen eines neuen Formulars mit Gravity Forms

Auf dem nächsten Bildschirm wählen Sie eine Formularvorlage aus.

Kein Grund zur Eile – Sie können dieses Pop-up-Fenster erkunden, um die Vorlage zu finden, die Sie verwenden möchten. Sobald Sie sie gefunden haben, fahren Sie einfach mit der Maus über die Vorlage und klicken Sie auf die Schaltfläche „Vorlage verwenden“.

Die Schaltfläche „Vorlage verwenden“ in Gravity Forms

Als Nächstes werden Sie aufgefordert, Ihrem Formular einen Namen zu geben und eine kurze Formularbeschreibung zu schreiben.

Sie können das folgende Bild als Beispiel verwenden:

Beispiele für Formularnamen und -beschreibungen

Klicken Sie erneut auf „Vorlage verwenden“, um mit dem Erstellen des Formulars zu beginnen.

Dies öffnet den Drag-and-Drop-Builder von Gravity Forms, wo Sie Ihr Formular mit den Feldern auf der rechten Seite anpassen können.

Gravity Forms' Formular-Ersteller

Sobald Ihr Formular fertig ist, können Sie auf die Schaltfläche „Formular speichern“ klicken, um sicherzustellen, dass Sie alle Änderungen gespeichert haben.

Klicken Sie dann auf „Einbetten“.

Dadurch werden 3 Optionen zum Einbetten Ihres Gravity Forms-Formulars geöffnet – in eine vorhandene Seite, eine neue Seite oder eine Shortcode-Methode für Benutzer des klassischen Editors.

Gravity Forms einbetten

Für dieses Tutorial zeigen wir Ihnen, wie Sie Gravity Forms in eine bestehende Webseite einbetten.

Wählen Sie von hier aus die Option „Beitrag“ (Post) aus. Anschließend können Sie das Dropdown-Menü öffnen, um einen veröffentlichten Beitrag auf Ihrer WordPress-Website auszuwählen.

Einbinden von Gravity Forms in einen bestehenden Beitrag

Klicken Sie auf die Schaltfläche „Formular einfügen“.

Sie werden dann zum Inhaltseditor der Seite weitergeleitet, wo Sie aufgefordert werden, den Block „Formular“ hinzuzufügen. Klicken Sie darauf.

Der Gravity Forms-Block zum Hinzufügen zum Inhaltseditor

Gravity Forms fügt dann das gerade erstellte Formular zum Beitrag hinzu.

Möglicherweise stellen Sie auch fest, dass standardmäßig der 'Formulartitel' und die 'Formularbeschreibung' enthalten sind.

Gravity Forms enthält standardmäßig Titel und Beschreibungen

Wenn Sie der Meinung sind, dass alles eingestellt ist, ist es an der Zeit, auf die Schaltfläche „Speichern“ zu klicken.

Und das ist alles – Sie haben ein Gravity Forms-Formular auf Ihrer WordPress-Website erstellt und eingebettet.

Gravity Forms auf einer Live-Website

10. So betten Sie Microsoft Forms in WordPress ein

Manche Leute möchten vielleicht Microsoft Forms zur Erstellung von Formularen verwenden, da es ein Werkzeug ist, mit dem sie aufgrund ihres Office 365-Kontos bereits vertraut sind. Es integriert sich auch automatisch mit anderen Microsoft-Produkten wie Excel, was die Datenerfassung und -verwaltung erleichtert.

Microsoft Forms bietet integrierte Optionen zum Erstellen von Umfragen, Quiz und Abstimmungen. Sie können Microsoft 365-Formulare dann einfach in WordPress einbetten, indem Sie den Einbettungscode des Formulars kopieren und ihn zu Ihrer WordPress-Site hinzufügen.

Zuerst erstellen Sie Ihr Formular mit Microsoft Forms in Ihrem Office 365-Konto.

Von der Office 365-Homepage klicken wir auf „Anmelden“, um zu beginnen.

Anmeldung bei Ms 365

Nach der Anmeldung können Sie auf das Menüsymbol in der oberen linken Ecke der Seite klicken.

Dann möchten Sie „Formulare“ finden und darauf klicken.

Ms Forms

Dies öffnet die Vorlagengalerie in einem neuen Tab. Sie können dann die Formulare auswählen, die Sie erstellen möchten.

Microsoft Forms bietet 4 Formulare zur Auswahl: Umfrage, Quiz, Einladung und Registrierung. Für dieses Tutorial wählen wir die Option 'Einladung'. Klicken wir darauf.

Auswahl des Formular-Typs

Der Microsoft Forms-Editor wird in einem neuen Tab geöffnet. Von hier aus wählen Sie zunächst eine Vorlage aus.

Sie können die Vorlagenoptionen im linken Bereich erkunden. Da wir ein Einladungsformular erstellen, haben wir 7 fertige Vorlagen für verschiedene Zwecke.

Für dieses Tutorial verwenden wir die Vorlage für Hochzeitseinladungen. So sieht die Standardvorlage im Editor aus:

Formular für Hochzeitseinladungen

Wenn Sie im rechten Bedienfeld nach unten scrollen, finden Sie die Standardfelder, die diese Vorlage bietet.

Diese Vorlage enthält 4 voreingestellte Felder für Namen, Anzahl der Gäste, Lebensmittelallergien und E-Mail-Adressen der Benutzer.

Nehmen wir an, Sie möchten weitere Fragen hinzufügen. In diesem Fall können Sie auf die Schaltfläche '+ Neue Frage einfügen' klicken und den Fragetyp auswählen, z. B. 'Datum', 'Bewertung', 'Text' oder andere.

Wenn Sie die vorhandenen bearbeiten möchten, klicken Sie einfach auf eines davon, und die Anpassungsoptionen werden angezeigt.

Ein Feld bearbeiten

Um das Aussehen zu ändern, können Sie auf das Paletten-Symbol klicken.

Von hier aus können Sie das Formularlayout und das Hintergrundbild ändern.

Styling eines Formulars für Hochzeitseinladungen

Sie können dann zur Einstellungsregisterkarte wechseln, indem Sie auf das Zahnradsymbol klicken.

Microsoft Forms hat bereits einige Grundeinstellungen konfiguriert. Sie möchten jedoch möglicherweise Folgendes aktivieren:

  • ‘End Date’ (Enddatum), um Ihren Hochzeitstag strategisch basierend auf den Antworten zu planen.
  • ‘Get email notification of each response’ (E-Mail-Benachrichtigung für jede Antwort erhalten), damit Sie über Sicherungsdaten verfügen, um den Verlust von Antworten zu verhindern.

Wenn Sie möchten, können Sie auch die voreingestellte Bestätigungsnachricht bearbeiten.

Konfiguration der Einladungsformular für Hochzeiten

Sobald das Formular bereit ist, ist es an der Zeit, es zu starten.

Im Formular-Builder klicken wir auf die Schaltfläche 'Antworten sammeln'.

Schaltfläche Antworten sammeln

Im erscheinenden Popup können Sie auf das Symbol „</>“ oder das Einbettungssymbol klicken.

Sie sollten nun den HTML-Einbettungscode für Ihre Website sehen. Klicken Sie auf „Kopieren“.

MS Forms Shortcode kopieren

Jetzt können Sie diesen Code in einen Beitrag oder eine Seite einfügen, indem Sie den Block 'Benutzerdefiniertes HTML' verwenden.

Klicken Sie im WordPress-Inhaltseditor einfach auf die Schaltfläche „+“, um den Block hinzuzufügen. Dann können Sie die Suchleiste verwenden, um nach dem Block „Benutzerdefiniertes HTML“ zu suchen.

Klicken Sie darauf, um den Block zum Inhaltseditor hinzuzufügen.

Hinzufügen eines benutzerdefinierten HTML-Blocks

Von hier aus fügen Sie den Einbettungscode von Microsoft Forms in den Textbereich ein.

Machen Sie sich keine Sorgen, wenn Sie im Editor keine Vorschau sehen; der Shortcode funktioniert einwandfrei.

Ms Forms Shortcode einbetten

Jetzt können Sie auf die Schaltfläche „Veröffentlichen“ oder „Aktualisieren“ klicken, um sie live zu schalten.

So sieht es auf unserer Demoseite aus:

Microsoft Forms auf einer Live-Website

11. So betten Sie HTML-Formulare in WordPress ein

HTML-Formulare werden normalerweise von Hand codiert, sodass Sie keinen Drag-and-Drop-Editor zum Bearbeiten Ihres Formulars haben.

Glücklicherweise gibt es Formular-Plugins, die die Einrichtung von HTML-Formularen narrensicherer machen.

Eine der besten Optionen ist das kostenlose HTML Forms-Plugin. Dieses Plugin eignet sich hervorragend zum Einrichten einfacher Kontaktformulare, mit denen Sie Informationen von Besuchern sammeln können.

Der Formularcode-Editor in HTML-Formularen

Das Beste daran ist, dass Sie keine Programmierkenntnisse benötigen, um HTML-Formulare zu verwenden.

Das Hinzufügen eines neuen Feldes ist einfach. Wählen Sie einfach eines der verfügbaren Optionen aus, und HTML Forms wird Sie auffordern, die Daten des Feldes anzupassen.

Hinzufügen eines Dropdown-Feldes in HTML-Formularen

Nach dem Klicken auf die Schaltfläche „Feld zum Formular hinzufügen“ konvertiert HTML Forms die Daten in einen HTML-Snippet und fügt ihn in den Bereich „Formularcode“ ein.

Und das ist alles. Vergessen Sie nicht, auf die Schaltfläche „Änderungen speichern“ zu klicken, um Ihre Fortschritte zu sichern.

Jetzt ist es an der Zeit, das Formular zu veröffentlichen.

Mit HTML Forms können Sie Ihr Formular ganz einfach in jeden Beitrag, jede Seite oder jeden Widget-Bereich einbetten. Dazu benötigen Sie den Shortcode des Formulars. Sie finden den Shortcode Ihres Formulars im oberen Bereich des Bedienfelds „Formular bearbeiten“.

HTML-Formular-Shortcode

Kopieren wir diesen Shortcode in die Zwischenablage.

Sie können dann eine Seite oder einen Beitrag öffnen, auf dem Sie das HTML-Formular anzeigen möchten. Für dieses Tutorial fügen wir das Formular zu unserer „Kontakt“-Seite hinzu.

Sobald Sie sich im Block-Editor befinden, klicken Sie einfach auf die Schaltfläche „+“ und suchen Sie nach dem Block „Shortcode“. Klicken Sie darauf, um ihn zu Ihrer Seite hinzuzufügen.

Hinzufügen des Shortcode-Blocks zum WodPress-Content-Editor

Sie können dann den Shortcode in den Block „Shortcode“ einfügen.

Der Block-Editor zeigt keine Live-Vorschau des Formulars an. Aber keine Sorge – es wird auf der Live-Seite korrekt angezeigt, sobald Sie es speichern oder veröffentlichen.

Shortcode für HTML-Formulare hinzugefügt

Lassen Sie uns also auf die Schaltfläche „Speichern“ klicken, um es in Aktion zu sehen.

So könnte es auf Ihrer Website aussehen:

HTML-Formulare auf einer Live-Website

Ausführliche Anweisungen finden Sie in unserem Leitfaden zum Hinzufügen von HTML-Formularen zu WordPress.

Häufig gestellte Fragen zum Einbetten von WordPress-Formularen

Haben Sie Fragen zum Einbetten von Formularen in WordPress? Hier sind einige schnelle Antworten, die Ihnen den Einstieg erleichtern.

Können Formulare in WordPress eingebettet werden?

Ja. Sie können Formulare ganz einfach in WordPress mit verschiedenen Plugins einbetten, darunter WPForms, der beste Allzweck-Formularersteller.

Wie installiere ich ein Formular in WordPress?

Zuerst gehen Sie in Ihrem WordPress-Adminbereich zu Plugins » Neues Plugin hinzufügen. Der nächste Schritt ist, ein Formular-Plugin Ihrer Wahl zu finden und es dann einfach zu installieren und zu aktivieren. Sobald dies erledigt ist, verwenden Sie das Plugin, um ein Formular zu erstellen und es mit einem Shortcode oder Block auf Ihrer Website einzubetten.

Wie richte ich WPForms in WordPress ein?

Um WPForms einzurichten, müssen Sie zuerst das WPForms-Plugin installieren und aktivieren. Als Nächstes können Sie mit dem Drag-and-Drop-Builder ein neues Formular erstellen und das Formular mit einem Shortcode oder dem Block des Plugins auf Ihrer Website einbetten.

Wie erstelle ich ein Formular in WordPress ohne Plugin?

Das Erstellen eines Formulars in WordPress ohne Plugin erfordert benutzerdefiniertes HTML und PHP. Sie können das Formular-HTML manuell zu Ihrer Seite hinzufügen und die Übermittlungen mit benutzerdefiniertem PHP in der functions.php-Datei Ihres Themes verarbeiten.

Da dies nicht anfängerfreundlich ist, empfehlen wir stattdessen die Verwendung eines Formular-Builders.

Zusätzliche Ressourcen für die Verwendung von Formularen in WordPress

Wir hoffen, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie Formulare in WordPress einbetten.

Als Nächstes möchten Sie vielleicht unsere anderen hilfreichen Anleitungen zu folgenden Themen lesen:

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.

Offenlegung: Unsere Inhalte werden von den Lesern unterstützt. Das bedeutet, wenn Sie auf einige unserer Links klicken, können wir eine Provision verdienen. Sehen Sie, wie WPBeginner finanziert wird, warum das wichtig ist und wie Sie uns unterstützen können. Hier ist unser Redaktionsprozess.

Das ultimative WordPress-Toolkit

Erhalten Sie KOSTENLOSEN Zugang zu unserem Toolkit – eine Sammlung von WordPress-bezogenen Produkten und Ressourcen, die jeder Profi haben sollte!

Leserinteraktionen

1 CommentLeave a Reply

  1. Hier ist ein hilfreicher Tipp aus meiner Erfahrung im Webdesign: Testen Sie Ihre eingebetteten Formulare immer auf Mobilgeräten! Ich habe das auf die harte Tour mit einem Google-Formular eines Kunden gelernt. Es sah auf dem Desktop perfekt aus, war aber auf mobilen Bildschirmen ein Chaos.
    Schnelle Lösung, die für mich funktionierte: Fügen Sie einfach dieses CSS zu Ihrem Formularcontainer hinzu:
    – max-width: 100%
    – height: auto

Leave A Reply

Vielen Dank, dass Sie sich entschieden haben, einen Kommentar zu hinterlassen. Bitte beachten Sie, dass alle Kommentare gemäß unserer Kommentarrichtlinie moderiert werden und Ihre E-Mail-Adresse NICHT veröffentlicht wird. Bitte verwenden Sie KEINE Schlüsselwörter im Namensfeld. Lassen Sie uns ein persönliches und bedeutungsvolles Gespräch führen.