Springe zum Hauptinhalt

So erstellen Sie ein Kontaktformular in Elementor

Divi: das am einfachsten zu verwendende WordPress-Theme

Divi: Das beste WordPress-Theme aller Zeiten!

Mehr 901.000 Downloads, Divi ist das beliebteste WordPress-Theme der Welt. Es ist vollständig, einfach zu bedienen und enthält mehr als 62-freie Vorlagen. [Empfohlen]

Möchten Sie wissen, wie Sie ein Kontaktformular in Elementor erstellen?

Die Kontaktseite ist eine der entscheidenden Seiten einer Website. Es wird oft als Parameter verwendet, ob eine Website genehmigt wird oder nicht. Elementor kommt mit einem nativen Widget – dem Formular-Widget – mit dem Sie einer Seite ein Formular hinzufügen können. Dieser Artikel zeigt Ihnen, wie.

Das Formular-Widget selbst ist nur auf Elementor Pro verfügbar. Das bedeutet, dass Sie auf die Pro-Version aktualisieren müssen, wenn Sie noch die kostenlose Version verwenden. Sie können das Formular-Widget nicht nur verwenden, um ein Kontaktformular zu erstellen, sondern Sie können es auch verwenden, um andere Arten von Formularen zu erstellen, einschließlich E-Mail-Registrierungsformular, E-Mail-Registrierungsformular, Benutzer, das Datei-Upload-Formular, etc ...

So erstellen Sie ein Kontaktformular in Elementor

Wenn Sie ein Kontaktformular mit dem Formular-Widget von Elementor erstellen, können Sie festlegen, wohin die Formulardaten gesendet werden. Ob in Ihrem E-Mail-Konto oder im Standard-Formular-Einreichungsmanager von Elementor.

In diesem Artikel springen wir direkt zum Hinzufügen des Formular-Widgets zum Bearbeitungsfeld von Elementor. Fügen Sie einfach das Formular-Widget aus dem Widget-Bereich wie folgt zum Bearbeitungsfeld hinzu:

Wie Sie sehen, erstellt das Formular-Widget automatisch ein Formular, das aus drei Feldern besteht.

Lesen Sie auch: So fügen Sie ein Preisraster in Elementor hinzu

Um ein vorhandenes Feld zu bearbeiten, können Sie es einfach öffnen. Sie können den Feldtyp ändern, die Standardbezeichnung und den Platzhalter überschreiben und bei Bedarf als erforderliches Feld festlegen.

Um ein vorhandenes Feld zu löschen, klicken Sie einfach auf das X des Feldes, das Sie löschen möchten.

Um ein neues Feld hinzuzufügen, klicken Sie einfach auf die Schaltfläche EIN ELEMENT HINZUFÜGEN. Das Formular-Widget selbst unterstützt zwanzig Arten von Feldern.

Definieren der Formularaktion

Wie bereits erwähnt, können Sie die Formulardaten (Einsendungen) an Ihr E-Mail-Konto oder an die integrierte Formulareinsendung von Elementor senden. Um das Ziel festzulegen, können Sie den Block öffnen Nach dem Senden von Aktionen unter der Registerkarte Inhalt aus dem Einstellungsfeld.

Siehe auch: So erstellen Sie ein abgerundetes Bild in Elementor

Erstellen Sie ganz einfach Ihre Website mit Elementor

Mit Elementor können Sie auf einfache Weise jedes Website-Design mit einem professionellen Look erstellen. Zahlen Sie nicht mehr teuer für das, was Sie selbst tun können. [Kostenlos]

Wählen Sie eine Aktion aus, die Sie im verfügbaren Feld definieren möchten (Sie können mehrere Aktionen hinzufügen). In diesem Beispiel wählen wir E-Mail.

Wenn Sie auch die Formularaktion festlegen per E-Mail, du kannst den block öffnen E-Mail um die E-Mail-Adresse für den Empfang der Formulardaten festzulegen. Wie Sie sehen, können Sie auch den Betreff festlegen, wenn Sie möchten.

Standardmäßig enthält Elementor den Inhalt aller Felder im Formular. Wenn Sie nur Inhalte aus bestimmten Feldern aufnehmen möchten, können Sie die Shortcodes Ihrer bevorzugten Felder in das Feld einfügen. Botschaft.

Mit der folgenden Einstellung wird beispielsweise nur der Inhalt des Nachrichtenfelds gesendet.

Um den Shortcode eines Feldes zu erhalten, können Sie auf die Registerkarte klicken ERWEITERT im zugehörigen Feld des Blocks Formularfelder.

Definition von Nachrichten

Wenn die Formulardaten erfolgreich übermittelt wurden, wird Ihren Besuchern unter dem Formular eine Erfolgsmeldung angezeigt. Ebenso wird eine Fehlermeldung angezeigt, wenn die Formulardaten nicht übermittelt werden.

Siehe auch: So erstellen Sie einen Teammitgliedsbereich mit Elementor

Sie können diese Standardnachrichten sowie zwei weitere Nachrichten aus dem Block überschreiben Zusätzliche Optionen unter der Registerkarte Inhalt aus dem Einstellungsfeld. Aktivieren Sie die Benutzerdefinierte Nachrichten um die Standardnachrichten zu überschreiben.

So erstellen Sie ein Kontaktformular in Elementor

Anpassen des Formulars

Nachdem Sie die Grundeinstellungen unter die Registerkarte Inhalt vom Einstellungsfeld aus können Sie zum Stil um das Formular anzupassen. Es gibt fünf Blöcke, die Sie hier öffnen können.

Suchst du nach den besten WordPress Themes und Plugins?

Laden Sie die besten Plugins und WordPress-Themes auf Envato herunter und erstellen Sie ganz einfach Ihre Website. Schon mehr als 49.720.000 Downloads. [EXCLUSIVE]

  • Formular

Sie können diesen Block öffnen, um den Abstand zwischen den Spalten und Zeilen des Formulars, den Etikettenabstand, die Typografie (Schriftfamilie, Schriftgröße, Schriftstil usw.) des Formularetiketts und dessen Textfarbe festzulegen.

  • Feld

Sie können diesen Block öffnen, um die Typografie des Texts des Feldes sowie die Farbe, die Hintergrundfarbe der Formularfelder, die Größe, die Rahmenfarbe und den Rahmenradius der Formularfelder festzulegen.

  • Buttons

Sie können diesen Block öffnen, um die Senden-Schaltfläche anzupassen. Sie können Dinge wie Schaltflächentexttypografie sowie Farbe, Hintergrundfarbe, Randradius, Randgröße, Randfarbe und Textfüllung festlegen. Um die Größe der Schaltfläche einzustellen, können Sie dies vom Block aus tun Tasten sous die Registerkarte Inhalt.

  • Direknachrichten

Sie können diesen Block öffnen, um die Typografie sowie die Farbe des Nachrichtentextes festzulegen.

  • Shritte

Sie können diesen Block nur öffnen, wenn Sie ein mehrstufiges Formular erstellen möchten.

Sobald Sie mit der Anpassung des Formulars und der Seite fertig sind, können Sie Ihre Seite veröffentlichen.

Möglicher Fehler

Einer der häufigsten Fehler beim Festlegen der Formularaktion auf E-Mail ist, dass das Formular nicht gesendet wird. Stattdessen sehen Sie die folgende Meldung.

So erstellen Sie ein Kontaktformular in Elementor

Elementor und die meisten Kontaktformular-Plugins – einschließlich Contact Form 7 – verwenden die Standard-E-Mail-Zustellungsfunktion von WordPress namens wp_mail. Diese Funktion hängt von der Funktion ab send_mail die von PHP abhängt, um zu funktionieren.

Lesen Sie auch: So fügen Sie einen Testimonial-Slider in Elementor hinzu

Leider aktivieren nicht alle Webhosting-Anbieter die Funktion send_mail von PHP. In diesem Fall wird Ihr Formular nicht gesendet. Stattdessen erhalten Sie eine Fehlermeldung wie die obige.

Um das Problem zu beheben, können Sie einen benutzerdefinierten E-Mail-Zustellungsdienst auf Ihrem WordPress installieren und konfigurieren. Alternativ können Sie, wenn möglich, Ihren Hosting-Provider bitten, die Funktion zu aktivieren send_mail von PHP.

Am Ende

Elementor ist eines der umfassendsten Plugins zum Erstellen von Seiten. Es wird mit einer Reihe von Designelementen (so genannten Widgets) geliefert, mit denen Sie der Seite einfach Elemente hinzufügen können, einschließlich eines Kontaktformulars.

Während Sie das Formular-Widget verwenden können, um ein Kontaktformular von Grund auf mit Ihrem eigenen Design zu erstellen, bietet Elementor auch einige Formularvorlagen, die Sie verwenden können. Sie können sogar eine Kontaktseite (natürlich komplett mit dem Kontaktformular) aus einer Vorlage erstellen.

Erstellen Sie einfach Ihren Online-Shop

Laden Sie kostenlos WooCommerce herunter, die besten E-Commerce-Plugins, um Ihre physischen und digitalen Produkte auf WordPress zu verkaufen. [Empfohlen]

Holen Sie sich jetzt Elementor Pro!

Fazit

Hier ist ! Das war's für diesen Artikel, der Ihnen zeigt, wie Sie ein Kontaktformular in Elementor erstellen. Wenn Sie Bedenken haben, wie Sie dorthin gelangen, flass es uns wissen im commentaires.

Sie können sich aber auch beraten unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung oder der eine auf Divi: das beste WordPress-Theme aller Zeiten.

Aber in der Zwischenzeit Teile diesen Artikel in deinen verschiedenen sozialen Netzwerken.

...

Dieser Artikel enthält Kommentare 0

Hinterlassen Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

Diese Website verwendet Akismet, um unerwünschte Inhalte zu reduzieren. Erfahren Sie mehr darüber, wie Ihre Kommentardaten verwendet werden.

Zurück nach oben
0 Aktien
Aktie
tweet
Registrieren