Kontaktformular mit Elementor erstellen (in 2 Minuten)

Anbieter: Elementor
Kontaktformular mit Elementor erstellen

Mit dem WordPress-Plugin Elementor Pro lassen sich schnell und einfach Formulare erstellen, bspw. für Newsletter oder die Kontaktseite.

In diesem Tutorial soll es um die Erstellung eines Kontaktformulares gehen.

Vorteile des Elementor-Formulars

Verbesserungspotential des Elementor-Formulars

Erstellung eines einfachen Kontaktformulars

Die Erstellung eines einfachen Kontaktformulars ist denkbar einfach und innerhalb von zwei Minuten erledigt. Ich beschreibe nur die notwendigsten Einstellungen. Die Funktionen sind eigentlich recht selbsterklärend, so dass durch „Durchklicken“ der einzelnen Menüpunkte auch noch weitere Einstellungsmöglichkeiten zum Vorschein kommen, die man nach Belieben anpassen kann.

Solltest du spezielle Wünsche haben, nutze das Kontaktformular und ich schaue, wie ich dir helfen kann.

Widget "Formular" auswählen und in den Bearbeitungsbereich ziehen

Suche in der Elementeübersicht nach „Formular“ und ziehe es in den Bearbeitungsbereich.

Elementor - Formular-Widget

Datenschutz-Feld hinzufügen

Fast fertig. Es wird dir jetzt folgendes Formular angezeigt:

Elementor Kontaktfomular unfertig

Hier fehlt natürlich noch das Feld für den Datenschutz. Klicke in der Seitenleiste auf „Element hinzufügen“:

Wähle als Typ „Akzeptanz“ aus und hinterlege, dass es sich um ein Pflichtfeld handelt:

 

Im Feld „Text für Akzeptanz“ kannst du folgendes hinterlegen (hier aber noch den Link zu deiner Datenschutzerklärung anpassen):

Ich erkläre mich damit einverstanden, dass meine Daten zur Bearbeitung meines Anliegens verwendet werden. (Weitere Informationen und Widerrufshinweise findest du in der <a href=“https://www.hier_link_einfügen“>Datenschutzerklärung</a>)

Anschließend ist dein Kontakformular fertig und sollte in etwa so aussehen:

Elementor - Kontaktformulat - fertig

Einstellungen prüfen

Zum Schluss solltest du noch folgende Punkte prüfen:

Zusätzliche Funktion: Multi-Step

Für den Fall, dass du mit vielen Feldern arbeitest, kannst du die Eingabe durch die BesucherIn auf mehrere Schritte verteilen. Wie du im Beispiel siehst, sind erstmal nur die Felder „Name“ und „E-Mail“ ersichtlich. Mit Klick auf dem Button „Nächster“ werden die weiteren Felder „Nachricht“, „Datenschutz“ und der „Senden“-Button angezeigt:

Multi-Step hinzufügen

Klicke wieder auf den Button „Element hinzufügen“ und wähle anschließend den Typ „Step“ aus:

Klicke auf „Item #6“, halte die Maus gedrückt und ziehe das Feld über das Feld „Nachricht“:

Elementor - Step 2

Das war es auch schon. Mit einem Klick auf den Menüpunkt „Schaltflächen“ kannst du die Bezeichnung „Nächster“ und „Voriger“ noch anpassen (bspw. auf „Weiter“ und „Zurück“).

Ich wünsche dir viel Spaß und Erfolg beim Einrichten.

Abonnieren
Benachrichtige mich bei
0 Kommentare
Inline Feedbacks
View all comments

Die mit Sternchen (*) gekennzeichneten Verweise sind sogenannte Provision-Links. Wenn du auf so einen Verweislink klickst und über diesen Link einkaufst, bekomme ich von deinem Einkauf eine Provision. Für dich verändert sich der Preis nicht. 

0
Hast du Fragen? Dann schreibe einen Kommentar ;-)x
Newsletter abonnieren

Erhalte regelmäßig Informationen zu neuen Tipps und Tutorials.