Elementor-Formulare: So erstellen Sie ein Elementor-Kontaktformular

Veröffentlicht: 2022-06-07

Elementor ist einer der beliebtesten Seitenersteller mit hohen Funktionalitäten und umfangreichen Funktionen. Aber es könnte Sie überraschen, dass sie keinen multifunktionalen Formularersteller in ihrem Dashboard haben. Was Elementor Form bietet, ist sehr einfach und unkompliziert. Wenn Sie erweiterte Optionen wie das Akzeptieren von Zahlungen oder das Durchführen von Umfragen verwenden möchten, benötigen Sie dennoch ein spezielles Formularerstellungs-Plugin. Darüber hinaus müssen Sie zum Verwalten von Formularübermittlungen ein zusätzliches Plugin installieren, um Ihre Einträge mit Elementor zu verwalten. In diesem Artikel erfahren wir, wie Sie das beste Elementor-Kontaktformular erstellen und Daten mit demselben Plugin verwalten.

Fluent Forms ist der anfängerfreundlichste Formularersteller. Jetzt herunterladen und KOSTENLOS schöne Formen erstellen!!!

So erstellen Sie ein Elementor-Formular

Wir zeigen Ihnen zwei Methoden zum Erstellen eines Elementor-Kontaktformulars, um Ihnen bei der Auswahl nach Ihren Bedürfnissen zu helfen.

  1. Erstellen Sie ein Kontaktformular mit Elementor Pro
  2. Der beste Weg, um ein Elementor-Kontaktformular zu erstellen (kostenlos)

Erstellen Sie ein Kontaktformular mit Elementor Pro

Wenn Sie mit Elementor ein Formular erstellen möchten, müssen Sie Elementor Pro erwerben. Mit der Pro-Lizenz können Sie auf das Formular-Widget zugreifen und Ihr Formular im Elementor-Seitenersteller entwerfen. Sie haben auch Zugriff auf eine enorme Anzahl von Formularvorlagen. Darüber hinaus haben Sie eine Reihe cooler Funktionen, die Ihre Website verändern können.

Schritte zum Erstellen eines Kontaktformulars mit Elementor –

1. Hinzufügen des Elementor-Formulars zu Ihrer Seite

Um der Seite ein Formular hinzuzufügen, müssen Sie eine Seite öffnen oder eine neue hinzufügen und dann auf Bearbeiten mit Elementor klicken. Suchen Sie nun in der Widgetleiste auf der linken Seite nach Formularen. Wenn Sie keine Pro-Lizenz haben, können Sie diese Funktion nicht nutzen.

Ziehen Sie nun das Widget per Drag & Drop auf die Seite, auf der Sie Ihr Elementor-Formular erstellen möchten. Auf Ihrer Seite wird ein einfaches Kontaktformular angezeigt.

2. Hinzufügen verschiedener Felder zu Ihrem Elementor-Formular

Sie können sehen, dass die Elementor-Form eine Reihe von Funktionen auf dem Ärmel hat. Sie müssen nur Ihre gewünschten Formulare in wenigen Minuten erkunden und erstellen. Nun, was ist, wenn Sie andere Felder und Optionen als die vorab ausgefüllten benötigen. Sie können Ihren Elementor-Formularen mehr als 18 Felder hinzufügen, und diese sind –

  1. Text
  2. Email
  3. Textbereich
  4. URL
  5. Tel
  6. Radio
  7. Auswählen
  8. Kontrollkästchen
  9. Annahme
  10. Nummer
  11. Datum
  12. Zeit
  13. Datei-Upload
  14. Passwort
  15. HTML
  16. Versteckt
  17. reCaptcha
  18. Honigtopf

Das ist eine gute Anzahl von Feldtypen, mit denen man spielen kann. Mit diesem Formularersteller können Sie verschiedene Formulare erstellen. Jetzt müssen Sie die Einstellungen anpassen und Ihr Formular so gestalten, dass es ins Auge fällt.

3. Einrichten der Formularübermittlung

Nach der Formularübermittlung können Sie das E-Mail-Verzeichnis und die Daten einrichten, die Sie aus der Formularübermittlung erhalten möchten. Das ist keine Raketenwissenschaft. Sie können alle Optionen einrichten wie –

  • Zu
  • Thema
  • Nachricht
  • Aus der Email
  • Von Namen
  • Antwort an
  • CC
  • BCC

Alle Optionen zum Senden einer E-Mail.

4. Entwerfen Sie Ihr Elementor-Formular

Es gibt eine Handvoll Optionen, um Ihr Formular zu gestalten. Vom Ändern der Breite der Spalten bis zum Ändern der Hintergrundfarbe Ihres Formulars, vom Einrichten des Platzhalters bis zum Ändern der Typografie können Sie mit Ihrem Formular machen, was Sie wollen.

Gehen Sie zur Option Stil, um Ihrem Formular ein einzigartiges Aussehen zu verleihen.

Warum die Elementor-Form für Sie nicht ausreicht

Zunächst einmal können Sie in Elementor-Formularen nicht alle Optionen eines normalen Form Builder-Plugins nutzen. Es bietet jedoch nur die Grundlagen. Wenn Sie versuchen, verschiedene Formulare zu erstellen und die Daten zu analysieren, benötigen Sie einen weiteren Formularersteller in Ihrem WordPress-Tech-Stack.

Zweitens keine integrierten Funktionen zum Verwalten von Einreichungen. Dazu müssen Sie ein weiteres Plugin installieren. Das ist kein optimaler Schritt für Ihre Website. Sie müssen ein Formularerstellungs-Plugin auswählen, das verschiedene Felder, Funktionen und Integrationen sowie einen Datenverwaltungsdienst zur Analyse Ihrer Leads bietet.

Drittens verfügt Elementor über ein Shortcode-Widget, das hilft, alle WordPress-Plugins zu integrieren, die eine Shortcode-Option haben. Obwohl Sie das Shortcode-Widget von Elementor verwenden können, um Ihre Formulare hinzuzufügen, können Sie das Ihres Formulars nicht mit Elementor anpassen. Aus diesem Grund müssen Sie einen Formularersteller auswählen, der im Elementor-Layout bearbeitet werden kann, da er dafür wichtige Add-Ons bietet.

Der beste Weg, um ein Elementor-Kontaktformular zu erstellen (kostenlos)

Formulare sind eine der Schlüsselkomponenten jeder Website. Von der Erfassung von Leads bis zur Durchführung von Umfragen, von der Annahme von Zahlungen bis zur Durchführung von Quizfragen sollte ein moderner Formularersteller diese Optionen in seinem Paket haben.

Außerdem sollten Sie in der Lage sein, das Formular im Elementor-Layout anzupassen, um ihm ein lebendiges und attraktives Aussehen zu verleihen. Viele Formularersteller verfügen über die Shortcode-Funktion, aber Sie können sie ohne das Elementor-Paket nicht bearbeiten.

Fluent Forms bietet Ihnen die volle Flexibilität, Ihre Formulare innerhalb des Elementor-Seitenerstellers zu bearbeiten und anzupassen. Das Formular-Widget für Elementor enthält mehrere Optionen zum Ändern von Farbe und Typografie für jedes Feld in Ihrem Formular. Sie können den gesamten Textinhalt des Formulars nach Ihren Wünschen gestalten.

  • Sie können die Schriftfarbe, -größe, -art und viele weitere Optionen für Ihr Website-Formular auswählen, die perfekt zu Ihrem Website-Erscheinungsbild passen.
  • Sie können auf Typografieoptionen für jeden Textinhalt des Formulars zugreifen.
  • Farboptionen für alle Formularfelder sind ebenfalls verfügbar.
  • Darüber hinaus besondere Farb- und Typografieoptionen für Formularbeschriftungen, Fehlermeldungen und Erfolgsmeldungen

Sie können auch auf all diese Kernfunktionen von Fluent Forms zugreifen –

  • Über 50 Eingabefelder und über 70 vorgefertigte Vorlagen zum Spielen
  • Adressen-Autovervollständigung und Drag-and-Drop-Autovervollständigung
  • Mehrschichtiger Spamschutz
  • Datenvisualisierung und -analyse nach Bedarf
  • Datei-Upload und Datenverwaltung
  • Konversationsformen
  • Quiz-Modul
  • Bedingte Logik
  • Landingpage-Funktion

Da Sie nun die Vorteile der Verwendung von Fluent Forms kennen, erstellen wir im Handumdrehen Elementor-Kontaktformulare.

So fügen Sie ein Elementor-Kontaktformular hinzu

Der einfachste Weg, ein Elementor-Kontaktformular einzurichten, ist mit Fluent Forms. Sie müssen weder verschiedene Add-Ons wie andere Formularersteller separat installieren, noch müssen Sie das Formular außerhalb von Elementor anpassen.

Hier sind die Schritte zum Erstellen von Elementor-Kontaktformularen mit Fluent Forms

Installieren und aktivieren Sie Fluent Forms Pro

Die Installation von Fluent Form ähnelt der Installation anderer WordPress-Plugins. Sie können es von Ihrem WordPress-Dashboard aus installieren und aktivieren oder es von WordPress.org herunterladen, wenn Sie möchten.

Um vom WordPress-Dashboard zu installieren, gehen Sie zum WordPress Admin Panel und klicken Sie auf Plugins → Add New. Suchen Sie nun nach Fluent Forms, klicken Sie auf Installieren und aktivieren Sie dann das Plugin.

Um von WordPress.org herunterzuladen, klicken Sie auf diesen Fluent Forms-Link und laden Sie es herunter. Gehen Sie nun zu Ihrem WordPress-Admin-Panel und klicken Sie auf die Option Neu aus Plugins hinzufügen. Laden Sie nun die .zip-Datei hoch und suchen Sie in der Liste Ihrer installierten Plugins nach Fluent Forms, klicken Sie auf Aktivieren.

Obwohl Fluent Forms in der kostenlosen Version eine enorme Anzahl von Feldern und Funktionen hat, müssen Sie auf die Pro-Version upgraden, um auf alle Funktionen von Fluent Forms zugreifen zu können. Sehen Sie sich hier die Funktionen von Fluent Forms Pro vs. Free an.

Das Upgrade auf die Pro-Version ist ziemlich einfach. Klicken Sie auf den Link, um zu erfahren, wie Sie auf Fluent Forms Pro upgraden.

Erstellen Sie ein Elementor-Kontaktformular

Mit Fluent Forms erstellen Sie innerhalb von Minuten schöne und kreative Formulare. Um ein Elementot-Kontaktformular zu erstellen, gehen Sie zu Ihrem WordPress-Dashboard und bewegen Sie den Mauszeiger auf der linken Seite über Fluent Forms. Klicken Sie auf die Option Neues Formular.

Eine neue Seite wird angezeigt, klicken Sie auf das neue leere Formular und Sie werden zur Formulareditor-Oberfläche weitergeleitet.

Fügen Sie Felder nach Ihrer Wahl hinzu, um ein Kontaktformular für Ihre Website zu erstellen. Wir haben die Option Name, E-Mail, Betreff und Ihre Nachricht für unser einfaches Elementor-Kontaktformular hinzugefügt.

Anpassungen wie das Belassen und Positionieren des Etiketts sind in Fluent Forms sehr einfach. Sie können auch bedingte Logik für Ihre Felder einrichten, um ein erweitertes Formular zu erstellen. Aber da wir es einfach halten, brauchen wir keine weiteren Felder, um das Formular zu füllen. Lange Formulare können für die Benutzer überwältigend sein. Sie können das mehrstufige Formular oder das Konversationsformular verwenden, um das Verlassen des Formulars zu vermeiden.

Speichern Sie nun das Formular und kopieren Sie den Shortcode. Sie können die Shortcode-Funktion von Fluent Forms verwenden, die mit allen verfügbaren Seitenerstellern funktioniert, einschließlich Elementor, Oxygen, Divi, Visual Composer und so weiter. Und diese Funktion bietet Ihnen direkte Elementor-Widget-Unterstützung in Ihrem Formular, um ein Plugin weniger zu verwenden.

Passen Sie die Formulare nach Belieben an und Sie können auf zahlreiche Optionen von Elemetor zugreifen. Von der Ausrichtung des Eingabetextes bis zur Größenänderung und Umformung der Eingabefelder, vom Hinzufügen klassischer und abgestufter Hintergrundfarben bis hin zum Ändern der Typografie. Sie können mit Ihren Elementor-Formularen machen, was Sie wollen.

Abschließende Gedanken

Es spielt keine Rolle, ob Sie Formulare zum Vergnügen oder geschäftlich verwenden, ein schönes und gut poliertes Formular zieht immer Menschen an. Der Elementor-Seitenersteller enthält alles außer einem multifunktionalen nativen Formularersteller. Mit Fluent Forms kannst du alles haben und deinen gewünschten Elementor-Kontakt gestalten.

Darüber hinaus können Sie Ihr Formular auf einer anderen Seite oder in einem Blog veröffentlichen, wo immer Sie möchten. Probieren Sie verschiedene Layouts und Designs aus, probieren Sie verschiedene Feldoptionen aus und gestalten Sie Ihre Elementor-Formulare nach Ihrer Wahl. Wir hoffen, dass dieser Artikel Ihnen die Anleitung zum Erstellen eines Elementor-Kontaktformulars für Ihre WordPress-Site gegeben hat.

Holen Sie sich Fluent Forms Pro

Wenn Sie Fragen haben, kommentieren Sie unten. Lassen Sie uns wissen, wie wir unser Plugin verbessern können, und folgen Sie uns auf unseren Social-Media-Plattformen.