So erstellen Sie ein kostenloses Elementor-Kontaktformular (Der einfache Weg)

Möchten Sie ein kostenloses Elementor-Kontaktformular erstellen?

Ein Kontaktformular ist für alle Arten von Websites unerlässlich. Indem Sie entsprechende Felder in Ihr Formular aufnehmen, können Sie die genauen Informationen sammeln, die Sie von Ihren Leads benötigen, und so eine effektive Kommunikation gewährleisten.

In diesem Tutorial zeige ich Ihnen die beste Methode, um Ihrer Elementor-Seite kostenlos ein Kontaktformular hinzuzufügen. Diese Option funktioniert hervorragend mit allen Versionen von Elementor und ist komplett „ohne Code“!

So erstellen Sie ein kostenloses Elementor-Kontaktformular

Elementor macht es einfach, eine Kontaktseite zu gestalten, aber es gibt Ihnen nicht von allein ein funktionierendes Kontaktformular kostenlos. Sie kombinieren es mit einem kostenlosen Formular-Plugin, um das Formular selbst zu verwalten, und die gesamte Einrichtung dauert etwa fünf Minuten von Anfang bis Ende.

Der Grund, warum Sie ein zweites Plugin benötigen, liegt in den Kosten. Das integrierte Formular-Widget von Elementor ist hinter Elementor Pro, der kostenpflichtigen Version, gesperrt, und das kostenlose Elementor enthält überhaupt kein Kontaktformular.

Anstatt also aufzuwerten, nur um Nachrichten zu sammeln, fügen Sie kostenlos eines mit WPForms hinzu, das mit jeder Version von Elementor funktioniert. Wenn Sie die vollständige Aufschlüsselung wünschen, hier ist wie Elementor Forms im Vergleich zu WPForms abschneidet.

Schritt 1: WPForms installieren und aktivieren

Um kostenlos ein Kontaktformular zu Elementor hinzuzufügen, kombinieren Sie es mit einem Formular-Plugin, und WPForms ist das, das ich jedes Mal verwende.

Es ist der anfängerfreundlichste Formular-Builder für WordPress, und der Drag-and-Drop-Builder ist sofort verständlich, sobald Sie ihn öffnen.

Was mir am besten gefällt, ist, dass die kostenlose WPForms Lite-Version für ein Kontaktformular mehr als ausreichend ist. Die WPForms Elementor-Integration ermöglicht es Ihnen dann, jedes von Ihnen erstellte Formular direkt auf einer Elementor-Seite einzufügen.

Das erste, was Sie tun möchten, ist die Installation des WPForms-Plugins. Um dies zu tun, öffnen Sie Ihr WordPress-Dashboard und navigieren Sie zu Plugins » Neu hinzufügen.

Suchen Sie nun nach WPForms und klicken Sie auf Installieren, wenn Sie es gefunden haben. Die Installation dauert nur wenige Sekunden.

Sobald dies erledigt ist, zeigt die Schaltfläche Installieren nun Aktivieren an. Drücken Sie Aktivieren, um die Einrichtung von WPForms auf Ihrer Website abzuschließen. So einfach ist das!

Großartig! WPForms ist jetzt einsatzbereit auf Ihrer Website. Bevor Sie Ihr erstes Formular erstellen, installieren wir Elementor.

WPForms kostenlos ausprobieren

Schritt 2: Holen Sie sich das Elementor WordPress Plugin

Sie können Elementor installieren, indem Sie genau die gleichen Schritte befolgen, wie oben beschrieben. Gehen Sie einfach zu Plugins » Neues Plugin hinzufügen, suchen Sie nach Elementor und installieren Sie es.

Nachdem die Installationen erledigt sind, können Sie nun Ihr Kontaktformular erstellen, wie wir es im nächsten Schritt zeigen.

Schritt 3: Erstellen Sie Ihr Elementor-Kontaktformular

Sie können sofort mit der Erstellung Ihres Kontaktformulars beginnen, indem Sie zu WPForms » Neues Formular navigieren.

Dadurch wird der WPForm-Builder in wenigen Sekunden geladen. Beginnen Sie damit, Ihrem Formular einen Namen zu geben, damit Sie es später leicht identifizieren können, falls Sie Änderungen vornehmen müssen.

Scrollen Sie ein wenig nach unten, und Sie sehen die Formularvorlagen. Wenn Sie WPForms Lite verwenden, haben Sie Dutzende von kostenlosen Vorlagen zur Auswahl.

Später können Sie auf Pro upgraden, um auf über 2.100 WordPress-Formularvorlagen für Kundenservice, Marketing und verschiedene andere Kategorien zuzugreifen.

Da wir ein Kontaktformular benötigen, ist die kostenlose Vorlage für einfache Kontaktformulare für unsere Zwecke in diesem Beitrag ideal.

Sie können diese Vorlage in der Suchleiste suchen und auf die Schaltfläche Vorlage verwenden klicken, wenn sie auf Ihrem Bildschirm erscheint.

Nachdem Sie eine Vorlage ausgewählt haben, öffnet sich der WPForms-Builder. Die Benutzeroberfläche von WPForms ist so konzipiert, dass sie für jeden super einfach zu bedienen ist.

Auf der linken Seite sehen Sie alle Felder, die Ihrem Kontaktformular hinzugefügt werden können. Auf der rechten Seite sehen Sie eine Live-Vorschau Ihres Formulars.

Wenn Sie die Vorlage anpassen möchten, ziehen Sie einfach ein beliebiges Formularfeld vom linken Bereich in das Formular auf der rechten Seite.

Sie können Dropdown-Listen und Multiple-Choice-Fragen hinzufügen und Felder nach oben und unten ziehen, um sie in Ihrem Formular zu verschieben.

Wenn Sie die Feldeinstellungen öffnen möchten, klicken Sie im Builder einmal auf das Feld. Die Einstellungen werden neben der Formularvorschau im linken Bereich angezeigt.

Klicken Sie auf jedes Feld, um es nach Ihren Wünschen einzurichten. Wenn Sie fertig sind, klicken Sie oben auf Speichern.

Erstellen Sie stattdessen ein Anmeldeformular? Wir haben ein separates Tutorial zum Erstellen eines benutzerdefinierten Elementor-Anmeldeformulars.

Es gibt allerlei Annehmlichkeiten, die Sie mit WPForms genießen können. Zum Beispiel können Sie es sogar als Gateway verwenden, um Elementor Forms mit Google Sheets zu verbinden!

Schritt 4: Richten Sie die Bestätigungs-E-Mail und Nachricht des Formulars ein

Überprüfen wir nun die Nachrichten, die beim Absenden des Formulars gesendet werden. Klicken Sie im Formular-Builder auf Einstellungen und dann im linken Menü auf den Punkt Benachrichtigungen.

Auf der rechten Seite sehen Sie die Benachrichtigungs-E-Mail, die an Sie gesendet wird, wenn Ihr Formular abgeschickt wird. Sie können die E-Mail hier nach Belieben anpassen.

Haben Sie bemerkt, dass die E-Mail an {admin_email} gesendet wird? Das ist ein Platzhalter für die Administrator-E-Mail-Adresse in WordPress.

Sie können {admin_email} löschen und hier Ihre Geschäfts-E-Mail-Adresse eingeben oder die Administrator-E-Mail-Adresse in WordPress ändern, falls sie falsch ist.

Klicken Sie als Nächstes auf Bestätigungen. Auf diesem Bildschirm können wir die Nachricht anpassen, die im Frontend angezeigt wird, wenn das Formular abgeschickt wird.

Dies ist optional, Sie können also die Standardnachricht belassen, wenn Sie damit zufrieden sind.

Und das ist alles! Es ist Zeit, auf die Schaltfläche Speichern oben zu klicken. Sie können den Formular-Builder schließen, indem Sie auf das X oben rechts im Fenster des Formular-Builders klicken.

Großartige Arbeit! Ihr Elementor-Formular ist fertig und wir müssen es nur noch veröffentlichen, damit es live geht und mit dem Sammeln von Informationen begonnen werden kann.

Schritt 5: Erstellen Sie Ihre Elementor Kontaktieren Sie uns-Seite

In diesem Schritt erstellen wir eine benutzerdefinierte Kontaktseite mit Elementor. Klicken Sie im WordPress-Dashboard auf Seiten und dann auf die Schaltfläche Neu hinzufügen.

Geben Sie oben Ihren Seitentitel ein. Klicken Sie danach auf die blaue Schaltfläche Mit Elementor bearbeiten.

Dies startet die Elementor-Seiten-Builder-Oberfläche, wo Sie ein Kontaktformular hinzufügen und andere Elemente der Seite anpassen können.

Warten Sie einige Sekunden, bis Elementor in Ihrem Browser geladen ist. Auf der linken Seite sehen Sie verschiedene Elemente, die Sie Ihrer Seite hinzufügen können.

Suchen Sie im Abschnitt „Basic“ nach dem WPForms-Block, den Sie verwenden können, um das zuvor erstellte Formular hinzuzufügen.

Ziehen Sie den WPForms-Block per Drag & Drop auf Ihre Seite und klicken Sie dann auf das Dropdown-Menü, um das gerade erstellte Formular auszuwählen.

Sobald Sie das Formular auswählen, erscheint es auf der Seite. Großartige Arbeit! Und wir sind mit dem Formular-Builder fertig. Alles, was wir jetzt noch tun müssen, ist, die Kontaktseite zu veröffentlichen.

Schritt 6: Gestalten und veröffentlichen Sie Ihre Elementor Kontaktieren Sie uns-Seite

Das Veröffentlichen der Kontaktseite ist mit Elementor ein Kinderspiel. Aber wussten Sie, dass Sie Ihr Formular auch mit den WPForms-Blockoptionen von Elementor gestalten können?

Klicken Sie dazu auf den Bereich um das eingebettete Formular auf Ihrer Seite, um die Blockoptionen im linken Bereich zu öffnen. Klicken Sie dann auf die Registerkarte Stil.

Unter dieser Registerkarte sehen Sie die vielen angebotenen Designs, die Hintergrundbilder, Farben und andere Styling-Optionen fertig für Sie vorbereitet haben.

Oder Sie verwenden die Optionen darunter, um die Stile Ihres Feldes, Ihrer Beschriftung oder Ihrer Schaltfläche manuell zu ändern.

Zum Beispiel haben wir die Einstellungen Schaltflächenstile verwendet, um die Größe, den Radius und die Farbe der Schaltfläche mit nur wenigen Klicks zu erhöhen.

Sie können auf weitere erweiterte Optionen zugreifen, indem Sie auf die Registerkarte Erweitert klicken. Dies beinhaltet Einstellungen für Formularlayouts, Animationseffekte, Seitenhintergründe und mehr.

Wenn Sie mit der Anpassung der Formularstile fertig sind, ist es Zeit, Ihr Formular zu veröffentlichen. Klicken Sie einfach auf die Schaltfläche Veröffentlichen in der unteren Symbolleiste.

Klicken Sie abschließend auf Einen Blick darauf werfen, um Ihr Kontaktformular auf Ihrer Website anzuzeigen. Und das war's! Ihre Elementor-Kontaktseite ist live und bereit, Antworten zu erhalten.

Erstellen Sie Ihr kostenloses Elementor-Kontaktformular

Machen Sie Ihr Elementor-Kontaktformular spamsicher

Ein öffentliches Kontaktformular zieht früher oder später Spam an, daher spart es Ihnen später eine Bereinigung, wenn Sie es sperren, bevor die Bots es finden. Die gute Nachricht ist, dass jedes WPForms-Formular mit integriertem Spam-Schutz ausgestattet ist, der standardmäßig aktiviert ist.

Dies beinhaltet ein verstecktes Anti-Spam-Honigtopf, das einfache Bots erfasst, ohne dass Ihre Besucher ein lästiges Rätsel lösen müssen. Wenn Ihr Formular mehr Spam zieht, als der Standard-Schutz bewältigen kann, können Sie eine weitere Ebene hinzufügen.

WPForms unterstützt auch ein modernes Anti-Spam-Token, reCAPTCHA, hCaptcha und Cloudflare Turnstile in seinen kostenpflichtigen Plänen, sodass Sie die Methode wählen können, die zu Ihrem Publikum passt.

Dieser Schutz von Anfang an ist ein wichtiger Grund, sich hier für WPForms zu entscheiden. Ein Kontaktformular ist eines der einfachsten Ziele für Bots auf Ihrer Website, und der Honigtopf erledigt die meisten davon leise im Hintergrund.

Speziell für Elementor-Benutzer, hier erfahren Sie, wie Sie mit Akismet Spam in Ihren Elementor-Formularen blockieren.

FAQs zum Erstellen eines Elementor-Kontaktformulars

Elementor-Kontaktformulare kommen in unseren Kommentaren und Supportanfragen häufig vor. Hier sind Antworten auf die Fragen, die Leser am häufigsten stellen.

Hat Elementor ein Kontaktformular?

Ja, aber nur in der kostenpflichtigen Version. Das Formular-Block von Elementor ist Teil von Elementor Pro, sodass das kostenlose Plugin allein Ihnen nicht erlaubt, ein Kontaktformular zu erstellen.

Die gute Nachricht ist, dass Sie stattdessen kostenlos eines mit dem WPForms-Block hinzufügen können. Sie müssen sowohl WPForms als auch Elementor installiert haben, um auf den WPForms-Block zuzugreifen, während Sie Ihre Seite in Elementor bearbeiten.

Wie füge ich kostenlos ein Kontaktformular in Elementor hinzu?

Um ein Kontaktformular mit der kostenlosen Version von Elementor hinzuzufügen, integrieren Sie ein Plugin wie WPForms. Installieren und aktivieren Sie zuerst das WPForms-Plugin über Ihr WordPress-Dashboard. Erstellen Sie nach der Aktivierung ein Formular mit dem WPForms-Builder, ziehen Sie dann den WPForms-Block auf Ihre Elementor-Seite und wählen Sie Ihr Formular aus.

Wie erstelle ich ein Formular in Elementor?

Das Erstellen eines Formulars in Elementor kann mit dem WPForms-Plugin einfach erfolgen. Installieren Sie WPForms in Ihrem WordPress-Plugin-Bereich und aktivieren Sie es. Verwenden Sie dann die Drag-and-Drop-Oberfläche von WPForms, um Ihr Formular zu erstellen, bevor Sie es zu einer beliebigen Elementor-Seite hinzufügen.

Wie erstelle ich ein benutzerdefiniertes Kontaktformular in Elementor?

WPForms ist eine großartige Option zur Erstellung eines benutzerdefinierten Kontaktformulars in Elementor aufgrund seiner Flexibilität und Benutzerfreundlichkeit. Nach der Installation und Aktivierung von WPForms öffnen Sie das Plugin und wählen Sie Neue hinzufügen, um Ihr benutzerdefiniertes Formular zu erstellen.

Passen Sie Ihr Formular an, indem Sie Felder nach Ihren Bedürfnissen hinzufügen oder entfernen. Sobald Sie fertig sind, speichern Sie das Formular. Fügen Sie in Elementor den WPForms-Block auf der Seite hinzu, auf der Sie das Formular haben möchten, wählen Sie Ihr Formular aus und veröffentlichen Sie die Seite.

Elementor-Kontaktformular-E-Mail-Benachrichtigungen beheben

Haben Sie Probleme beim Empfang von Elementor-Kontaktformular-Einreichungen per E-Mail? Es ist einfach, dieses Problem zu beheben, damit Sie immer Ihre E-Mail-Benachrichtigungen erhalten. Schauen Sie sich diesen Leitfaden an, um zu beheben, dass Elementor-Kontaktformulare keine E-Mails senden.

Und wenn Sie mehr über zusätzliche Formular-Builder für Elementor erfahren möchten, lesen Sie diesen Artikel über Kontaktformular-Plugins, die gut mit Elementor funktionieren, um die Benutzerinteraktion mit Formularen und letztendlich Ihre Lead-Generierung zu verbessern.

Holen Sie sich WPForms kostenlos

Bereit, Ihr Formular zu erstellen? Beginnen Sie noch heute mit dem einfachsten WordPress-Formularersteller-Plugin.  WPForms Pro enthält viele kostenlose Vorlagen und bietet eine 14-tägige Geld-zurück-Garantie.

Wenn Ihnen dieser Artikel geholfen hat, folgen Sie uns bitte auf Facebook und Twitter für weitere kostenlose WordPress-Tutorials und Anleitungen.