Landingpages - Teil 4: Hinzufügen eines Formulars und erweiterte Optionen

💡 Gut zu wissen
Landingpages sind im Rahmen von Business- und Enterprise-Plänen verfügbar.

In diesem Artikel erklären wir Ihnen, wie Sie ein Formular zu Ihrer Landingpage hinzufügen und die erweiterten Optionen des Landingpage-Editors verwenden. 

Wir haben eine Reihe von Artikeln zusammengestellt, um Ihnen bei der Erstellung Ihrer Landingpages zu helfen. 

Ein Formular zu Ihrer Landingpage hinzufügen

Mit Formularen können Sie E-Mail-Adressen sammeln und automatisch zu Ihren Brevo-Listen hinzufügen.

Um ein Formular-Element zu Ihrer Landingpage hinzuzufügen:

Neuer Landingpage-Editor Klassischer Landingpage-Editor 
Wählen Sie entweder Abschnitte > Vorgefertigte Abschnitte filtern > Formulare und wählen Sie dann einen vordefinierten Abschnitt, der bearbeitet und an Ihre Anforderungen angepasst werden kann, oder fangen Sie ganz von vorne an, indem Sie ein neues Formular-Element zu Ihrer Landingpage hinzufügen.
mceclip0.png mceclip3.png

Ihr Formular konfigurieren

Nachdem Sie ein Formular-Element zu Ihrer Landingpage hinzugefügt haben, können Sie es nach Ihren Vorstellungen konfigurieren:

Ausrichtung

Diese Einstellung ist nur im neuen Landingpage-Editor verfügbar.

Die Einstellung Ausrichtung wird im Abschnitt Allgemeine Einstellungen in dem Artikel Teil 3: Bearbeiten der Einstellungen aller Elemente Ihrer Landingpage erklärt.

Felder verwalten

Mit der Einstellung Felder verwalten können Sie auswählen, wo die Kontakte, die über das Formular gesammelt werden, gespeichert werden sollen und welche Informationen Sie von ihnen erhalten möchten. Sie können außerdem das Formular konfigurieren: Fügen Sie Felder hinzu und sortieren Sie sie, machen Sie Felder zu Pflichtfeldern, fügen Sie Hilfetext hinzu usw.

Um auf die Einstellungen Felder verwalten zuzugreifen, klicken Sie im Landingpage-Editor auf Ihr Formular.

Auswahl Ihrer Kontaktliste

mceclip7.png
  1. Klicken Sie auf das Formular, um rechts das Menü Formular bearbeiten zu öffnen.
  2. In Felder verwalten können Sie festlegen, wo in Ihrem Brevo-Konto die gesammelten E-Mail-Adressen gespeichert werden.
    • Wählen Sie einen Listenordner aus dem ersten Drop-down-Menü.
    • Wählen Sie eine Kontaktliste aus dem zweiten Drop-down-Menü.
❗️ Wichtig
Wenn Sie die Kontakte in Ihrer Liste aktualisieren möchten, wenn diese das Formular ausfüllen, müssen Sie die Option Existierende Kontakte bei Formulareinreichung aktualisieren unter Formularsteuerung aktivieren.

Felder konfigurieren

Fügen Sie für die Daten, die Sie sammeln möchten, als Nächstes verschiedene Felder zu Ihrem Leadgenerierungsformular hinzu. 

mceclip9.png

  1. Ein Kontaktfeld hinzufügen: In diesem Drop-down-Menü können Sie vorgefertigte Felder zu Ihrem Formular hinzufügen.
  2. Ein neues Feld erstellen: Wenn das Kontaktattribut noch nicht existiert, können Sie hier eines erstellen.
  3. Felder neu anordnen: Klicken Sie einfach auf = und ordnen Sie die Felder dann neu.
    Ein Feld löschen:  Mithilfe des Papierkorb-Symbols können Sie die Felder entfernen.

    Klicken Sie auf das Feld und wählen Sie seine Einstellungen:
  4. Bezeichnung: Zeigen Sie die Bezeichnung über dem Feld an.
  5. Verborgen: Klicken Sie auf den Umschalter, um ein verborgenes oder ein im Formular sichtbares Feld zu erstellen.
    Sie können ein verborgenes Formularfeld hinzufügen, wenn Daten automatisch ausgefüllt werden sollen, indem sie in der URL mit Abfrageparametern weitergeleitet werden.
  6. Erforderlich: Legen Sie fest, ob es sich bei dem Feld um ein für das Senden des Formulars erforderliches Pflichtfeld handelt.
  7. Je nach Feld sind verschiedene Einstellungen verfügbar:

    • Bezeichnung: Ändern Sie den Titel, der über dem Feld angezeigt wird.
    • Platzhalter: Geben Sie den Text ein, der in Ihrem Feld angezeigt werden soll. Standardmäßig ist der Text mit Ihrer Bezeichnung identisch.
    • Hilfetext: Geben Sie den Text ein, der unter Ihrem Feld anzeigt werden soll. Dies kann hilfreich für Vorschläge sein.
    • Standardwert: Dieser Wert wird mit Ihrer Brevo-Kontaktliste synchronisiert, wenn der Besucher das Feld nicht ausfüllt.
    • URL Parameter: Dieser Wert wird automatisch in das Formularfeld eingefügt. Die Benutzer können ihn auf Wunsch überschreiben. In unserem Artikel Ein Formular auf einer Landingpage mit Kontaktattributen vorausfüllen erfahren Sie mehr dazu.
❗️ Wichtig
Wenn Sie eine Telefonnummer zu Ihrem Formular hinzufügen, funktioniert ausschließlich das internationale Format, wie beispielsweise: +497911123456 in Deutschland, +12025550101 in den USA oder +33655678834 in Frankreich.
Bitte verwenden Sie den Platzhalter, um Ihren Benutzern bei der Eingabe des richtigen Formats zu helfen.

Weiterleitung nach der Einreichung des Formulars

In den Weiterleitungsoptionen können Sie festlegen, wohin Ihre Nutzer weitergeleitet werden, wenn sie ihre Kontaktdetails einreichen.

mceclip10.png

Verwenden Sie die Formularweiterleitungsaktion, um Ihre Kontakte auf eine Seite im Funnel (eine Unterseite Ihrer Landingpage) oder zu einer spezifischen URL weiterzuleiten:

  • Seite im Funnel: Wählen Sie aus, auf welche Funnel-Seite Ihre Kontakte weitergeleitet werden sollen.
  • Link zu einer URL: Geben Sie den Link zu der externen Seite ein, auf die Ihre Kontakte weitergeleitet werden sollen.

Double-Opt-in

mceclip11.png

Die Einstellung Double Opt-in ermöglicht es Ihnen, die Opt-in-Methode zu wählen, die Sie in Ihrem Formular verwenden wollen:

  • Single Opt-in:
    1. Ihr neuer Kontakt gibt seine E-Mail-Adresse in das Formular ein.
    2. Er wird zu Ihrer Brevo-Kontaktliste hinzugefügt.
  • Double Opt-in:
    1. Ihr neuer Kontakt gibt seine E-Mail-Adresse in das Formular ein.
    2. Der Kontakt erhält eine Bestätigungs-E-Mail und muss auf den darin enthaltenen Link klicken, um zu Ihrer Brevo-Kontaktliste hinzugefügt zu werden.
❗️ Wichtig
Es gibt zwei Möglichkeiten, um eine Double-Opt-in Anmeldung zu erstellen. Stellen Sie sicher, dass Sie nur eine dieser zwei möglichen Methoden verwenden: Aktivieren Sie die Double-Opt-in-Anmeldung durch Marketing Automation ODER durch ein Brevo-Anmeldeformular. Andernfalls erhalten Ihre Kontakte doppelte Double-Opt-in-E-Mails.

Design

mceclip12.png

Mit der Einstellung Design können Sie Ihre Felder gestalten: kein Design, konturiert, geschwungene Konturen, unterstrichen mit Hintergrund, unterstrichen ohne Hintergrund.

Ihr Formular kann auch horizontal angezeigt werden. Wenn Sie ein horizontales Formular wählen, empfehlen wir, die Bezeichnungen Ihrer Felder zu entfernen.

Um die Hintergrundfarbe zu ändern, gehen Sie zu der Spalte Einstellungen, wie in Teil 3: Bearbeiten der Einstellungen aller Elemente Ihrer Landingpage erklärt.

Hier sehen Sie ein paar Beispiele für verschiedene Formulardesigns:

Style_form_gif.gif

Abstand

Die Einstellung Abstand wird im Abschnitt Allgemeine Einstellungen des Artikels Teil 3: Bearbeiten der Einstellungen aller Elemente Ihrer Landingpage erklärt.

Formularsteuerung

mceclip0.png

Über die Einstellung Formularsteuerung können Sie festlegen, wie sich Ihr Formular bei der Einreichung verhalten soll:

  • Bestehende Kontakte beim Einreichen eines Formulars aktualisieren: Diese Option ist hilfreich, wenn Sie die Informationen von bestehenden Kontakten aktualisieren möchten, wenn diese das Formular einreichen. 
  • reCAPTCHA deaktivieren: Deaktivieren Sie das standardmäßig integrierte Google reCaptcha auf Ihrer veröffentlichten Landingpage.
  • Deaktivierung von URL-Parametern bei der Formulareinreichung:
    Standardmäßig werden URL-Parameter bei der Formulareinreichung angezeigt. In der URL werden dann möglicherweise zusätzliche Daten zum Kontakt angezeigt, z. B. /thank-you.html/?firstName=Jane. Diese Funktion ist nützlich, da Ihre Kontakte nicht dieselben Informationen auf der zweiten Seite eingeben müssen, wenn Sie mehrere Informationssätze mit einer Reihe von Landing Pages in Ihrem Trichter sammeln. Wenn Sie jedoch Google Ads schalten und von Google eine Benachrichtigung über die Anzeige von URL-Parametern bei der Formulareinreichung erhalten, können Sie diese Funktion deaktivieren und Ihre Landing Page erneut veröffentlichen.

Stil

Diese Einstellung ist nur im neuen Landingpage-Editor verfügbar.

mceclip14.png

Über die Einstellung Stil können Sie das Erscheinungsbild Ihres Formulars festlegen:

  • Stil und Farbe von Rändern: Fügen Sie einen Rand zu Ihrem Formular hinzu und wählen Sie seine Farbe.
  • Breite des Rands: Legen Sie fest, wie breit der Formular-Rand sein soll.
  • Border Radius: Runden Sie die Ecken Ihres Formulars ab.

JavaScript Tracking (Facebook Pixel / Google Analytics)

Tracking bietet Ihnen die Möglichkeit, Ihre Tracking-Scripts in bestimmte Komponenten der Seite einzufügen.

Ein Tracking Script ist ein Code, der verwendet wird, um die Anzahl der Nutzer, die eine Seite besuchen, zu überwachen. Tracking Scripts ermöglichen es Ihnen, zu analysieren, wie lange Besucher auf der Seite bleiben, was ihre Aufmerksamkeit weckt und wie sie mit dem Inhalt interagieren.

💡 Gut zu wissen
Google Analytics und Facebook Pixel sind die meistverwendeten Tracking Scripts. Sie können jedoch ein beliebiges Tracking Script zu einer Brevo-Landingpage hinzufügen.

Um ein Tracking Script zu Ihrer Landingpage hinzuzufügen:

  1. Klicken Sie im Feld Landingpage-Editor unten links auf Einstellungen.
  2. Wählen Sie Tracking.
    mceclip15.png

  3. Geben Sie das Tracking Script in das Feld des gewünschten Tags ein. Sie können ein Script für folgende Tags einfügen:

    • Head-Tag <head>

    • Öffnendes Tag <body>

    • Schließendes Tag </body>

      💡 Gut zu wissen

      Für Dienste wie Facebook und Google Analytics muss das Script im Head-Tag vorhanden sein, für andere Dienste muss es in den Body eingefügt werden. Bitte lesen Sie sich die jeweiligen Anweisungen genau durch, um das Script richtig zu platzieren.

  4. Klicken Sie auf Fertig.

Landingpage mit mehreren Seiten

mceclip17.png Wenn Sie weitere Seiten zu Ihrer Landingpage hinzufügen möchten, um einen Funnel zu erstellen, gehen Sie zum Menüfeld Seiten und klicken Sie auf + Eine leere Seite erstellen. Lesen Sie den Artikel Verwalten von Unterseiten Ihrer Landingpage, um mehr zu erfahren.

Gerätebasierte Wiedergabe

mceclip18.png

Dank der Schaltflächen Desktop / Mobile oben können Sie das Rendering Ihrer Landingpage auf Desktop-PCs, Tablets und Smartphones testen.

❗️ Wichtig
Abhängig davon, auf welchem Gerät Ihre Landingpage aufgerufen wird, können Sie bestimmte Abschnitte oder Elemente verbergen. Weitere Informationen finden Sie im Abschnitt Sichtbarkeit in dem Artikel Teil 3: Bearbeiten der Einstellungen aller Elemente Ihrer Landingpage.

⏭️ Nächste Schritte

🤔 Sie haben eine Frage?

Wenden Sie sich bei Fragen an unser Support-Team: Erstellen Sie einfach ein Ticket über Ihr Konto. Wenn Sie noch kein Konto haben, können Sie uns hier kontaktieren.

Wenn Sie Unterstützung bei einem Projekt mit Brevo suchen, können wir Sie mit dem richtigen zertifizierten Brevo-Expertenpartner zusammenbringen.

💬 War dieser Beitrag hilfreich?

11 von 26 fanden dies hilfreich