3 einfache Wege Landingpage mit WordPress zu erstellen

Möchtest du eine eigene Landingpage auf deiner WordPress-Website erstellen?

Wenn du eine Leadmagneten (Freebies) anbietest, Produkte oder Dienstleistungen verkaufst, dann kann eine Landingpage dir helfen, die Vorteile in Szene zu setzen und hohe Conversion zu erhalten.

In diesem Artikel zeige ich dir, wie du ganz einfach eine Landingpage in WordPress erstellen kannst.

Was ist eine Landingpage?

Eine Landingpage ist kein Blogbeitrag!

Eine Landingpage ist eine einzelne Seite innerhalb deiner WordPress-Website. Diese Seite hat eine einzige Aufgabe – den Besucher zu einer Aktion zu bewegen. Das kann Eintragung in ein Formular, Kauf eines Produktes (eigenes oder fremdes) oder jede andere Aktion sein.

Diese Landingpage wird in Social Media, E-Mails oder bezahlten Anzeigen beworben. Besucher klicken auf den Link und landen zuerst auf dieser Seite. Und das ist auch der Grund, warum sie Landingpage (=Landeseite) genannt wird.

Landingpage ist aus bestimmten aufeinander folgenden Abschnitten aufgebaut, die Verkaufspsychologie nutzen und den Besucher Schritt für Schritt zu einer Aktion führen.

Der Besucher scrollt durch die Landingpage, sieht sich ein Block nach dem anderen an und landet schließlich bei einem Call-to-Action (CTA) Block. Das ist ein Formular oder ein Button. Hier wird die Aktion des Benutzers erwartet, z. B. dass er seine E-Mail-Adresse in ein Formular eingibt oder auf einen Link zum Bestellen des Produktes klickt.

Idealerweise hast du deine Landingpage so aufgebaut, dass der Besucher am Ende tatsächlich die angebotene Aktion ausführt.

Ist Design für Landingpage wichtig?

Die Gestaltung einer Landingpage ist keine Wissenschaft. Wenn du eine WordPress-Website hast, musst du kein Webdesigner sein, um eine saubere und effektive Landingpage schnell und kostenlos zu erstellen.

Es gibt zwar Page Builder und spezielle Plugins, die dir bei der Erstellung einer Landingpage in WordPress helfen können. Wenn du aber nicht gerade jeden Tag mehrere Landingpages erstellst, brauchst du sie alle nicht. Bedenke auch, dass Page Builder wie Elementor oder Divi sich meist negativ auf die Ladezeit deiner Seite auswirken. Die Page Builder NUR wegen ein paar Landingpages zu benutzen gleicht dem berühmten „mit Kanonen auf Spatzen“ schießen.

Eine Landingpage muss keine grafische Meisterleistung sein. Zu viele grafische Inhalte können sogar bei der Vermittlung deiner Botschaft hinderlich sein. Setze auf den minimalistischen Aufbau. Mehr ist weniger. Starte mit einer Mini-Version deiner Landingpage, gehe damit online, analysiere das Verhalten deiner Besucher und optimiere erst hinterher.

Wie du eine Landingpage in WordPress aus Blocks aufbaust

Die einfachste Methode eine Landingpage in WordPress aufzubauen, ist das Nutzen des bereits vorhandenen Block-Editors von WordPress. Dieser Editor heißt Gutenberg und ist in jeder aktuellen WordPress-Installation bereits mitenthalten.

Gutenberg-Editor „splittert“ die Inhalte einer Seite oder eines Blogbeitrags automatisch in einzelne Blöcke: Absätze, Überschriften, Bilder, Listen und so weiter. Damit ist er bereits perfekt dafür geeignet, eine Landingpage aus verschiedenen Blöcken aufzubauen.

Einziger Nachteil liegt daran, dass Gutenberg-Editor nicht genug schöne vordefinierten Blöcke für eine Landingpage bietet, die gut aufeinander abgestimmt sind. Es fehlen unter anderem fertige Hero-Blöcke mit einer großen Überschrift, ein Block mit einem Newsletter-Formular oder eine FAQ-Liste.

Glücklicherweise gibt es viele kostenlose WordPress-Plugins, die zusätzliche vorformatierte Gutenberg-Blöcke und sogar ganze Abschnitte enthalten. Eins davon ist das kostenlose Plugin Kadence Blocks, das Hand in Hand mit dem Kadence Theme arbeitet.

Diese einzigartige Kombi ist sehr stabil und sicher, da sowie das Theme selbst als auch das Plugin vom selben Entwickler-Team stammen. Somit ist beides perfekt aufeinander abgestimmt und erlaubt einen schnellen Aufbau einer Landingpage, die nahtlos in dein Design integriert ist und alle Einstellungen deines Themes berücksichtigt.

Sobald und beides installierst hast, siehst du in deinem WordPress-Editor einen zusätzlichen Button „Design-Bibliothek“.

Wenn du auf diesen Button klickst, dann öffnet sich ein Fenster, in dem du bereits vordefinierten Blöcke auswählen und in deine Seite mit einem Mausklick einfügen kannst.

In Design-Bibliothek findest du zwei Arten von vordefinierten Templates:

• Patterns (einzelne Blöcke, aus dem man bei Bedarf auch sehr lange Landingpages schnell zusammenklicken kann)
• Pages (ein Set aus einzelnen Pattern-Blöcken, die man für eine Startseite oder Über uns Seite verwenden kann).

Pages sind zwar schön und bunt, aber für die Erstellung einer Landingpage nicht wirklich geeignet. Sie sind nur nützlich, wenn du schnell eine kleine Homepage erstellen möchtest. Für den Aufbau von Landingpage benötigst du Patterns.

Patterns sind eine Goldgrube für deine kostenlose Landingpage. Um diese Blöcke zu benutzen, musst du dich zunächst kostenlos bei Kadence registrieren. Keine Angst, das kostet nichts und du verpflichtet dich zu nichts. Danach stehen dir alle kostenlose Blöcke zur Verfügung.

Blöcke, die mit einem „Pro“ markiert sind, kannst du nutzen, wenn du kostenpflichtige Version von Kadence Blocks besitzt. Es gibt aber auch eine schöne Auswahl an kostenlosen Blocks.

Die wichtigsten Blöcke für eine Landingpage

Es gibt mehrere Block-Kategorien, aus denen du Blöcke für deine Landingpage gebrauchen kannst:

• Hero-Block
• Media und Text
• Counter oder Statistik
• Formulare (für CTA)
• Akkordeon (für FAQs)
• Preistabellen
• Referenzen (für Testimonials)
• Titel oder Header

Ein Hero-Block ist am besten für den Einstieg geeignet:

Mindestens drei von diesen Blöcken sind kostenlos. Klicke auf den Block und er wird in deiner Seite hinzugefügt. Lass dich nicht von den bereits vorhandenen Bildern irritieren. Nach dem Einfügen des Blocks kannst du alle Bilder und Hintergründe anpassen oder ersetzen.

Schau dir dieses Beispiel an (der Button ist inaktiv):

Das ist ein kostenloser Block Title/Header 1 aus der Design-Bibliothek mit einem Bild als Hintergrund. Ich habe genau 20 Sekunden benötigt, um diesen Block zu erstellen. Weitere 5 Minuten würde ich für die Anpassung des Textes und Links benötigen.

Auf diese Art und Weise kann ich aus verschiedene Blöcke schnell eine Landingpage in WordPress zusammensetzen.

An diese Stelle fängt meist Qual der Wahl, welche Blöcke benötige ich für eine Landingpage und in welche Reihenfolge. Dafür gibt es keine eindeutigen Rezepte, da jede Landingpage eine eigene Aufgabe hat.

Es wäre schön, wenn es dafür eine Formel gäbe.

Aufbau einer Landingpage nach Formel

Die Planung einer Landingpage kann Stunden rauben, wenn man zu kompliziert denkt. Tatsächlich gibt es viele verschiedene Blöcke und Abschnitte, die man auf einer Landingpage finden kann:

• Hero: ein Block mit einer großen Überschrift und einem Bild im Hintergrund
• Auflistungen: ein Block mit Vorteilen des Produktes oder Referenzen
• FAQ: eine Liste häufig gestellte Fragen und Antworten
• CTA: Call-To-Action-Block mit einem Formular oder einem Bestell-Link.

Welcher Block kommt zuerst? Welcher folgt danach? Die Reihenfolge der Blocks kann nach einem guten alten AIDA-Prinzip aufgebaut werden. AIDA ist die simpelste Marketing-Formel, um den Besucher deiner Seite zu einer Aktion zu bewegen. Wenn du diese Formel anwendest, benötigst du keine komplizierten Anleitungen, um eine überzeugende Landingpage innerhalb von Minuten aufzubauen.

Für jeden Buchstaben in AIDA-Formel hast du in deine Landingpage einen Abschnitt.

A wie Aufmerksamkeit: Überschrift

Ganz oben sicherst du dir die Aufmerksamkeit des Besuchers mit einer starken Überschrift. In einer kleineren Überschrift darunter, verstärkst du deine Aussage, um die Aufmerksamkeit zu erhöhen.

Das ist das Erste, was dein Besucher sieht. Eine möglichst kurze, knackige Zeile in Großschrift, die das ganze auf den Punkt bringt. Dafür benutze ich den Kadence Block Title / Header 2 aus Design-Bibliothek.

Die Aufgabe des Blocks und der Überschrift ist, die Aufmerksamkeit zu erwecken. Vielleicht eine kleine Intrige? Wenn diese Zeile nicht packt, werden viele Besucher abspringen, bevor sie auf der Seite weiterlesen oder scrollen.

Idealerweise liest der Besucher die Überschrift deiner Landingpage und sagt: „Ja, hier bin ich erst mal richtig!“.

I wie Interesse: Bild oder Video

Als Nächstes kommt ein Block mit einem Bild oder Video. Hier wird das Produkt gezeigt. Etwas, was der Besucher bekommt wird, wenn er eine Aktion ausführt.

Das ist der Block, in dem du das Produkt „plastisch“ darstellst. Dafür nutze ich den Kadence Block Image 2, in dem ich Button entferne und Spalten vertausche.

Für ein E-Book würdest du nicht einfach ein Screenshot der Titelseite deines Buches einsetzen, sondern ein 3D-Mockup, das als echtes physisches Buch aussieht. Wenn es sich um ein Video-Kurs handelt, dann fügst du ein Video mit Vorschau der Inhalte ein.

In diesem Abschnitt zeigst du, was der Besucher haben, am liebsten in die Hand nehmen würde, halten, besitzen.

D wie Die Wünsche: Emotionen und Gefühle

An diesem Punkt will der Besucher wissen, ob das Produkt ihm zu seinem Wunschzustand verhelfen kann. Diese Blocks werden oft Features genannt, als Produktmerkmale übersetzt und daher in der Regel missverstanden.

Es geht hier nicht um genauen Produktmerkmale, sondern um die Ergebnisse, die sich mit diesen Merkmalen erzielen lassen. Es geht um den Wunschzustand, der mit dem Produkt erfüllt wird, kurz gesagt um die Transformation.

Für diesen Abschnitt nutze ich den kostenlosen Kadence Block Cards 2.

Am Beispiel eines Online-Kurses geht es nicht darum, wie viele Videostunden der Kurs hat, mit welcher Software darin gearbeitet wird und wie lange der Kurs schon am Markt ist. Wichtig sind die Ergebnisse, die der Kunde erzielt, nach dem er mit dem Kurs fertig ist:

• Der Kurs fesselt von der ersten bis zu letzten Stunde. Kein Platz für Langweile.
• Die Theorie geht nahtlos in die Praxis über. Keine lange Abhandlung ohne Praxisbezug.
• Im Laufe des Kurses kann er seine persönliche, sofort einsatzbereite Lösung erarbeiten.

Der Wunschzustand des Besuchers: schnell und unterhaltsam zu lernen. Er erwartet direkte Umsetzung und praktische Anleitung zu jedem gesagten Wort. Er wünscht sich, dass eine fertige, individuelle Lösung bereits während des Kurses entsteht.

In diesem Block beschreibst du nicht die Kursmerkmale, sondern das Endergebnis des Kurses für den Käufer.

A wie Aktion: Call to Action (CTA) Block

Nun kommt der letzte Block, sogenannter Call-To-Action. Hier geht es um Aktion. Der Besucher soll sich in Newsletter eintragen, etwas kaufen oder abonnieren.

Das ist der Kadence-Block Video 3. Du kannst das Video logischerweise durch ein Bild oder eigenes Video ersetzen.

In diesem Block führt der Besucher, die von dir gewünschte Aktion. Wie oben bereits erwähnt, ist es ein Formular, in dem er seine E-Mail-Adresse einträgt oder ein Link zum Bestellformular des Produktes oder eine Einladung zum kostenlosen Webinar.

Und so sieht es dann zusammengeklickt aus:

Das ist der simpelste Aufbau einer Landingpage.

Natürlich gibt es noch weitere Blockarten, die in einer Landingpage benutzt werden können. Glücklicherweise musst du dir nichts ausdenken.

Weitere Ideen stehen in der Design-Bibliothek von Kadence unter verschiedenen Kategorien bereit.

Welche Blöcke kann man in Landingpages nutzen?

Das hängt davon ab, was du mit der Landingpage bewirbst.

In der Kadence Design-Bibliothek findest du:

• Blöcke mit Formularen
• Testimonials (Social-Proof oder was die Kunden sagen)
• Bildergalerien
• Aufzählungen für Vorteile oder Produktmerkmale
• Verschiedene Textblöcke
• Countdowns und Statistik
• Preistabellen
• Auflistungen
• FAQs
• uvm.

Der Vorteil von allen Kadence-Blocks ist, dass diese nur minimale Formatierung enthalten und die Einstellungen von deinem Theme, wie Farbpalette, Schriftarten und Größen übernehmen. So hast du einheitliches Design, deine Landingpage wirkt professionell, sauber und gut strukturiert aus.

Welcher Blöcke du letztlich nutzt, hängt davon ab, welches Produkt oder Dienstleistung du mit deiner Landingpage bewirbst. Für ein kostenloses Produkt (ein sogenanntes Freebie) benötigst du 2 bis 3 Blöcke. Für den Kauf eines Produktes müssen es höchstwahrscheinlich deutlich mehr Blöcke rein, um den Kunden zu überzeugen.

Praxis: 7-Minuten Landingpage mit WordPress

So viel zu Theorie. Und jetzt kommt die Praxis.

Die Landingpage im Beispiel habe ich im WordPress mit der kostenlosen Version von Kadence Theme und ebenfalls kostenlose Version von Kadence Blocks Plugin erstellt.

Das Video-Tutorial zeigt es Schritt für Schritt:

Optional kannst du noch das kostenlose Plugin Instant Images installieren, um die Suche nach einem passenden Hintergrundbild zu beschleunigen. Dieses Plugin hilft auch, dich nur auf den Aufbau deiner Landingpage mit WordPress zu konzentrieren und dich nicht von der Bildsuche abzulenken.

Anfänger-Tipps für Landingpages

Bevor du loslegst, habe ich noch ein paar Tipps, die dir Zeit und Nerven sparen werden:

• Halte deine Landingpage einfach. Verfolge eine klare Struktur.
• Sei minimalistisch im Design. Nutze 1 bis 2 Schriftarten, 3 bis 4 Schriftgrößen und 2 bis 3 Farben.
• Verwende Bilder „zum Anfassen“ (Mockups!) oder Bilder, die den Wunschzustand des Besuchers darstellen.
• Achte darauf, dass dein Aufruf zum Handeln am Ende klar und deutlich ist.
• Wenn du mehrere Blöcke hast, dann nutze das Zebra-Prinzip, bei dem nach einem Block mit dem dunklen Hintergrund ein Block mit dem hellen Hintergrund folgt.

Zusammengefasst: mach es nicht zu kompliziert. Halte deine Texte einfach, Design sauber und nicht überladen und die Struktur als roten Faden stets im Kopf.

Du überzeugst mit Inhalt und nicht mit möglichst vielen poppigen beweglichen Elementen, Countdowns, sich drehenden Buttons usw. Einige Besucher kannst du sogar mit tänzelnden Buttons vor eine Aktion abhalten, weil es unseriös wirken kann.

Wie kommt der Benutzer auf die Landingpage?

Wie findet nun der Benutzer die Landingpage auf deiner Seite? Du kannst diese Seite auf unterschiedliche Arten bewerben:

• mit einem Menü-Eintrag oder mit einem Button in deiner Navigation
• mit einem Banner in der Sidebar
• mit einem Promo-Block unter einem Artikel oder Blogbeitrag
• in einem Social-Media-Beitrag als direkten Link auf deine Landingpage
• mit der bezahlten Werbung in Suchmaschinen oder Social-Media

Fazit: Landingpage ist keine Wissenschaft

Du benötigst keine langen Abhandlungen und spezielle Plugins oder kostspielige Tools, um eine optisch ansprechende Landingpage mit WordPress zu erstellen. Die vorgestellte Methode kannst du natürlich auch mit anderen WordPress-Themes oder Plugins verwenden.

Vom Gebrauch von Page Builder wie Elementor oder Divi rate ich aber ab, wenn die Erstellung von Landingpages nicht zu deiner häufigen Aufgaben gehört.