So erstellen Sie Landingpages mit Campaign2 (Tutorial)

Achtung: Dieses Tutorial ist nicht mehr aktuell!
Wir arbeiten gerade an einer neuen Version.

In diesem Tutorial gehen wir die Erstellung einer Landingpage Schritt für Schritt durch. Dabei verwenden wir den Landingpage-Generator von Campaign2.

Ziel dieses Tutorials ist es, eine komplette Landingpage zu erstellen und zu veröffentlichen. Inklusive eigener Domain, Formular und Tracking.

Dabei lernen Sie:

Eine Warnung noch: Der Artikel ist relativ lang, lassen Sie sich davon bitte nicht abschrecken, denn es lohnt sich!

Erste Schritte in Campaign2

Zunächst einmal benötigen Sie ein Benutzerkonto bei Campaign2. Falls Sie noch keins haben, können Sie hier ein kostenloses einrichten, die Erstellung eine Landingpage ist darin enthalten.

lp-Signup

Registrieren Sie sich und bestätigen Sie Ihre E-Mail-Adresse. Danach können Sie sich sofort einloggen. Im Menü „Module“ findet sich der Eintrag „Landingpages“, der zum gewünschten Modul führt.

1. Rufen Sie das Modul „Landingpages“ auf

Alle weiteren Schritte in diesem Tutorial gehen davon aus, dass Sie sich im Modul Landingpages befinden. Um das Modul aufzurufen, klicken Sie oben im Menü auf den Link: Menü -> Module -> Landingpages

lp-modul-aufrufen

Sie gelangen nun auf die Übersichtsseite mit allen Projekten, Einstellungen und ähnlichem.

2. Eine eigene Domain für die Landingpage

Im Benutzerkonto von Campaign2 ist eine eigene Subdomain bereits enthalten und diese wurde bei der Registration automatisch aktiviert. Wir wollen aber lieber unsere eigene Domain verwenden und müssen dem System diesen Wunsch nun mitteilen.

Technisch funktioniert das ganz einfach: In der Regel können Sie im Verwaltungs-Interface Ihres Domain-Providers die gewünschte IP-Adresse eintragen, in diesem Fall tragen Sie folgende IP-Adresse ein:

91.250.81.40

Alternativ-Tipp: Falls Sie sich mit der Domainverwaltung tiefergreifend auskennen, können Sie statt der IP-Adresse auch einen so genannten CNAME eintragen (dann bitte die IP-Adresse NICHT wie oben beschrieben eintragen). Das ist praktisch eine Stellvertreter-Domain für Ihre spezielle Subdomain. Sie geben also an, dass die als CNAME eingetragene Domain auch zur Subdomain führen soll. Der Vorteil dabei ist, dass Sie bei einem Serverumzug von Campaign2 nichts ändern müssen.

Wichtig dabei: Tragen Sie die Subdomain vollständig qualifiziert ein, also mit einem Punkt am Ende. Beispiel:

ihreSubdomain.campaign2.de.

 Domain in Campaign2 eintragen

Nachdem Sie die Domain so konfiguriert haben, dass diese auf den Campaign2-Server zeigt, tragen Sie den Domainnamen nun unter Einstellungen ein.

lp-Domains-verwalten

Klicken Sie auf „Domain hinzufügen“ und tragen Sie die gewünschte Domain ein. Nach dem Speichern können Sie Ihre Domain sofort verwenden.

3. Ein neues Projekt anlegen und auswählen

Ein Projekt enthält alle Landingpages, Trackinglinks und dazu gehörende Berichte die aus Ihrer Sicht zusammenhängen. Sprich, erstellen Sie für alles ein Projekt, was Sie später gemeinsam auswerten möchten.

Klicken Sie im linken Menü auf Projekte -> Hinzufügen und tragen Sie alle gewünschten Angaben ein. Nach dem Absenden gelangen Sie in die Liste der Projekte. Wählen Sie nun das Projekt aus, das Sie bearbeiten wollen, indem Sie auf „Auswählen“ klicken.

lp-Projektübersicht leer

4. Eine neue Landingpage erstellen

In der Projektübersicht können Sie neue Landingpage einfügen, indem Sie auf das Menü Landingpages und darin auf Hinzufügen klicken.

lp-landingpage-neu

Bezeichnung

Die Bezeichnung ist ein Name mit dem die Landingpage später in Listen und Berichten auftaucht.

URL-Name

Das ist ein bisschen tricky. Der URL-Name ist der Teil der Webadresse, der nach der Domain kommt. Bei der Seite die Sie im Moment lesen, ist der URL-Name:

so-erstellen-sie-landingpages-mit-campaign2

Wenn Sie zum Beispiel den URL-Namen

mein-tolles-neues-Produkt

verwenden, wird zusammen mit Ihrer Domain daraus die URL, unter der Ihre Landingpage später abrufbar sein wird:

http://IhrProjektName.campaign2.de/mein-tolles-neues-Produkt

Vorlage

Damit Sie nach dem Erstellen nicht vor einer leeren Seite sitzen, können Sie eine Vorlage wählen. Diese wird dann für Sie geöffnet und der Quellcode und ein Standardformular wird in Ihre neue Seite eingebaut. Von da an können Sie die Vorlage dann bearbeiten und die Inhalte selber ändern.

5. Landingpage bearbeiten – der Editor

Nachdem die neue Landingpage erstellt wurde, gelangen Sie direkt in den Bearbeitung-Modus.

lp-page-editor-metaIm Bearbeitungs-Modus sehen Sie zunächst die Eigenschaften der Seite (Metadaten) und können die Gewichtung der A/B-Versionen einstellen (dazu später mehr).

Auf der linken Seite finden Sie Reiter für den Zugriff auf die einzelnen Bestandteile Ihrer Landingpage: Die Version A und B, die „Danke“-Seite die nach dem Absenden des Formulars gezeigt wird, das Formular selbst und letztlich die CSS-Verwaltung mit der Sie das Design beeinflussen.

Landingpage Sperren/Entsperren

Hier können Sie Ihre Landingpage sperren/entsperren. Eine gesperrte Page ist im Frontend nicht abrufbar. Klicken Sie auf den Button Aktionen -> Sperren/Entsperren um den Zustand umzuschalten.

6. Den Quelltext bearbeiten

Klicken Sie zunächst auf Version A.

lp-editro-versiona

So gelangen Sie in die Quellcode-Ansicht und können auf HTML-Ebene alle gewünschten Änderungen vornehmen. Nachdem Sie die Änderung vorgenommen haben, Speichern Sie diese mit einem Klick auf den Button ab.

Wichtig! Damit sich Ihre öffentlich abrufbare Landingpage ändert, reicht es nicht aus diese zu speichern. Erst wenn Sie auf „Veröffentlichen“ klicken wird die neue Version der Landingpage veröffentlicht.

Benutzen Sie die Vorschau-Funktion, um einen aktuellen Eindruck der Seite zu bekommen.

7. A/B-Version erstellen

Eine A/B-Version ist eine Kopie Ihrer Landingpage die im Frontend abwechselnd angezeigt wird. Für beide Versionen werden getrennt Leistungsdaten wie Views und Leads aufgezeichnet und können dadurch beurteilt werden.

Tipp: Wenn Sie zunächst nur eine Version Ihrer Landingpage veröffentlichen möchten, stellen Sie das Gewicht der B-Version einfach auf 0%. Dadurch wird diese nicht mehr angezeigt.

Um die B-Version auf den gleichn Stand wie die A-Version zu bringen, müssen Sie im Moment noch den Quelltext kopieren. Das wird in einem zukünftigen Update noch verbessert.

8. Das Lead-Formular bearbeiten

Nach dem Anlegen der Landingpage ist automatisch ein Formular eingefügt worden. Klicken Sie auf den „Formular„-Tab um den Formular-Editor aufzurufen.

lp-formular-editor

Sie können hier Ihre Bearbeitung direkt in den Eingabefeldern vornehmen, nach jeder Änderung wird automatisch gespeichert. Zusätzliche Felder können Sie mit dem Hinzufügen-Button erstellen.

Alle Formularfelder werden später automatisch zu Lead-Datenfeldern. Sie müssen also nichts zusätzlich einstellen.

Wichtig: Das Formular wird erst dann in die Seite übernommen, wenn Sie das auslösen. Klicken Sie dazu auf den „Übernehmen“-Button und bestätigen Sie die Sicherheitsabfrage.

Das Formular ersetzt dann das erste Formular im Quelltext der Seite. Das bedeutet, wenn Sie mehrere Formulare in Ihrer Landingpage verwenden (was Sie nicht tun sollten…), wird immer das erste ersetzt.

9. CSS-Styles wählen / hochladen

Es gibt grundsätzlich zwei Möglichkeiten wie Sie CSS einsetzen können. Entweder Sie erstellen ein eigenes Stylesheet und laden es für die Landingpage hoch oder Sie verwenden ein vorgefertigtes (hier Style geannt).

Der Einfacheit halber lassen wir hier erst mal das Standard-Style eingestellt („grau-blau“). Beim nächsten Update gibt es übrigens bald weitere Styles aus denen Sie wählen können.

10. Landingpage veröffentlichen und ansehen

Haben Sie nun alles zusammen, was Ihrer Landingpage ausmachen soll? Die Texte, das Formular und die Gestaltung? Dann können Sie Ihre Landingpage nun veröffentlichen!

Klicken Sie dazu auf den Button „Veröffentlichen„. Dadurch wird der aktuelle Stand Ihrer Landingpage an den Frontend-Server geschickt und ist ab diesem Moment abrufbar.

lp-live-preview

Wichtig: Achten Sie darauf, dass der Status auf Sichtbar steht, sonst sehen Sie eine Fehlermeldung.

Ab jetzt ist Ihre Landingpage live und Sie können anfangen Leads aufzuzeichnen. Haben Sie noch Fragen oder Anregungen? Wir beantworten diese gerne in den Kommentaren!

4 Gedanken zu “So erstellen Sie Landingpages mit Campaign2 (Tutorial)

  1. Guten Tag,

    können Sie mir bitte in einfachen Worten sagenwas eine Landing Page ist, wie eine solche Page aussieht, wie ich diese zu meinem Nutzen anwenden kann, welcher möglicher Nutzen für mich und meine Kunden daraus resultuieren kannt.
    Ich spreche hier von Zielformulierung.

    Michael Storl
    Dipl.-Wirtschaftsing.(FH)
    08468 Reichenbach
    http://www.storl-unternehmensberatung.de

  2. Hallo Dominik,

    Wie ist es möglich, dass nach dem Sign-up eine Danke-Email verschickt wird, in der z.B. ein weiterer Link auf die Website integriert ist. Ich kann im Menü eine Vorlage für eine solche mail finden und diese auch bearbeiten; bei meinen Tests wird jedoch keine Mail verschickt. Thx 4 help!

    VG
    Felix

  3. Guten Tag, können Sie mir kurz erklären, wie ich Bilder im Liveeditor einfügen kann? Wenn ich den entsprechenden Link einbinde, sehe ich in der Vorschau kein Bild.

    Vielen Dank

Schreibe einen Kommentar

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