Erstellen und gestalten Sie Formulare mit dem Elementor-Formular-Widget

Erstellen und gestalten Sie Formulare mit dem Elementor-Formular-Widget

Jede Website muss ein Kontaktformular enthalten! Kontaktformulare sind für eine Vielzahl von Zwecken hilfreich, unabhängig davon, welche Art von Website Sie haben. Sie können Leads generieren, Verbindungen und Beziehungen aufbauen, Benutzern ermöglichen, Probleme mit Ihrer Website zu melden und alles dazwischen.

Es ist nicht erforderlich, ein technischer Experte zu sein, um Kontaktformulare in WordPress zu erstellen. Der Elementor Page Builder macht es einfacher denn je, schöne Websites zu erstellen.

Um zu demonstrieren, wie man Kontaktformulare mit Elementor erstellt, gehen wir die verschiedenen Optionen und alles Wissenswerte über Kontaktformulare in Elementor durch.

Elementor hat seit geraumer Zeit ein Formular-Widget integriert, was bedeutet, dass Sie nirgendwo mehr hingehen müssen, um Formulare für Ihre WordPress-Website zu erstellen, was ein Segen ist!

In der Vergangenheit sind Sie möglicherweise beim Erstellen von Formularen mit einigen der verfügbaren plugin auf Schwierigkeiten gestoßen. Der Prozess des Entwerfens und Konfigurierens von Formularen kann zeitaufwändig und frustrierend sein. Zum Glück für uns alle ist das Elementor-Formular-Widget einfach zu bedienen.

Bevor wir mit dem Elementor-Formular-Builder beginnen, werfen wir einen kurzen Blick auf einige seiner wichtigsten Funktionen.

Eine der herausragendsten Funktionen für den Anfang ist, dass sie vollständig in die Elementor-Benutzeroberfläche integriert ist, was bedeutet, dass Sie Zugriff auf viele Design- / Stil- / Layoutoptionen haben, die in Elementor verfügbar sind. Ich glaube nicht, dass Sie ein eigenständiges Formular- plugin mit einem Designsystem finden werden, das so robust ist wie dieses.

Von dort aus können Sie bis zu 18 verschiedene Arten von Feldern erstellen:

  • Text E-Mail Textbereich Textbereich
  • Die URL und Telefonnummer lauten wie folgt:
  • Optionsfelder sind eine Art Optionsfeld.
  • Wählen Sie aus einer Liste (Dropdown)
  • Checkboxen werden in Checklisten verwendet.
  • Es gibt nur ein Kontrollkästchen (Akzeptanz)
  • reCaptcha
  • Honeypots sind eine Art Behälter, der Honig enthält (verhindert Spam).

Sie können Ihre Formulare auch auf mehrere Seiten aufteilen, um Formulare mit mehreren Schritten zu erstellen, die für lange Formulare von Vorteil sind.

Elementor Pro verfügt über 12 Integrationen mit beliebten E-Mail-Marketing-Diensten und Systemen für das Kundenbeziehungsmanagement, damit Sie Ihre Formulare optimal nutzen können. Es gibt auch eine allgemeine Zapier-Integration, die es Ihnen ermöglicht, sich mit einem der Tausenden von Tools zu verbinden, die auf der Zapier-Plattform verfügbar sind, wenn Ihr Tool nicht aufgeführt ist.

Es gibt noch einige andere interessante Alternativen. Für die Ex - amp le, wenn jemand Ihr Formular ausfüllt, können Sie Benachrichtigungen über Slack oder Discord erhalten.

Apropos Benachrichtigungen: Sie können auch die E-Mail-Benachrichtigungen, die Sie erhalten, und die E-Mail-Benachrichtigungen, die Formularübermittler erhalten, personalisieren. Nachdem sie das Formular gesendet haben, können Sie sie zu einer benutzerdefinierten Dankesseite umleiten, die Sie erstellen.

Was ist der beste Weg, um ein Formular in Elementor zu erstellen?

Wir beginnen mit dem Öffnen des Elementor-Editors und ziehen dann das Formular-Widget per Drag & Drop an die Stelle, an der wir unser Formular erstellen möchten.

So erstellen Sie ein Elementor-Formular

Wie alles andere in Elementor wird der Prozess der Formularerstellung visuell durchgeführt. Es ist weder erforderlich, ein zusätzliches plugin , noch als Backend Ihrer Website zu fungieren.

Elementor-Elemente strukturiert formen

Sobald Ihr Formular eingerichtet ist, besteht der erste Schritt darin, die darin enthaltenen Informationen zu organisieren. Welche Felder benötigen Sie und welche Arten von Feldern sollten es sein? Wonach suchst du?

Bei der Arbeit im Elementor-Editor werden Formularfelder auf der Registerkarte Inhalt hinzugefügt und bearbeitet. Wie Sie in der ex sehen amp unter le, sind Formulare einige Standardfelder. Durch Auswahl von Element hinzufügen aus dem Dropdown-Menü können Sie neue Felder erstellen.

Das Duplizieren eines Feldes ist auch möglich, indem Sie das Symbol auswählen, das wie zwei Dokumente voreinander aussieht, und darauf klicken. 

Feldtypen in einem Formular

Es stehen viele Formularfeldtypen zur Verfügung, von einfachen Textfeldern bis hin zu Passwörtern, ReCaptcha und Honeypot-Feldern.

Um das Verhalten eines Formularfelds zu ändern, wählen Sie zuerst das Feld und dann wie das Dropdown-Menü Typ aus, um die verfügbaren verschiedenen Feldtypen anzuzeigen.

Feldtypen in einem Elementor-Formular

Breite einer Formularspalte

Mit dieser Funktion können Sie zwei Formularfelder in derselben Zeile verwenden, indem Sie die Einstellung für die Spaltenbreite anpassen. Ändern Sie die Breite des Fensters, indem Sie es aus der Dropdown-Auswahl auswählen und 50 Prozent auswählen. Beachten Sie, dass Sie bei zwei aufeinanderfolgenden Formularfeldern feststellen werden, dass sie zusammen in derselben Zeile erscheinen.

Formulare in Elementor zum Stylen

Gestalten Sie Ihre Formulare in Elementor auf die gleiche Weise wie andere Widgets, indem Sie zum Stilbedienfeld navigieren, das sich in der Elementor-Bearbeitungsoberfläche befindet.

Das Formular selbst, die Felder, Schaltflächen, Schritte, Fehlermeldungen und Bestätigungsnachrichten können alle angepasst werden.

Für diejenigen, die bereits mit Elementor vertraut sind, müssen sie beim Gestalten von Elementor Forms nicht viel mehr lernen.

Aktionen in einem Formular

Nach unserer Diskussion zum Erstellen eines Formulars in Elementor schauen wir uns an, was nach dem Absenden Ihres Formulars passiert. Dies wird durch Formularaktionen erreicht, oder wie sie in Elementor bezeichnet werden, Aktionen nach dem Absenden.

Beim Absenden eines Formulars ist es üblich, dass das System eine E-Mail sendet und den Benutzer auf eine andere Webseite umleitet. Sie können natürlich beliebig viele Aktionen in Ihre Formulare aufnehmen und beliebig kombinieren. Wie Sie vielleicht erwarten, gibt es ein bestimmtes Auswahlfeld ohne Codierung.

Jede der von Ihnen hinzugefügten Aktionen wird als separate Registerkartenoption im Hauptmenü angezeigt. Wir haben derzeit eine Registerkarte Option für E - Mail, aber wenn ich eine Umleitung in Aktion hinzufügen Feld schließen wäre, würde ich auch Redirect in meiner Tab - Optionen sehen, wie in der Ex gezeigt amp le unten.

Abschließend zeige ich Ihnen, wie Sie das Formular so konfigurieren, dass Übermittlungen per E-Mail akzeptiert werden, die am häufigsten gestellte Frage zu Formularen.

Wenn Sie im Editor auf der Registerkarte Inhalt die Option E-Mail auswählen, wird der unten gezeigte Bildschirm angezeigt; Hier können Sie die Ab-E-Mail und die Antwort-E-Mail personalisieren und jedem, der eine Kopie der Einsendungen aus dem Formular erhalten soll, ein CC oder BCC hinzufügen.

Erstellen einer Kontaktformular-Messaging-Vorlage in Elementor 

Viele Leute sind überrascht zu erfahren, dass der Formulareditor von Elementor leistungsstärker ist, als es auf den ersten Blick erscheint, und eine der fortgeschritteneren Funktionen ist die Möglichkeit, die Nachrichten für jedes Formular anzupassen.

Es ist möglich, die Formularnachrichten anzupassen, um dem Endbenutzer, der Ihr Formular ausgefüllt hat, einen personalisierteren Feedbackprozess zu bieten, anstatt wie ein langweiliger Roboter zu klingen. Im Einzelnen können Sie jedoch die folgenden Nachrichten für Ihr Elementor-Kontaktformular anpassen:

Um zu beginnen, müssen Sie zuerst benutzerdefinierte Nachrichten aktivieren, indem Sie im Dropdown-Menü "Zusätzliche Optionen" auswählen und dann den Kippschalter für "Benutzerdefinierte Nachrichten" auf "Ja" stellen.

Anpassung des Elementor-Kontaktformular-Widgets durch Hinzufügen von benutzerdefinierten Nachrichten

Wie Sie sehen, gibt es vier verschiedene Nachrichten, die Sie anpassen können, einschließlich der unten aufgeführten:

Eine Erfolgsmeldung wird einem Endbenutzer angezeigt, nachdem er das Formular abgeschickt und überprüft hat, ob das Formular korrekt ausgefüllt wurde (zB keine fehlenden Pflichtfelder usw.).

Fehlermeldung – eine Nachricht, die dem Endbenutzer angezeigt wird, wenn beim Senden des Formulars ein unbekannter Fehler auftritt.

Erforderliche Nachricht – wird angezeigt, wenn ein erforderliches Formularfeld nicht ausgefüllt, das Formular gesendet und das Formular nicht ausgefüllt wurde.

Wenn etwas in der Formularübermittlung falsch ist und nicht gesendet werden kann, wird dem Endbenutzer die Meldung Ungültige Nachricht angezeigt.

Die Möglichkeit, die Nachrichten zu bearbeiten, ermöglicht es Ihnen, kreativ und skurril oder formeller und geschäftlicher zu sein, wenn Sie eine Unternehmenswebsite betreiben. Das Beste daran ist, dass sie vollständig bearbeitet werden können, sodass Sie tun können, was Sie wollen!

Fazit

Elementor-Formular-Widget ist es mühelos, ein Kontaktformular zu erstellen. Es kommt mit einem intuitiven Drag-and-Drop-Kontaktformular-Builder und einer Vielzahl von Anpassungsoptionen, die es von den anderen auf dem Markt erhältlichen Kontaktformular- plugin unterscheiden. Sie können das Design und die Farbgebung ganz einfach an das Erscheinungsbild Ihres Unternehmens anpassen. Ebenfalls enthalten sind verschiedene andere attraktive Widgets, mehr als 300 professionelle Vorlagen und ein Popup-Builder in einem praktischen Paket. Dieser WordPress Page Builder mit vollem Funktionsumfang besteht aus allen notwendigen Widgets und Funktionen, sodass Sie keine zusätzlichen Page Builder kaufen müssen, um Ihre Website weiter anzupassen. Darüber hinaus ermöglicht es die Integration von mehr als 30 Marketingdiensten, weshalb es heute eines der am häufigsten gekauften plugin auf dem Markt ist.

Hinterlasse einen Kommentar

Deine Email-Adresse wird nicht veröffentlicht. Pflichtfelder sind markiert *