Wie erstelle ich ein Opt-In Formular als Pop-Up und aktivere es auf einer Seite?

Du kannst ein Opt-In Formular erstellen, welches als Pop-Up auf deiner Webseite erscheint, nachdem ein bestimmtes Event ausgeführt wurde. Das kann bspw. ein Klick auf einen dafür vorgesehenen Button sein oder einfach das Erscheinen des Pop-Up Opt-In Formulars nach einer bestimmten Zeit.

Hinweis

Suchmaschinen sehen es nicht gerne, wenn ein Pop-Up einfach so automatisch erscheint, ohne dass dieses explizit vom Besucher aufgerufen wurde. Daher empfehlen wir die Verwendung “Trigger on Click” = Pop-Up erscheint, nachdem man auf einen Button geklickt hat. In dieser Anleitung erfährst du, wie das geht. 

Login Spreadmind Webseite

Bitte logge dich zuerst auf deiner Spreadmind Webseite ein. Der nachfolgende Absatz “Anleitung Login in Spreadmind Webseite” lässt sich durch einen Klick aufklappen und hilft dir bei diesem ersten Schritt.

Anleitung Login in Spreadmind Webseite

Rufe zuerst den Login-Bereich zu deiner Spreadmind Webseite auf, indem du ein /wp-admin hinter deinen Domainnamen setzt.

Logge dich dann mit deinen Spreadmind Benutzerdaten auf deiner Webseite ein. Nach dem Login wirst du automatisch ins Backend zum Dashboard (= Startseite des Backends) weitergeleitet:

Neues Opt-In Formular vom Typ “Pop Up”

Bitte gehe nun im Backend zu “Opt-In Formulare” und klicke in der Ansicht rechts oben auf den Button “Neues Opt-In Formular”. Wähle ein Opt-In vom Typ “Pop Up” aus:

Schritt 1: Einstellungen

Im ersten Schritt “Einstellungen” gibst du deinem Opt-In Formular einen eigenen Namen. Bei der Option “Formular Integration” verknüpfst du das Opt-In mit unserem integrierten E-Mail-Marketing Tool. Übernehme hierfür bitte folgende Einstellungen:

  1. E-Mail Anbieter auswählen: Spreadmind E-Mail-Marketing
  2. Benutzerkonto auswählen: Spreadmind
  3. E-Mail Liste auswählen: (Hier deine Liste auswählen)

Klicke bitte rechts unten auf den grauen Button “Nächster Schritt: Design Opt-In Formular”.

Schritt 2: Design

Wähle nun eine Design-Vorlage aus, welche du im nächsten Schritt individuell anpassen möchtest. Klicke hierfür auf ein Template und gehe dann bitte ganz ans Ende der Seite und klicke rechts unten auf den grauen Button “Nächster Schritt: Anpassen”.

→ Headline und Text, Farben, Formular-Felder, Button

In diesem Schritt kannst du nun eine Headline sowie einen Text für das Opt-In Formular einfügen und dieses gestalterisch anpassen. Hier bestimmst du auch die Button-Farbe sowie den Button-Text.

Eine weiterführende Anleitung findest du hier: » Wie passe ich Design und Text meines Opt-In Formulars an?

→ Text der Fusszeile & Nachricht bei erfolgreicher Anmeldung

Wenn du möchstest kannst du einen Text unterhalb der Formular-Felder ausgeben, wie bspw. “Kein Spam.” o.ä.

Trage bei der Option “Nachricht bei erfolgreicher Anmeldung” einen Text ein, welcher dem Besucher angezeigt wird, nachdem er das Opt-In Formular ausgefüllt und “gesendet” hat. Du kannst ihn auch nach Absenden des Opt-In Formulars auf eine andere Seite weiterleiten – das erfährst du im letzten Schritt “Bestätigung”.

Sobald du alle Anpassungen vorgenommen hast, klickst du bitte rechts unten auf den grauen Button “Nächster Schritt: Anzeigeneinstellungen”.

Schritt 3: Anzeigeneinstellung

In diesem Schritt legst du den Trigger fest, also den Zeitpunkt und die Aktion, wann das Pop-Up erscheinen soll. Wir empfehlen “Trigger In Click”. Das Pop-Up soll erscheinen, nachdem man auf einen dafür vorgesehenen Button klickt.

Damit dieser Button mit unserem Pop-Up Opt-In Formular verknüpft wird, müssen wir bei diesem Schritt einen CSS-Klassennamen angeben. Die Schreibweise muss so aussehen:

a.popup_trigger_button

Dabei kannst du den Text für “popup_trigger_button” frei wählen. Es dürfen lediglich keine Sonder- oder Leerzeichenzeichen oder Umlaute verwendet werden. Gedanken- und Unterstrich sind erlaubt, genauso wie Ziffern 0-9. 

Wichtig ist, dass a. unmittelbar vorangestellt wird. 

Wähle bitte beim Abschnitt “Anzeigen auf/am” die Option “Alles” aus. So kannst du später auf jeder beliebigen Seite das Pop-Up bzw. den Button einbinden.

Klicke dann bitte rechts unten auf den grauen Button “Next: Success Action”, um zum letzten Schritt “Bestätigung” weitergeleitet zu werden.

Schritt 4: Bestätigung

Im letzten Schritt bestimmst du, ob nach Ausfüllen und Absenden des Opt-In Formulars ein Text angezeigt werden soll, oder ob der Besucher zu einer bestimmten Seite weitergeleitet werden soll.

Option A – “Textanzeige”: Den Text legst du unter Schritt 2 Design und dort bei der vorletzten Option “Nachricht bei erfolgreicher Anmeldung” fest.

Option B – “Weiterleitung zu einer Seite/URL”: Trage hier die URL einer Seite ein, auf die du den Besucher weiterleiten möchtest.

Speichern

Klicke zum Schluss auf den blauen Button “Beenden & Speichern”. Du wirst dann wieder zur Übersicht aller Opt-In Formulare zurückgeleitet.

Soweit also die finalen Einstellungen des Opt-In Formulars. Nun müssen wir nur noch das Trigger-Event, also den dafür vorgesehenen Button auf einer Seite einfügen. 

Button für Pop-Up auf Seite einfügen

Bitte gehe hierfür im Backend zu “Webseite” > “Alle Seiten” und wähle eine Seite zum “Bearbeiten” aus. Diese Option erscheint, sobald du mit der Maus über die Zeile fährst.

Modul “Taste” einfügen

Bitte füge an deine gewünschte Stelle das Modul “Taste” hinzu:

Button Text 

Trage nun bei der 1. Registerkarte “Inhalt” deinen gewünschten Button Text ein. Einen Link/URL benötigst du in diesem Fall nicht. 

Button Trigger-Event festlegen 

Wechsle bitte in den Modul Einstellungen zur 3. Registerkarte “Advanced” (Fortgeschritten) und trage dort bei CSS-Klasse den Klassennamen ein, welchen du beim Opt-In Formular in dessen Einstellungen unter Schritt 3 “Anzeigeneinstellungen” gewählt hast.

Ganz wichtig: Hier ohne a. und nur popup_trigger_button 

Klicke danach bitte auf den grünen Button “Speichern & Beenden”, um die Modul Einstellungen zu speichern und diese zu schließen. 

Anpassung speichern/aktualisieren

Zum Schluss speicherst du die Anpassungen im Bearbeitungsmodus in der rechten Spalte über die Optionen-Box "Veröffentlichen", indem du auf den orangenen Button "Veröffentlichen" bzw. "Aktualisieren" klickst.

Optionen-Box Veröffentlichen

Erst dann greifen die Änderungen, die du im Bearbeitungsmodus vorgenommen hast.

Bitte rufe deine Seite im Frontend auf. Klickst du dort auf den Button, erscheint das Opt-In Formular als Pop-Up:

Tausche dich mit der Spreadmind-Community aus!

0 Kommentare

Einen Kommentar abschicken