Ein Elementor Mailchimp Formular Ist eine der schnellsten Möglichkeiten, aus einem Besucher einen Abonnenten zu machen Die Mailchimp-widget In Master-Addons für Elementor Legt ein Anmeldeformular vom kostenlosen Plugin MC4WP: Mailchimp for WordPress in euer Layout, und es gibt euch zwei Möglichkeiten, es auszuführen: Zeigt das gespeicherte MC4WP-Formular an, oder schreibt euer eigenes Feldmarkup Unten behandele ich beides, vom Elementor-Panel bis hin zur Live-Seite.
Wie das Elementor Mailchimp Formular-Widget funktioniert #
Das Widget rendert a Mailchimp-Anmeldeformular in Elementor Durch die Anzeige eines Formulars von MC4WP: Mailchimp für WordPress, ein kostenloses Plugin von ibericode, hält MC4WP den API-Schlüssel, die Zielgruppe, Double-Opt-In und die Formularnachrichten Das Widget fügt eine Form Type-Wahl hinzu: Zeigen Sie das gespeicherte MC4WP-Formular an, oder ersetzen Sie seine Felder durch Ihr eigenes Markup MC4WP verarbeitet die Anmeldung so oder so.
Bevor Sie beginnen #
- WordPress Mit Elementor Installiert und aktiv.
- Master-Addons für Elementor Installiert und aktiv Wenn Sie es noch nicht installiert haben, folgen Sie der Installationsführung.
- Das Mailchimp-Widget ist im Optionsfeld Master Addons aktiviert.
- Die freie MC4WP: Mailchimp für WordPress Plugin installiert und aktiv Ohne zeigt das Widget statt eines Formulars einen Hinweis “MailChimp für WordPress ist nicht aktiviert!” an.
- Ein Mailchimp-Konto und ein API-Schlüssel.
Fügen Sie das Widget zu Ihrer Seite hinzu #
Öffnen Sie die Elementoreditor und durchsuchen Sie das Widgets-Panel nach “Mailchimp.” Ziehen Sie die Master-Addons Mailchimp Widget in den Abschnitt, in dem Sie das Formular haben wollen Es zeigt Ihr MC4WP-Formular an, hier ein E-Mail-Feld, ein Terms-Checkbox und einen Button “Anmelden” Die rote Zeile über den Mailchimp API-Schlüssel kommt von MC4WP Nur angemeldete Admins sehen es, und es verschwindet, sobald MC4WP angeschlossen ist.
Verwenden Sie ein Standard-Mailchimp-Anmeldeformular #
Im Reiter Inhalt, lassen Formtyp Auf Standardwerte. Die MailChimp-Anmeldeformular Dropdown listet die in MC4WP gespeicherten Formulare auf, z. B. „opt in“Wählen Sie das gewünschte aus und das Widget rendert es auf der Leinwand mit den Feldern, die Sie unter „MC4WP > Formular” festgelegt haben. Die kostenlose Version von MC4WP enthält ein Formular.
Dies ist der schnellste Weg, um eine Mailchimp-Anmeldeformular in Elementor Live, da MC4WP die Felder bereits Ihrem Publikum zuordnet.
Erstellen Sie ein benutzerdefiniertes Mailchimp-Formular #
Stellen Sie die Formtyp Dropdown auf BenutzerdefiniertA Benutzerdefiniertes Formular Codefeld wird für Ihr eigenes Feldmarkup angezeigt, das die Felder des MC4WP-Formulars ersetzt Fügen Sie den Einbettungscode von Mailchimp selbst nicht ein, da sein Formular-Tag innerhalb des MC4WP-Formulars kaputt geht. Greifen Sie darauf zu, wenn Sie zusätzliche Felder, benutzerdefinierte Beschriftungen oder ein bestimmtes Checkbox-Layout benötigen.
Das Demo-Markup im Video verwendet eine einfache Struktur, die Sie anpassen können:
<p>
<label for="email">Email address:</label>
<input type="email" id="email" name="EMAIL" placeholder="Your email address">
</p>
<p>
<label>
<input type="checkbox" name="AGREE_TO_TERMS" value="1" required>
I have read and agree to the terms & conditions
</label>
</p>
<p>
<input type="submit" value="Sign up">
</p>Wenn Sie das Markup lieber außerhalb von Elementor schreiben und in der Vorschau anzeigen möchten, ist dieser Side-by-Side-Code-Editor mit der Live-Vorschau kostenlos Mailchimp für WordPress (MC4WP) Plugin, nicht Master Addons selbst Markup links, Live-Vorschau rechts, so dass Sie das Layout direkt vor dem Einfügen in das Widget erhalten können.
Eine Sache, die Menschen mit benutzerdefiniertem Markup einlädt: Ihr name Attribute müssen zu Ihren Mailchimp-Publikumszusammenführungs-Tags passen Das E-Mail-Feld muss insbesondere name="EMAIL", oder Mailchimp erkennt die Abonnentenadresse nicht und die Anmeldung schlägt stillschweigend fehl.
Konfigurieren Sie Ihren Mailchimp API-Schlüssel #
Die API-Schlüsselzeile wird gelöscht, sobald MC4WP verbunden ist Im WordPress-Admin öffnen MC4WP > MailchimpFügen Sie Ihren Schlüssel ein und speichern Sie ihn, und der Status ändert sich in Verbunden. Dann öffnen Sie MC4WP > Formularten, kreuzen Sie die Zielgruppe an, die Abonnenten empfangen soll, und überprüfen Sie die Registerkarte Einstellungen Double Opt-in ist dort standardmäßig eingeschaltet, und Sie können auch Abonnenten-Tags oder eine Weiterleitungs-URL hinzufügen.
Generieren Sie einen Schlüssel aus Ihrem Einstellungen des Mailchimp-Kontos. Halten Sie es privat und fügen Sie es niemals in das Markup für benutzerdefinierte Formulare selbst ein, da dieses Markup für jeden sichtbar ist, der die Seitenquelle ansieht.
Stil die Form #
Das Widget hat keine Stil Tab. Master Addons lädt ein kleines Stylesheet, das dem E-Mail-Feld und der Schaltfläche eine 50 px-Höhe, einen dunklen Knopf und farbige Erfolgs - und Fehlerboxen verleiht MC4WP kann einen eigenen Look aus der Registerkarte Aussehen des Formulars hinzufügen, entweder Basic Styles oder ein Light, Dark, Red, Green oder Blue Theme Verwenden Sie die Registerkarte Elementor Advanced für Abstand und Hintergrund Für Feld - oder Tastenfarben fügen Sie CSS mit dem hinzu Benutzerdefinierte CSS-Erweiterung und Ziel .jltma-mailchimp Also die Elementor-E-Mail-Anmeldeformular Passt zum Rest Ihres Designs.
Das Ergebnis auf der Live-Seite #
Auf dem Frontend zeigt das Formular das E-Mail-Feld, das Kontrollkästchen Begriffe und die Absendetaste genau so an, wie Sie sie eingestellt haben. Wenn MC4WP angeschlossen ist, geht jede Anmeldung an die Zielgruppe, die im MC4WP-Formular angekreuzt ist, nachdem der Abonnent per E-Mail bestätigt hat, ob ein Double-Opt-in aktiviert ist.
Häufige Anwendungsfälle #
- Blog-Newsletter: Fallen Sie ein einfaches E-Mail-Feld in die Fußzeile oder Seitenleiste eines Blogs.
- Bleimagnete: Koppeln Sie das Formular mit einem Download-Button, damit Besucher abonnieren können, bevor sie den Leitfaden erhalten.
- Produkt-Launch-Seiten: Early-Access-E-Mails auf einer Landingpage sammeln.
- Veranstaltungsanmeldungen: Verwenden Sie benutzerdefiniertes Markup, um Kontrollkästchen für Name, Firma oder Einwilligung hinzuzufügen.
- Fußzeilenabonnements: Kompakt einbetten Mailchimp-Widget für Elementor In der Site Footer.
Weitere Formularmöglichkeiten finden Sie im Kontaktformular 7 Widget. Damit eine Ankündigungsleiste neben einem Anmeldeformular sitzt, versuchen Sie es mit der News-Ticker-Widget.
Video-Tutorial #
Bevorzugen Sie es anzusehen? Diese Komplettlösung richtet das Mailchimp-Widget Ende an Ende ein, von der Auswahl eines Formulartyps bis zum Anmeldeformular auf der Live-Seite:
Häufig gestellte Fragen #
Kann ich ein Mailchimp-Formular in Elementor ohne Codierung hinzufügen?
Ja. Formtyp auf Standard setzen und Ihr MC4WP-Formular aus dem Dropdown auswählen Das Widget rendert die Felder, die Sie in MC4WP eingerichtet haben.
Wie erstelle ich ein benutzerdefiniertes Mailchimp-Formular in Elementor?
Setzen Sie Form Type auf Benutzerdefiniert und fügen Sie Ihr HTML-Markup in den Textbereich Benutzerdefiniertes Formular ein Stellen Sie sicher, dass die E-Mail-Eingabe name=”EMAIL verwendet und dass MC4WP mit Ihrem Mailchimp-Konto verbunden ist.
Warum steht im Widget, dass ich einen Mailchimp API-Schlüssel konfigurieren muss?
Diese Zeile stammt von MC4WP. Fügen Sie Ihren Mailchimp API-Schlüssel in die MC4WP Mailchimp-Einstellungen im WordPress-Admin ein und speichern Sie. Wenn im Widget steht, dass MailChimp für WordPress nicht aktiviert ist, installieren und aktivieren Sie zuerst das MC4WP-Plugin.
Kann ich dem Formular zusätzliche Felder wie Name oder Telefon hinzufügen?
Ja, aber nur im Benutzerdefinierten Modus Fügen Sie Standard-HTML-Eingabefelder mit Namensattributen hinzu, die zu Ihren Mailchimp-Publikumszusammenführungs-Tags passen, z. B. FNAME für den Vornamen.
Ist das Mailchimp-Widget in der kostenlosen Version von Master Addons verfügbar?
Ja. Das Mailchimp-Widget ist in Master-Addons kostenlos, und MC4WP ist auch kostenlos Die Mailchimp-Widget-Seite Vergleicht es mit dem Elementor Pro Form.
Einwickelnd #
Die Master Addons Mailchimp-widget ist eine direkte Möglichkeit, ein hinzuzufügen Elementor Mailchimp Formular Zu jeder Seite Gehen Sie mit einem Standardformular für Geschwindigkeit, oder wechseln Sie in den Benutzerdefinierten Modus, wenn Sie die volle Kontrolle über das Markup und die Felder wollen So oder so erreichen Abonnenten Ihr Mailchimp-Publikum, sobald MC4WP verbunden ist Durchsuchen Sie den vollständigen Satz von Master Addons Widgets und Erweiterungen Für weitere Tools zum Vergrößern Ihrer Liste.
