von ConstanzeStraub | Jan. 14, 2025 | Anleitungen, WordPress
In 5 Schritten Newsletter in WordPress integrieren, mit Divi
Kommt dir das bekannt vor:
Du möchtest einen Newsletter einrichten. Und die Technik bringt dich um den Verstand…
Ich kann dich beruhigen: Das Ganze ist einfacher, als du denkst.
Mein Problem bei der Einbindung des Anmeldeformulars war immer die Optik. Die meisten Formular sehen einfach grottig aus oder sind nur rudimentär an das Corporate Design anzupassen.
Warum mir das Design wichtig ist?
Bestimmt weißt du, dass nicht nur die Funktion, sondern dass auch eine gute Gestaltung des Newsletter-Formulars für Vertrauen sorgen kann. Und mehr Vertrauen heißt: mehr Kontakte.
Bei ActiveCampaign kann man Eingabefelder und Buttons zwar minimal gestalten – trotzdem kannst du das Formular kaum an deinen Look anpassen.
Ich hab‘s versucht: Es sah einfach schlimm aus.
Wie gut, dass uns Divi entgegenkommt.
Du brauchst nicht einmal ein Plugin. ActiveCampaign (und wahrscheinlich auch andere Anbieter) bringt zwar ein Plugin mit – doch das ist völlig unnötig. Denn Divi bietet ein Optin-Modul, mit dem du dein Formular wie gewohnt wunderbar gestalten kannst. Und das ist aus mehrfacher Hinsicht super: Denn je weniger Plugins du in deiner WordPress-Website hast, desto besser die Performance.
Mit dem Opt-in-Modul bist du flexibel, das Formular ist leicht anpassbar, rechtlich korrekt und schick obendrein.
Und so sieht mein Formular aus:

Das bekommst du auch hin. Versprochen.
Bevor du beginnst: Technik ist der letzte Schritt. Entscheidend ist, dass der Newsletter in dein Website-Konzept eingebettet ist. Welche 9 Punkte mir für eine Website Konzept wichtig sind, das habe ich hier ausführlich beschrieben:
Doch legen wir los:
Schritt 1: Voraussetzungen für die Newsletter-Integration
Ich arbeite mit ActiveCampaign. Logisch, dass ich ActiveCampaign als Beispiel nutze. Falls du Brevo oder andere Newsletter-Anbieter nutzt: Die Vorgehensweise ist ähnlich bis genauso.
Hier nur der Vollständigkeit halber einige andere Dienste:
Brevo, MailChimp, ClipTip, Convert Pro, AWeber, CleverReach, GetResponse.
Es gibt noch einige mehr und sie sind auch im Divi-Optin-Modul gelistet.
Jedes der oben genannten Tools hat seine Stärken und Schwächen. Getestet habe ich Brevo (hieß damals Sendinblue), das ich auch für Kundinnen eingerichtet habe. Außerdem Convert Pro und ActiveCampaign.
Einfach ausprobieren.
Brevo und ActiveCampaign kann ich uneingeschränkt empfehlen.
Ja, setz mich auf die Warteliste von Website Wunder. Sobald es losgeht, werde ich informiert.
Mit der Anmeldung bekommst du meinen WordPress-Newsletter, vollgepackt mit hilfreichen Tipps rund um deine neue Website. Du kannst den Newsletter jederzeit abmelden. Versprochen. Details findest du in meiner Datenschutzerklärung.
Schritt 2: Kontakt-Liste und Formular anlegen.
Die folgenden Todos sind wichtig, weil du sie für die Einrichtung des Opt-in-Modul brauchst.
Also legen wir los:
- Du wählst einen Newsletter-Dienst und legst dort einen Account an.
- Dort erstellst du eine Liste für deine (späteren) Kontakte und
- du baust dein Formularfeld.
- Außerdem brauchst du die API-Daten (kannst du auch später kopieren).
Ich nenne meine 1. Liste „Hauptliste“.
Wie alles im Einzelnen konkret geht in ActiveCampaign – das schreibe ich in einem späteren Artikel.
Was brauchst du außerdem?
Zusätzlich überlegst du dir, was nach dem Absenden des Formulars passieren soll. Entsprechend solltest du nämlich noch weitere Arbeiten machen:
- Erfolgsmeldung oder Weiterleitung zu einer separaten Seite.
- Bei Bedarf: Danke-Seite nach Bestätigung der Mail.
Schritt 3: Erfolgsmeldung vs. Fortschritts-Seite
Was passiert, wenn der neue Kontakt auf den Senden-Button geklickt hat?
Richtig. Der Kontakt muss einen Hinweis erhalten, dass er noch eine Mail bestätigen muss (kennst du bestimmt, nur das ist DSGVO-konform).
Erst mit der Bestätigung der Mail wird der neue Kontakt als aktiver Lead in deiner Liste geführt (und erhält später deine Newsletter). Und, wichtig: Diese Bestätigung der Mail ist Teil des Double-Opt-in-Verfahrens, das von der DSGVO für eine Adressspeicherung gefordert wird.
Was macht nun das Opt-in-Modul, wenn der Kontakt auf den Absenden-Button geklickt hat?
Das Optin-Modul von Divi bietet 2 Möglichkeiten, wie der neue Kontakt informiert wird
- Möglichkeit: Divi gibt eine Erfolgsmeldung in Schriftform aus (die du inhaltlich anpassen kannst)
- Möglichkeit: Du kannst nach dem Absenden des Formulars auf eine externe Seite umleiten lassen.
Die Erfolgsmeldung (Möglichkeit 1) finde ich ungünstig, da der neue Kontakt verwirrt werden kann. Außerdem: Auf einer zusätzlichen Seite hast du mehr Gestaltungsmöglichkeiten und mehr Platz für eine ausführliche Information.
Weiter unten gehe ich näher auf dieses Thema ein.
Schritt 4: ActiveCampaign über das Opt-In-Modul einrichten
Kommen wir zum eigentlichen Punkt:
Das Opt-in-Modul von Divi einrichten, gestalten und mit ActiveCampaign verbinden:
Du fügst an beliebiger Stelle deiner Seite das Opt-in-Modul ein. Es lässt sich genauso bearbeiten, wie alle anderen Module, die du bereits kennst und ist ähnlich aufgebaut wie das Kontaktformular. Mit dem Unterschied: Hier trägst du die Daten von ActiveCampaign ein. Denn nur so werden die vom neuen Kontakt eingetippten Daten an ActiveCampaign übertragen.
Und das geht so:
Du öffnest deine Seite, auf der das Formular stehen soll (entweder im Gridmodus oder mit dem Visual Builder).
Zeile einfügen (falls gewünscht)
Optin-Modul einfügen.
Nun hast du zwei Möglichkeiten zur weiteren Gestaltung:
Du kannst die zusätzlichen Texte zur Newsletteranmeldung mit einem zusätzlichen Text-Modul einfügen. Damit hast du größere Gestaltungsfreiheit. Also Sachen wie: „Hole dir hier mein tolles Freebie und werde Teil meiner Liste“ oder so, nur ein Beispiel.
Das brauchst du aber nicht, Denn das Opt-in-Modul bringt alles mit, was du für ein sinnvolles Anmeldeformular brauchst: Titel, Beschreibung, Fußzeile.
Ich zeige dir hier, wie ich das gemacht habe:
- Optin-Modul zum Bearbeiten öffnen.
- Im ersten Reiter unter „Inhalt“ wie gewohnt die Inhalte einsetzen.
- Unter „Titel“ trägst du deine Überschrift ein. Bei mir steht als Titel der Name des Freebies.
- Darunter kommt schon der Button. Hier gibst du einen aussagekräftigen Text ein. Also bitte nicht „Zum Newsletter anmelden“ oder schlimmer: „Senden“. Sondern du wiederholst kreativ das, was der neue Kontakt möchte.
Bei mir steht: „Her mit dem Fahrplan“.
- Unter dem Button hast du ein Textfeld. Wird „Body“ genannt. Hier habe ich eine Erklärung geschrieben, was das Freebie bietet.
- Darunter befindet sich ein weiterer Texteditor. Die „Fußzeile“. Was du hier eingibst, erscheint im Formularfeld unter dem Button. Bei mir steht ein Hinweis, dass der Kontakt mit dem Fahrplan ein Newsletter erhält. Das ist ein wichtiger Zusatz.
Schau dir einfach das Bild ganz oben an.
Und so sieht das Opt-in-Modul von innen unter „Einstellungen“ aus:

Newsletter-Dienst mit deiner Website verbinden
Nun kommt das Wichtigste: Die Verbindung zum Newsletter-Tool.
Im Optin-Modul findest du das innerhalb der Option E-Mail-Account. (Das ist der Button unter dem Text-Button).
Diesen Button öffnen.
Dort findest du zwei Eingabefelder:
Serviceanbieter und
Liste

Meistens ist dort schon der Mailanbieter MailChimp vorausgewählt. Deshalb steht unter „Serviceanbieter“ MailChimp und über dem Listen-Feld darunter steht „MailChimp Liste“ und im Feld selber „Wählen Sie eine Liste“.
Im ersten Feld klickst du rein. Dir wird eine lange Liste mit Newsletter-Diensten angezeigt. Angefangen mit ActiveCampaign. Logisch, was du nun machst: Du wählst deinen Dienst aus. Wenn du mit Brevo arbeitest, wählst du „SendinBlue“ (weil das früher so hieß).
Ich habe natürlich „ActiveCampaign“ gewählt.


Danach werden im Feld darunter deine Listen angezeigt, die du in ActiveCampaign (resp. deinem Dienst) angelegt hast. Wenn du wie ich mehrere Listen hast, wählst du deine bevorzugte Liste aus.
Du klickst auf „Hinzufügen“.
Wenn du ActiveCampaign gewählt hast, werden dir nach der Auswahl von ActiveCampaign vier Eingabe-Felder angezeigt (bei anderen Anbietern können die Felder abweichen). Du siehst die Felder im Bild unten.
Hier sind es:
- Account-Name
- API Key
- API URL
- Form ID

Was erstmal kompliziert klingt, ist kinderleicht:
Account-Name
Der Accountname ist der, mit dem du dich bei ActiveCampaign anmeldest. Bei mir: meinbenutzer.activehosted.com (meinbenutzer ist natürlich der jeweilige Nutzername).
API-Key und API URL
API Key (API-Schlüssel) und API URL findest du in ActiveCampaign unter:
Einstellungen > Entwickler
Dort kopierst du die Daten einfach raus und setzt sie in den Feldern des Opt-in-Moduls ein.
Form ID
Die Form ID ist die ID, die jedes Formular in ActiveCapaign nach der Erstellung automatisch erhält. Mein Formular hat die ID 9, weil ich schon einige Formulare versucht hatte ;-). Also muss ich dort im Feld unter Form ID einfach die 9 einsetzen. So easy.
Wichtig: Zum Schluß den Button „Senden“ klicken. Das war es schon, damit ist die Verbindung zu AC hergestellt.
Deine Kontakte können sich nun anmelden.
Aber das ist ja nicht alles.
Du erinnerst dich an das, was ich oben geschrieben hab? Irgendwie muss der neue Kontakt noch einen Hinweis lesen, dass er noch eine Mail erhält, die er erst bestätigen muss.
Dafür gibt es wie oben erwähnt im Optin-Modul zwei Möglichkeiten.
Mit dem Button „Sektion“ kannst du die beiden Möglichkeiten auswählen.
Captcha anzeigen und
Redirect-URL

Möglichkeit 1: Erfolgsmeldung direkt auf der Formular-Seite
Wenn du die erste Möglichkeit wählst – Captcha anzeigen – dann siehst du darunter das Feld > Nachricht. Darin steht in grauer Schrift: „Erfolgsmeldung“. Hier kannst du dein Erfolgsmeldung eintippen.
Also zum Beispiel: „Danke für deine Anmeldung. Schau bitte in deinem Postfach. Du erhältst eine Mail, in der du auf den Link klicken musst zum Bestätigen.“
Oder so. Geschmacksache.
Dieser Hinweis erscheint direkt auf der Seite, auf der auch das Formular steht (stand, nach dem Absenden ist das Formular nicht mehr zu sehen.
Ich finde das nicht so geschickt. Weil der Hinweis dort schnell übersehen werden kann.
Mir ist eine separate Seite lieber, die sich nach dem Absenden des Formulars in einem neuen Browserfenster öffnet. So eine Seite ist klarer, die kann nicht so schnell verschwinden wie ein Hinweis direkt auf der Formularseite.
Wieso verschwinden?
Wenn die Seite neu geladen wird, ist der Hinweistext weg. Dann steht dort wieder das Formular. Das kann mit einer separaten Seite nicht passieren. Und du hast mehr gestalterische und inhaltliche Möglichkeiten.
Ich bin also für Möglichkeit 2. Und die geht so:
Möglichkeit 2: Umleitung zu einer Fast-geschafft-Seite
Du bist noch in den Einstellungen des Optin-Moduls. Und beim Button „Sektion“.

Nun wählst du statt „Captcha“ – logisch: Redirect-URL.
Dann erscheint unter dem Feld „Sektion“ ein Feld mit der Beschriftung „Redirect-URL“. Hier trägst du die URL deiner Seite ein, die du für diesen Zweck erstellt hast.
Meine Seite heißt hier im Beispiel: https://constanzestraub.de/fast-geschafft.
Das war‘s.
Schritt 5: Felder und Inhalte im Divi-Opt-in-Modul gestalten
Das ganze Formular kannst du natürlich noch gestalten.
Solltest du sogar. Denn nur mit einer professionellen Gestaltung weckst du Vertrauen. Was die Chance erhöht, dass du viel Anmeldungen erhältst.
Und das geht so:
Felder anpassen
Das Formular enthält standardmäßig das Feld E-Mail-Adresse, du kannst aber weitere Felder hinzufügen oder anpassen.
Unter dem Button „Felder“ findest du bereits die Felder Vorname und Nachname.
Felder gestalten:
Hierzu gehst du in den Bereich „Design“ oben in den Reitern. Dort unter „Felder“ kannst du beliebig anpassen (Hintergrundfarbe, Rand, Rundung, Schriftfarbe etc.)
Button gestalten
Der Button ist ein entscheidendes Element deines Formulars. Er sollte auffällig und motivierend gestaltet sein.
Gehe zu Design > Button:
Du kannst die globalen Button-Einstellungen übernehmen oder den Button individuell anpassen. So, wie du es aus den anderen Modulen kennst.
Text und Überschriften gestalten
Dasselbe kannst du mit den Texten machen: Schriftgröße ändern, Schriftart, Schriftfarbe usw.
Erfolgsmeldung und Weiterleitung
Wenn du lieber mit einer Erfolgsmeldung direkt auf der Formularseite arbeitest (statt mit einer Weiterleitung auf eine separate Seite), dann kannst du auch diesen Text gestalten. Dafür gibt es unter > Design ebenfalls einen Button mit Einstellungsmöglichkeiten.
Das war’s schon.
War doch garnicht schwer, oder?
Zum Schluß solltest du das Formular auf mobilen Geräten prüfen. Aber auch hier kann der Visual Builder toll helfen.
von ConstanzeStraub | Juni 8, 2024 | Anleitungen
Newsletter erstellen mit Brevo – lohnt sich das überhaupt für dich?
Ich geb’s zu, das klingt jetzt etwas gemein. Ist aber nicht so gemeint. Die Frage ist vielmehr wichtig und strategisch gedacht. Vielleicht wird meine nächste Frage etwas klarer:
Möchtest du nur ein Formular einbauen – oder möchtest du ein funktionierendes E-Mail-Marketing-System aufbauen?
Denn ein Newsletter ist kein Tool-Thema.
Er ist ein strategisches Instrument.
Brevo ist technisch schnell eingerichtet. Aber entscheidend ist:
Welche Rolle spielt dein Newsletter in deiner gesamten Website-Strategie? Übrigens klärst du diese Frage sehr gut, wenn du vor ein Website Konzept erstellst. Warum das Konzept so wichtig ist und welchen Vorteil du davon hast, das habe ich hier ausführlich erklärt:
Was passiert nach der Anmeldung?
Wie baust du Vertrauen auf – nicht nur eine Liste?
Diese Anleitung zeigt dir die technische Einrichtung in 7 Schritten. Gleichzeitig zeige ich dir, worauf es strategisch ankommt.
Formular bauen, Optin-Mail schreiben und Automation einrichten – mit Brevo in nur 7 Schritten
Du möchtest mit E-Mail-Marketing loslegen und einen Newsletter erstellen? Am besten eine Automation, damit du möglichst wenig Arbeit hast?
Oder du möchtest deinen Newsletter-Dienst wechseln – bist aber mit der Technik überfordert.
Dann bist du hier richtig. Mit dieser Anleitung zeige ich dir, wie du dein E-Mail Marketing mit dem Newsletter-Dienst Brevo einrichtest (ehemals Sendinblue und davor Newsletter2Go).
Newsletter erstellen und mit E-Mail Marketing loslegen für mehr Kunden
Was ist ein Newsletter?
Ein Newsletter ist eine E-Mail, die du regelmäßig an Kunden oder Kontakte schickst. Diese Mails sind Teil deiner gesamten Marketingstrategie. Konkret: dein E-Mail Marketing. Damit die Leute deinen Newsletter überhaupt erhalten, müssen sie vorher ihre Mailadresse bei dir lassen.
Die Idee hinter einem Newsletter ist, Adressen in einer Liste zu sammeln. Oder im Marketing-Schnack: Mit einem E-Mail Marketing möchtest du langfristige Kundenbeziehungen aufbauen. Diese Kontaktliste ist dein Schatz.
Darum empfehle ich Brevo als Newsletter-Dienst
Brevo hab ich letztes Jahr (2023) für eine Kundin eingerichtet. Damals hieß es noch Sendinblue. Ich fand das Tool damals schon übersichtlich und intuitiv zu bedienen. Anfang 2024 hab ich dort einer anderen Kundin den Newsletter aufgebaut. Ich war erstaunt: Die Ansicht ist noch intuitiver, noch einfacher geworden.
Der Aufbau und die Gestaltung der E-Mails und die Automationen gehen simpel per Drag and Drop. Andere Newsletter-Dienste (wie ActiveCampaign, das nutze ich), sind längst nicht so einfach und intuitiv. Ein weiterer Vorteil von Brevo: Dieser Dienst ist im Vergleich zu anderen Anbietern kostengünstig und hat einen Free-Tarif (den hat ActiveCampaign nicht).
Falls du jetzt die Frage stellst: Gehts nicht auch mit einfachen E-Mail-Programmen? Nee. E-Mail Marketing ist mit „normalen” E-Mail-Programmen wie Outlook, Gmail, Thunderbird oder Mail nicht möglich. Du brauchst eine Newsletter-Software, die dir den automatisierten Versand der Newsletter abnimmt.
Mit dieser Anleitung hast du die Grundlagen für ein E-Mail-Marketing unter Dach und Fach.
Was brauchst du für dein E-Mail-Marketing?
1. Du braucht eine Website:
Die Website brauchst du, um dort dein Anmeldeformular einzubetten. Außerdem eine „Fast-geschafft-Seite“ und eine „Danke-Seite“ (dazu sag ich noch was).
Was auch geht: Eine einzelne Landingpage für die Newsletter-Anmeldung. Kannst du sogar bei Brevo einrichten.
Meine Meinung: Ich bin eine Freundin von Unabhängigkeit. Mit deiner eigenen Website bist du autark und kannst besser kontrollieren, wie du deine Kontakte begrüßt. Außerdem: Mit einer Website kannst du eine Fast-geschafft-Seite und eine Danke-Seite einrichten. Mit der Fast-geschafft-Seite erhält der Kontakt die Info, dass eine Mail folgt. Und mit der Danke-Seite erfährt der neue Kontakt, dass die Anmeldung erfolgreich war.
Theoretisch kannst du die Erfolgsmeldung auch nur als Mail versenden. Doch Mails können im Spam landen (oder garnicht erst ankommen…).
2. Du brauchst einen Newsletter-Dienst
Du brauchst einen Dienst wie Mailchimp, ConvertKit, Active Campaign oder eben Brevo. Hier befindet sich deine Kontaktdatenbank mit den Mailadressen deiner Follower, die deinen Newsletter bestellen. Außerdem, ganz wichtig: Vom Anbieter bekommst du den Code-Schnipsel für das Anmeldeformular, das du in der Website einbindest.
Diese 7 Schritte brauchst du für dein E-Mail-Marketing
- 1. Schritt : Mache eine Strategie und zeichne einen Plan für die Automation
- 2. Schritt: Wenn du eine Website hast: Lege eine Fast-geschafft und eine Danke-Seite an
- 3. Schritt: Richte einen Account in Brevo ein
- 4. Schritt: Nenne deine Kontakt-Liste und den Ordner in um und importiere Kontakte
- 5. Schritt: So richtest du die Optin- und die Begrüßungsmail ein
- 6. Schritt: Newsletter-Formular bauen und mit Mails und URLs verbinden
- 7. Schritt: So bindest du das Formularfeld in deine Webseite ein
Moment noch: Ein wichtiger Punkt, den viele unterschätzen
Viele denken:
„Wenn das Formular steht, läuft der Newsletter von allein.“
Das stimmt nicht.
Ein Newsletter funktioniert nur dann, wenn:
- deine Website klar positioniert ist,
- dein Angebot verständlich ist,
- dein Freebie zum Angebot passt,
- deine E-Mails auf ein konkretes Ziel einzahlen.
- Sonst sammelst du Kontakte – aber keine Kunden.
Brevo ist die Technik.
Möchtest du Menschen in deine Welt holen, dann brauchst du zuerst eine klare Positionierung.
Bevor du mit der Technik in Brevo beginnst:
Wenn du gerade erst deine Website aufbaust oder dein Angebot noch unscharf ist, dann lohnt es sich, zuerst die Struktur und Strategie der Website zu klären (im Blogartikel liest, was du machen kannst).
Ein Newsletter verstärkt immer das, was bereits da ist. Ist die Grundlage unklar, verstärkst du Unklarheit.
Natürlich kannst dir auch dabei helfen lassen. Dafür biete ich immer noch meinen Website Sprint an – in 4 Stunden deine Startseite (oder eben deinen Newsletter oder irgendeine andere Seite deiner Website).
1. Schritt
Einen Plan für die Automation erstellen
Stell dir die Fragen:
- Wie soll meine Automation aussehen?
- Was passiert, wenn ein Mensch dein Newsletter bestellt hat?
- Was soll der neue Kontakt als nächtes sehen?
- Was soll in den Mails stehen, die der Kontakt zur Begrüßung bekommt?
Diesen Plan skizzierst du am besten auf einem Blatt Papier. Mir hilft das, die Übersicht zu behalten. Vergiß auch nicht die Bestätigungsseiten auf deiner Website: Ich mache es immer so, dass ich auf meiner Website eine Fast-geschafft-Seite und eine Danke-Seite anlege.
Die Automation sieht also so aus:
- Eine Person (nennen wir sie „Anna“), füllt das Formularfeld aus und klickt auf „Senden“.
- Daraufhin öffnet sich in ihrem Browser eine Seite deiner Website. Anna liest darin, dass sie eine Mail erhält, die sie noch bestätigen muss
- Anna sieht in ihrem Postfach eine Optin-Mail und klickt auf den Bestätigungs-Button
- Im Browser von Anna öffnet sich eine neue Seite deiner Website. Hier wird sie darüber informiert, dass die Anmeldung geklappt hat.
- Zum Schluß findet Anna eine 1. Begrüßungsmail in ihrem Postfach. Hier könnte ein Link zu deinem Freebie enthalten sein (oder das Freebie ist als Anhang in der Mail). Anna freut sich, weil sie jetzt eine erste Mail von dir bekommen hat.
2. Schritt
Fast-geschafft- und Danke-Seite erstellen
Ich empfehle dir, mit der Fast-geschafft-Seite und der Danke-Seite zu beginnen. Diese beiden Seiten sind simpel, denn sie brauchen keine besondere Gestaltung. Nur kurz ein paar Hinweise. Fertig.
3. Schritt
Account einrichten in Brevo
Das ist der einfachste Schritt (kennst du bestimmt von anderen Anmeldungen):
- Öffne die Website von Brevo.
- Oben rechts ist der grüne Button: Kostenlos beitreten.
- Im neuen Fenster trägst du deine Mailadresse und ein beliebiges Passwort ein,
- dann wird dir eine Bestätigungsmail an deine Mail-Adressse geschickt.
- Öffne dein Mailprogramm und schau nach der E-Mail von Brevo,
- auf den Button klicken „Meine E-Mailadresse bestätigen“ (Registrierung abschließen),
- im verlinkten Browserfenster die Felder ausfüllen (Name und Angaben zum Unternehmen),
- dann wirst du zur Paket-Auswahl geführt.
- Einen Tarif auswählen.
- Fertig

4. Schritt
Liste und Ordner umbenennen
Die Oberfläche von Brevo ist sehr übersichtlich und gut strukturiert. Wenn du dich eingeloggt hast, findest du links das vertikale Hauptmenü mit allen wichtigen Punkten, die für deine Arbeit mit den Newslettern wichtig sind. Und auf der rechten Seite findest du deine Arbeitsflächen bzw. die jeweiligen Übersichten. Die Punkte in der Hauptnavigation sind:
- Startseite
- Kontakte
- Kampagnen
- Automatisierungen
- Transaktional
- Conversations
- Deals
- Meetings
- Anrufe
Wenn du auf diese Menüpunkte klickst, öffnen sich Untermenüs. Deine Listen findest du im Untermenü von „Kontakte“. Dein nächster Schritt: Du gehst zum Menüpunkt „Kontakte“. Wenn du dort klickst, passiert folgendes: Das Menü erweitert sich unter dem Punkt Kontakte nach unten. Nun steht unter dem Menüpunkt Kontakte dieses Untermenü:
- Listen
- Segmente
- Landing Pages
- Formulare
- Einstellungen
Auf der rechten Seite findest du – tata – deine Kontaktdatenbank. Wenn du neu bist, findest du hier deine eigene E-Mailadresse.
So findest du Listen und Ordner
Du klickst im Menü auf „Listen“. Nun steht auf der rechten Seite (neben dem Menü) deine erste Liste.
Falls du dich über diese Liste wunderst (du hast doch nix gemacht…): Das macht Brevo automatisch bei der Anmeldung. In dieser ersten Liste liegt deine eigene E-Mailadresse. Außerdem findest du bereits einen Ordner.
Deine Kontakte liegen immer in einer Liste und die Listen wiederum in einem Ordner.
Diese erste Liste nennt Brevo „Deine erste Liste“ und den Ordner „Dein erster Ordner“. Naja, diese Namen sind echt nichtsagend. Deshalb würde ich sie ändern und aussagekräftige Namen vergeben. Zumal du später bestimmt mehrere Listen und Ordner hast. Leg dir eine Liste an, in der ALLE Kontakte sind. Ich nenne meine Liste „Hauptliste“.

Und so änderst du die Namen der Listen
- Wenn du das Untermenü von Kontakte geöffnet hast, klickst du auf > Listen
- ganz rechts in der Tabelle mit der Liste findest du die Spalte „Aktionen“
- in dieser Spalte auf die 3 Punkte hinter der Zeile mit der Liste klicken.
- es öffnet sich ein Kontextfenster,
- hier auf auf „Umbenennen“ klicken.
So änderst du den Namen der Ordner
- Oben links steht ein Auswahlfeld.
- Hier kannst du deine Ordner auswählen.
- Du wählst den Ordner aus: „Dein erster Ordner“
- Nun stehen rechts neben dem Auswahlfeld die Optionen „Ordner bearbeiten“ und „Ordner löschen“.
- Auf „Ordner bearbeiten“ klicken (okay, war jetzt logisch…), um dein Newsletter Marketing zu strukturieren.
- Im Kontextfenster „Ordner umbenennen“ wählen.
- Alternativ auf „Aktionen“ und die 3 Punkte klicken (wie bei den Listen).
5. Schritt
Opt-In-Mail und Begrüßungsmail einrichten
Tipp: Warum du zuerst die E-Mail-Vorlage einrichtest
Der Grund ist derselbe, warum ich zuerst die Fast-geschafft- und die Danke-Seite einrichte: Strategie und Arbeitsteilung. Denn das ist so: Während du das Formular aufbaust, wirst du aufgefordert, E-Mailvorlagen auszuwählen (und URLs deiner Website, dazu später mehr). Hättest du deine Mails (und Seiten) noch nicht fertig, müsstest du jedesmal die Arbeit am Formular abbrechen. Nun sind also erstmal die E-Mails dran. Diese sind
- die Optin-E-Mail
- die Begrüßungsmail.
Die Optin-Mail
Die Optin-Mail ist gesetzlich zwingend vorgegeben (DSGVO). Und natürlich möchtest du deinen Newsletter datenschutzkonform einrichten. Deshalb musst du das sogenannte Optin-Verfahren anwenden. Heißt: Wenn Anna deinen Newsletter abonniert hat, bekommt sie eine E-Mail, mit der sie die Anmeldung bestätigen soll. Nur mit dieser wichtigen Bestätigung wird Anna verbindlich und datenschutzkonform in deine Liste eingetragen.
Die Begrüßungsmail
Die Begrüßungsmail ist freiwillig – aus meiner Sicht aber ein unbedingtes Muss. Denn du möchtest zu Anna Vertrauen und eine Beziehung aufbauen. Mit der Begrüßungsmail sagst du Anna vor allem drei wichtige Punkte:
- Die Anmeldung war erfolgreich
- Sie ist nun in deiner Liste und
- Sie findet hier (oder mit einem Link) dein kostenloses Angebot und Infos zu dir.
Opt-In-E-Mail schreiben und gestalten
Für die Optin E-Mail gibt es eine fertige Vorlage in Brevo. Die kannst du natürlich nutzen und anpassen, dann sparst du diesen Schritt. Aber: Ich find sie blöd. Denn die fertige Vorlage läßt sich nur schwer umbauen. Wenn du – als Beispiel – die Farbe des Buttons ändern möchtest, geht das nur umständlich. Ich hab’s sogar fertig gebracht, bei der Umgestaltung den Link zu zerschießen. Deshalb lege ich lieber mein eigenes Template an.
Also: Auch wenn du das fertige Optin nimmst: Lies die Anleitung trotzdem durch, denn sie ist gleichzeitig die Anleitung für jede andere E-Mail-Vorlage.
So richtest du Mail-Vorlagen ein (und die Optin-Mail)
- Du klickst auf den Menüpunkt > Kampagnen (im vertikalen Hauptmenü)
- Es öffnet sich ein weiteres vertikales Untermenü (E-Mail, SMS, WhatsApp, Web-Push, Facebook Ads, Vorlagen, Statistiken, Einstellungen).
- Du klickst auf den Punkt > Vorlagen
- Auf der rechten Seite steht nun eine Liste mit Standart-Templates
- Du klickst auf „Template erstellen“ (rechts oben, der schwarze Button)
- Es öffnet sich das Fenster: „Welches Template möchtest du erstellen?“
- Hier wählst du E-Mail-Template (der linke Button)

1) Einstellungen der OptIn-E-Mail
Bevor du texten kannst, wirst du zunächst zu den primären Einstellungen geführt. Hier vergibst du deiner neuen Vorlage einen Namen (der ist nur für dich). Außerdem solltest du der E-Mail einen aussagekräftiges Betreff geben. Damit die Empfängerin weiß, worum es in der Mail geht.
Die 1. Einstellungen:
Name der Vorlage > Optin Email (oder ähnlich, sollte für dich nur klar sein)
Betreffzeile > Bitte bestätige deine Anmeldung (oder ähnlich)
Preheader
Was ist der Preheader? Das ist die Voransicht des E-Mailinhalts. Manche Mailprogramme stellen den Mailinhalt in einer Voransicht unter der Betreffzeile dar. Falls du hier einen eigenen Text definieren möchtest, kannst du den Preheader mit Text füllen. Beim Optin find ich‘s nicht nötig.

Erweiterte Optionen kannst du für die Optin-E-Mail ignorieren.
Button Nächster Schritt klicken
2) Vorlagen gestalten
Dieser Punkt kann jetzt etwas verwirrend sein: „Wieso soll ich eine Vorlage wählen, wenn ich gerade eine Vorlage baue?“ Der Punkt ist: Jede Vorlage ist technisch fertig eingerichtet. Selbst wenn keine oder kaum eine Gestaltung enthalten ist. Denn hinter einem automatisierten Mailversand steckt eine Menge Programmierung. Du hast also auch mit den relativ „puristischen“ Vorlagen solche, die zwar noch etwas Finetuning brauchen – die aber technisch tipptopp funktionieren.
Nach deinen Einstellungen siehst du im nächsten Arbeitsbereich 6 Rahmen. Diese Kästen sind die Ansichten von sechs einfach gestrickten Vorlagen. Doch bevor ich weitermache eine kurze Erklärung, was du in diesem Bereich noch siehst und wozu die Einträge sind:
Über den ersten sechs Vorlagen siehst du ein horizontales Menü mit den Menüpunkten:
- Design
- Vorlagen-Galerie
- Meine Vorlagen
- Vorlage programmieren
Design der Opt-In-Mail
Unter diesem Menüpunkt findest du die erwähnten sechs einfachen Templates mit Platzhaltern für Bilder oder Videos. In den Vorlagen wurde der Blindtext in Zeilen und Spalten eingeteilt, so dass du bei der Gestaltung weniger Arbeit hast. In diesem „Design“-Bereich findest du auch ein Template, mit dem du von Grund auf neu beginnen kannst. Diese Vorlage nutze ich für meine Opt-In-Mail. Weiter unten erkläre ich dir den Aufbau.
Vorlagen-Galerie
In diesem Bereich findest du alle fertig Templates in schicken Layouts, die Brevo uns schenkt. Ich finde die Menge ziemlich krass! Da kann einem die Wahl echt schwer fallen. Die Templates haben Blindtext, Bilder und Grafiken und sind in unterschiedlichen Layoutrastern fix und fertig designt. Du kannst die Bilder nutzen und brauchst nur noch Text austauschen – fertig.
Aber: Für eine Optin-Mail sind diese Vorlagen definitiv too much.
Meine Vorlagen
Dieser Bereich ist klar: Hier findest du alle deine fertigen Vorlagen, die du gespeichert hast. Praktisch, wenn du neue Kampagnen startest. Dann wählst du einfach eine deiner Vorlagen und tauscht den Text aus.
Vorlage programmieren
Hier gibt es die beiden Optionen
- Rich Text-Editor und
- HTML-Editor
Den Rich Text-Editor nimmst du, wenn du reine Textmails schreiben und versenden möchtest. Diese Option kann durchaus sinnvoll sein. Denn alle Vorlagen in Brevo sind HTML-Mails (auch wenn die Gestaltung eher puristisch ist). Reine Textmails haben den Vorteil, dass sie schneller geladen werden und sie sind weniger anfällig für Spamfilter. Sie sind also eine Überlegung wert!
HTML-Editor: Wenn du eine eigene HTML-Mail schreiben möchtest, kannst du diesen HTML-Editor als Spielwiese nutzen. Nachteil: Du musst gute HTML-Kenntnisse haben.
Vorlage wählen unter „Design“
Für eine Optin-Mail erstelle am besten eine Vorlage ohne großartiges Layout. Ohne Schnickschnack, nur mit einem Button und wenig Text. Denn Anna soll ja nur bestätigen und nicht abgelenkt werden. Dazu wähle ich eine der 6 Kästen (Vorlagen), die ich unter „Design“ finde. Ich wähle die Vorlage „Von Grund auf beginnen“. Hier die Auflistung der Vorlagen, die du auch alle nutzen kannst:
- Standart-Template
- Produkt verkaufen
- Geschichte erzählen
- Für eine Veranstaltung anmelden
- Von Grund auf beginnen
- Einfach

E-Mail-Vorlage in Brevo einrichten
Hast du die leere Vorlage gewählt?
Dann kann’s mit der Gestaltung weitergehen. Oder besser gesagt: Du setzt ein paar Zeilen Text und den Button zur Bestätigung. Nachdem du die Vorlage ausgewählt hast, erscheint in Brevo ein neuer Arbeitsbereich. Dieser Arbeitsbereich ist in 3 Teile gegliedert. Du findest
ganz links
ein vertikales Menü, das aus Icons besteht. Das erste in dieser Spalte ist das Icon „Blöcke“, gefolgt von „Style“, darunter „AI“.
Rechts daneben
findest du quadratische Felder mit Icons. Das sind die Blöcke mit verschiedenen Inhaltselementen.
Im ganz rechten Bereich
findest du den Editor mit Punktraster, in dem du deine Mail aufbaust und gestaltest. Der Bereich beginnt oben mit einem Rahmen und dem Hinweis „Inhalt hier einfügen“. In diesen Rahmen ziehst du deine Blöcke rein. Einfacher geht’s nicht. Über den Blöcken findest du noch ein kleines, horizontales Menü mit den Reitern
- Blöcke
- Abschnitte
- Gespeichert

Was sind Blöcke?
Die Blöcke sind die Elemente, mit denen du deine E-Mail mit Inhalt füllst. Also z.B. „Titel“, „Text“, „Bild“ oder „Button“.Dazu klickst du auf einen Block und ziehst das Ganz mit gedrückter Maustaste in den rechten Inhaltsbereich.
Was sind Abschnitte?
Abschnitte sind eine Zusammenstellung verschiedener Blöcke. Als Beispiel: Du möchtest einen kleinen Kasten mit einem Bild, einem Text und einem Call to Action-Button in immer derselben Gestaltung in verschiedenen Mails verwenden. Dann kannst du so einen kleinen Kasten einfach als Abschnitt speichern. Ein Anwendungsbeispiel: Ich setze unter meine E-Mails immer einen kleinen Autorenkasten. Darin ist ein Bild von mir, mein Name und ein kurzer Pitch zu meinem Angebot.
Im Bereich Abschnitte findest du fertig layoutete Abschnitte, die bereits Bilder und Blindtext enthalten. Die kannst du natürlich auch nehmen. Doch, wie gesagt: Halte die Optin-Mail so einfach wie möglich.
Unter dem Reiter „Gespeichert“ findest du deine gespeicherten Abschnitte.
Die Optin-Mail mit Inhalt füllen
Du klickst auf die jeweiligen Blöcke und ziehst sie mit gedrückter Maustaste ins Editorfeld „Inhalt hier einfügen“. Die Elemente (Text oder Button) können beliebig bearbeitet werden. Du kannst den Schrifttyp wählen, die Farbe, den Hintergrund, die Größe der Schrift usw. Wenn du das Element (den Block im Editorfenster) anklickst, wird auf der linken Seite ein neues Fenster gezeigt. Hier kannst du deine Gestaltung anpassen: Schrift anpassen, Schriftart, Schriftgröße, Zeilenabstand, Textausrichtung (linksbündig, mittig), den Hintergrund und vieles mehr.
Dieselben Anpassungen kannst du mit dem Button machen. Du kannst Rundungen hinzufügen (so dass er fast oval ist), die Hintergrundfarbe ändern, die Schriftfarbe ändern und einiges mehr. Dieser Text muss unbedingt in die Optin-Mail Was du in der Optin-Mail schreibst bleibt dir überlassen. Wichtig: Der Hinweis auf dem Button sollte so eindeutig wie möglich sein. Was auch wichtig ist: Du solltest erwähnen, dass der Kontakt sich mit der Bestätigung zum Newsletter anmeldet. Dem Kontakt muss klar sein, dass er seine Einwilligung zum Newsletter gibt, wenn er den Bestätigungsbutton klickt.
Den Link einfügen, damit der Kontakt in die Liste kommt
Zum Schluß kommt das wichtigste: der Link des Buttons. Denn wenn der neue Kontakt auf den Button geklickt hat, soll das System die E-Mailadresse und den Vornamen der Person in deine Liste für das Newsletter Marketing eintragen. Deshalb machst du noch folgendes: Du klickst mit dem Mauszeiger auf den Button. Es erscheint ein Kettensymbol.
- Auf das Kettensymbol klicken.
- Es öffnet sich ein > Kontextfenster:
- Hier „Double-Opt-in-Link“ auswählen


Testen und Layout responsiv anpassen
Jetzt ist es sinnvoll, dein Layout für Smartphones anzupassen und zu testen. Oben rechts findest du dafür 2 Symbole. Das sind links neben dem Speichern-Button die Icons für die Desktop-Ansicht und die Smartphone-Ansicht. Das ist nämlich das schicke hier: Du kannst direkt prüfen, wie das Layout der E-Mail auf dem Desktop aussieht und wie auf dem Smartphone. Und, richtig grandios:
Wenn du das Smartphone-Icon aktivierst und Änderungen am Layout machst, dann wirken sich die Änderungen ausschließlich fürs Smartphone aus. Super responsiv! Außerdem gibt es verschiedene Möglichkeiten, um globale Styles für deine Vorlage einzustellen. Dazu gehst du auf das Icon „Style“ (ganz links). Hier kannst du dir global deine Markenbibliothek anlegen (Farben, Schriften, Abstände).
Letzter Schritt: Vorlage aktivieren Jetzt muss die Vorlage noch aktiviert werden. Sonst kann sie nicht eingesetzt werden. Dafür gibt es rechts oben den Button „Speichern und aktivieren“. Falls du nur zum Test gespeichert hast, kannst du auch in der Vorlagenliste aktivieren: Dazu klickst du auf die 3 Punkte in der Zeile der jeweiligen Vorlage. Im Kontextfenster einfach auf „Aktivieren“ klicken. Ist die Vorlage aktiv, steht dort ein grüner Punkt.
Vorlage erstellen für die Schlußmail
Hier gehst du genauso vor wie bei der Optin-Vorlage. Bei den Einstellungen kannst du die erweiterten Optionen anklicken. Hier gibt es nämlich die Möglichkeit, der Mail einen Anhang anzufügen (zum Beispiel ein Freebie). Oder du kannst dem Empfänger ein Tag vergeben.
Was ist ein Tag?
Ein Tag ist eine Art Etikett. Damit kannst du diesen Kontakt kennzeichnen. Ein Anwendungsbeispiel: Du hast mehrere Freebies. Damit du später in deinen Listen weißt, für welches Freebie sich der Kontakt angemeldet hat, gibst du ihm ein Tag mit der Beschreibung des Freebies. Alle anderen Schritte machst du wie oben erklärt.
Ein wichtiger Hinweis, wenn du deine Templates suchst:
Wenn du fertig bist mit deinen Vorlagen und zum Menüpunkt „Vorlagen“ zurückkehrst, kann es passieren, dass du dich wunderst: Wo sind meine gespeicherten Vorlagen? Brevo zeigt nämlich zuerst die Templates an, die zwar gespeichert, aber noch nicht aktiviert worden sind.
Das bedeutet: Wenn du im Fenster „Templates“ bist, gehe auf das Auswahlfenster „Nicht aktiv“. Hier wählst du aus: Alle Status. Und schwups: Nun siehst du alle deine gespeicherten Vorlagen. Die aktiven genauso wie die, die du nur testen willst und die deshalb „Nicht aktiv“ sind.
6. Schritt
Formular in Brevo erstellen
Jetzt kommt der wesentlichste Teil des ganzen Prozedere: das Formularfeld. Das Ding, mit dem sich deine Besucher bei dir zum Newsletter anmelden. Gleichzeitig ist das eigentlich die geringste Arbeit. Also legen wir los: Den Menüpunkt Formulare findest du im Hauptmenü, wenn du Kontakte anklickst. Die nächsten Schritte sind also:
- Kontakte anklicken (ein Untermenü öffnet sich)
- Du klickst auf den Button oben rechts „Ein neues Anmeldeformular erstellen“
- Erstellen Sie ein Anmeldeformular

6.1) Die Einrichtung des Formulars in Brevo
Es erscheint ein Fenster, in dem du nun Schritt für Schritt weitergeleitet wirst. Der erste Punkt ist die Einrichtung. Hier machst du folgendes
Oben vergibst du einen Formularname.
Darunter kannst du anklicken, ob du DSGVO-Felder aktivieren möchtest.
Jetzt Achtung:
Wenn du diesen Kasten anklickst, erscheint unter deinen Formularfeldern folgender Text und ein Kasten zum anklicken: „Ich möchte Ihren Newsletter erhalten und akzeptiere die Datenschutzerklärung“
Dieser Punkt ist für Anfänger und Rechtslaien verwirrend. Die Besucher deiner Website brauchen dieses Feld zum Anklicken nicht. Denn du verschickst ja eine Optin-Mail, mit der die Besucher dem Erhalt des Newsletters explizit zustimmen. Damit, mit dieser Optin-Mail, ist dein Newsletter datenschutzkonform eingerichtet. Double Optin heißt: Nachdem der neue Kontakt deinen Newsletter bestellt hat, muss er erst in einer separaten Mail bestätigen, dass er damit einverstanden ist, den Newsletter zu erhalten.
Das heißt für dich an diesem Punkt: die DSGVO-Felder deaktiviert lassen! Du klickst also auf Weiter.
6.2) So gestaltest du das Formular in Brevo
Im nächsten Schritt siehst du 2 Arbeitsbereiche: Auf der linken Seite findest du den oben Bereich mit mehreren Blöcken (Inhaltsblöcke wie Text oder Bild) und unten den Bereich mit Feldern (Attribut, Mehrere Listen, Single Choice u.s.w.). Auf der rechten Seite siehst du ein bereits fertiges Formular mit dem Anmeldebutton. Das kannst du mit den Blöcken und Feldern für deine Bedürfnisse anpassen.
Über dem Bereich mit den Blöcken und Feldern findest du ein horizontales Menü: Formulardesign erstellen Im Bereich Erstellen findest du den Inhalt des Formularfelds. Das sind Text, Bild, Listen, Single Choice Felder und viele mehr. Die Blöcke werden einfach mit gedrückter Maustaste in den Formularbereich gezogen. Wenn du deine Newsletteranmeldung auf deiner Website gestaltet hast (ich mache das immer so), dann brauchst du für dein Anmeldeformular nur die relevanten Felder auswählen: E-Mail, Vorname und Absende-Button. Diese drei Felder sind unverzichtbar, wenn du deinen ersten Newsletter versenden möchtest.


Das heißt für dich: Den gesamten oberen Text über dem E-Mail-Feld kannst du löschen.
Das funktioniert so: Geh mit dem Mauszeiger über den jeweiligen Text, das Textfeld wird blau umrandet und an der rechten Ecke erscheint ein Papierkorb-Symbol.
Jetzt fehlt noch das Feld für den Vornamen. Dazu gehst du in den Feldern links auf „Attribut“. Das ziehst du nach rechts auf das Newsletterfeld. Nun ändert sich im linken Feld die Ansicht in „Attribut-Datenbank“. Im Auswahlfeld steht SMS. Das willst du natürlich nicht haben. Also gehst du dort ins Feld und wählst „Vorname“ aus. Von den lilafarbenen Haken kannst du folgende deaktiveren:
- Name des Labels
- Hilfetext
- Pflichtfeld

Das Pflichtfeld ist Geschmacksache. Ich hab erfahren, dass viele ihren Vornamen nicht angeben möchten. Ist zwar doof, aber warum soll ich die Leute vergrätzen. Also würde ich den Haken bei Pflichtfeld deaktiveren. Dasselbe machst du mit dem E-Mailfeld:
- Auf das E-Mailfeld klicken
- Es öffnet sich wieder links die Attribut-Datenbank
- Name des Labels deaktivieren
- Hilfetext deaktivieren.
Das Pflichtfeld kannst du nicht deaktivieren. Was ja logisch ist, denn die E-Mailadresse ist zwingend notwendig, sonst kann sich der Mensch ja nicht anmelden.
Fertig. Jetzt kannst du noch ein wenig gestalten. Wenn du nicht möchtest, dass der Button schwarz ist, sondern vielleicht ein schickes Pink hat, dann machst du folgendes:
- Du klickst auf den Button.
- Links öffnet sich der Bereich „Formulardesign“.
- Klick auf den Button
- Hier kannst du die Schriftart auswählen (vorausgewählt: Helvetica)
- Du kannst die Hintergrundfarbe ändern
- du kannst Rundungen einfügen
Fertig. Klick auf Weiter.
Im nächsten Schritt wird dir empfohlen, die reCaptcha-Bestätigung zu nutzen. Das würde ich nicht machen, weil es für den Spamschutz bessere Möglichkeiten gibt. Das aber anderer Stelle.
6.3) Liste in Brevo auswählen
Das ist einfach: Du musst nur deine gewünschte Liste auswählen.
6.4) Einstellungen für deine automatisierten E-Mails
Die ersten Einstellungen sind einfach:
- Double-Opt-in-E-Mail anklicken
- Eine Vorlage auswählen
- Deine Optin-Vorlage auswählen
Jetzt bewährt sich, dass du deine Mails bereits angelegt hast und dass du deine Fast-geschafft und die Danke-Seite erstellt hast. Im folgenden Schritt kannst du aus den 3 runden Radio-Buttons auswählen:
- Double-Opt-In-E-Mail
- Einfache Bestätigungs-E-Mail (Nach der Einsendung des Formulars wird eine einzige Bestätigungs-E-Mail versandt.)
- Keine Bestätigungs-E-Mail (Nach der Einsendung des Formulars wird keine Bestätigungs-E-Mail versandt.)

Double-Opt-in-E-Mail in Brevo wählen
Wir wählen natürlich den ersten Radio-Button: Double-Opt-in-E-Mail. Die anderen 3 Buttons sind nicht DSGVO-konform. Wenn du Double-Opt-In-E-Mail aktiviert hast, werden weitere Optionen geöffnet. Die Optionen haben jeweils ein Kästchen zum Aktivieren. Links davon befindet sich ein senkrechter Strich. Diesen Strich ist super sinnvoll, weil der visualisiert, dass diese 3 Schritte zur Automation zusammengehören.
Bestätigungsseite nach Absenden des Formulars
Bestätigungsseite nach Klicken auf den Bestätigungslink in der E-Mail
Finale Bestätigungs-E-Mail
Automation in Brevo festlegen
Spätestens jetzt bewährt sich dein Plan, den du oben gemacht hast. Und nun wird dir vielleicht klar, warum es sinnvoll war, zuerst die Fast-geschafft-Seite, die Danke-Seite und die Bestätigungsmail anzulegen.
Bestätigungsseite nach Absenden des Formulars
Es öffnen sich 2 Felder
Feld 1) Wählen Sie eine Bestätigungsseite aus (das sind die Standardseiten von Brevo)
Feld 2) Ein leeres Feld, in der du deine URL eintragen kannst.
Du wählst natürlich die 2. Option. Kopiere die URL deiner Fast-geschafft-Seite und füge sie in das 2. Feld ein.
Bestätigungsseite nach Klicken auf den Bestätigungslink in der E-Mail
Das geht genauso wie oben:
Feld 1) Wählen Sie eine Bestätigungsseite aus (das sind die Standardseiten von Brevo)
Feld 2) Ein leeres Feld, in der du deine URL eintragen kannst.
Du wählst wiederh die 2. Option. Kopiere die URL deiner Danke-Seite und füge sie in das 2. Feld ein.
„Finale Bestätigungs-E-Mail“ wählen
Hier wählst du deine letzte Bestätigungsmail aus. Wenn du alles gemacht hast wie in dieser Anleitung, dann hast du die Vorlage für die Begrüßungsmail bereits erstellt und aktiviert.
Klick also auf Weiter
6.5) Nachrichten anpassen
Nachrichten können u.a. Fehlermeldungen sein. Beispiel: Wenn der Kontakt seine E-Mailadresse falsch geschrieben hat (so dass sie als Mailadresse nicht erkannt wird). Dann muss eine Fehlermeldung ausgegeben werden. Oder wenn er vergißt, das Mailfeld auszufüllen.
6.6) Formular Teilen
Brevo stellt mehrere Möglichkeiten vor, wie du dein Formular teilen kannst. Die 1. Möglichkeit ist ein „Quick Share“. Das heißt: Du kannst einfach per Social Media und per E-Mail den Code für das Formular weiterleiten. In diesem Fall möchtest du das Formular auf deiner Website einbinden. Dafür hast du drei Möglichkeiten
- Per iFrame
- Per HTML oder
- per einfaches HTML
Ich habe iFrame und HTML versucht.
IFrames finde ich etwas problemetisch. Sie sind nicht sehr responsiv und sie können einige Nachteile haben. Es kann sein, dass bei einem serverseitigen Cache der Code nicht geladen wird. Dann musst du die URL des Formulars im Cache ausschließen. Und du musst die URL in deinem Cookie-Plugin ausschließen.
Der Nachteil bei der HTML-Einbettung: Hier kann es passieren, dass das Formular nicht so angezeigt wird, wie du es gestaltet hast. Das passiert dann, wenn die Styles deiner Website die Styles des Formulars überschreiben. Bei mir ist genau DAS passiert.
Deshalb habe ich die iFrame-Lösung gewählt.

7. Schritt
Brevo Formular in WordPress einbauen: so geht’s
Das ist jetzt einfacher als du denkst. Du kopierst den Code (ich habe wie gesagt den iFrame kopiert).
Auf deiner Website musst du ein „Code-Modul“ wählen. Je nachdem, mit welchem Theme du arbeitest. Für das Theme Divi oder für Elementor gibt es so ein Code-Modul. Das wählst du aus und setzt es an die Stelle in deinem Newsletter-Feld, wo das Formular stehen soll. In das Code-Modul setzt du deinen kopierten Code ein.
Fertig.
Wenn du alles richtig gemacht hast, dann kann Anna sich jetzt bei deinem Newsletter anmelden.
Mach am besten ein Test.
Hast du Fragen? Dann melde dich gern bei mir. Für Support kannst du dich gern im Kalender eintragen.
Oder schreib mir einfach eine Mail.
Wichtiger technischer Schritt: Domain authentifizieren
Bevor du deinen ersten Newsletter versendest, solltest du deine Absender-Domain authentifizieren.
Dazu gehören:
- SPF-Eintrag
- DKIM-Signatur
- optional: DMARC (inkl. rua-Tag)
Warum ist das wichtig?
Ohne diese Einstellungen kann es passieren, dass deine E-Mails:
- im Spam landen
- blockiert werden
- gar nicht zugestellt werden
Brevo führt dich im Backend durch diesen Prozess. Und hier findest du deine Einträge:
- Klick oben rechts auf deinen Namen (bzw. Firmennamen, je nachdem)
- Im Kontextmenü gehst du auf „Einstellungen“
- Dann siehst du links eine neues, vertikales Menü.
- Hier auf „Absender, Domains, IPs klicken.
- Im rechten großen Feld findest du dann weitere Einstellmöglichkeiten. Oben siehst du horizontale Reiter mit unterschiedlichen Optionen.
- Beispiel Domain: Hier findest du jetzt alle DNS-Einträge.
- Die kopierst du (das zeigt dir auch Brevo an).
- Als letzten Schritt setzt du die Daten in deine DNS-Einstellungen deines Hosters ein.
Wenn du hier unsicher bist, solltest du die Einrichtung prüfen lassen. Die Zustellbarkeit deines Newsletters entscheidet darüber, ob deine mit viel Mühe und Zeit geschriebenen Mails überhaupt gelesen wird.
Wann du dir die Einrichtung sparen solltest
Es gibt Situationen, in denen ich dir nicht empfehlen würde, dein Newsletter-System selbst aufzusetzen:
- Wenn du keine Zeit hast, dich mit Technik auseinanderzusetzen.
- Wenn du dein Angebot gerade neu positionierst.
- Wenn dein Newsletter direkt Kunden bringen soll – nicht nur Abonnenten.
- Wenn du sicherstellen willst, dass Datenschutz, Domain-Authentifizierung und Zustellbarkeit sauber eingerichtet sind.
Gerade die Themen Domain-Authentifizierung, SPF, DKIM und rua-Tags werden häufig übersehen – und führen dazu, dass Mails nicht zugestellt werden.
In solchen Fällen ist es sinnvoll, die Einrichtung professionell begleiten zu lassen. Ich unterstütze dich entweder bei der kompletten Einrichtung oder baue das System gemeinsam mit dir auf – inklusive strategischer Einbindung in deine Website.
Brauchst du Unterstützung bei Brevo?
Wenn dir die technische Einrichtung zu aufwendig ist oder du sicherstellen willst, dass:
- Double-Opt-in korrekt funktioniert
- SPF und DKIM richtig gesetzt sind
- dein Newsletter strategisch in deine Website eingebunden ist
Dann unterstütze ich dich gern bei der Einrichtung.
Frag einfach unverbindlich an: hallo@constanzestraub.de Oder buche ein Kennenlerntermin.
Weitere hilfreiche Artikel
Website-Texte lesbar gestalten – typische Fehler vermeiden
Website-Konzept erstellen – an einem konkreten Beispiel
Website Konzept: Definition und strategische Grundlagen
FAQ zu: Newsletter erstellen mit Brevo
von ConstanzeStraub | März 30, 2023 | WordPress, Anleitungen
Echt simpel: WordPress Backup erstellen in 10 Minuten!
Die perfekte Anleitung für Anfänger und Fortgeschrittene.
Die Website ist fertig – allerhöchste Zeit, dein WordPress Backup zu erstellen. Denn dies passiert schneller, als dir lieb ist: Die Festplatte hat den Geist aufgegeben, dein Server wurde gehackt, deine WordPress-Installation ist verunglückt… Egal aus welchem Grund die Daten deiner Website futsch sind: Wenn du jetzt kein Backup hast, wirst du dir die Haare raufen oder schlecht schlafen. Auf jeden Fall ist deine gute Laune dahin.
In meinen WordPress-Kursen ist dies der erste Schritt – gleich nach der Installation des Themes: Ich zeige meinen Teilnehmern, wie das Backup-Plugin installiert und eingestellt wird.
Was ist ein Backup?
Ein Backup ist eine Sicherungskopie von Daten oder Informationen. Die Daten werden auf einem Computer, einem Server oder Speicher gesichert. Speicher können externe Festplatten oder USB-Sticks sein.
Ein Datenverlust passiert schneller und häufiger, als man denkt. Gerade WordPress-Websites werden gern gehackt. Nicht, weil WordPress unsicher ist, sondern weil es weit verbreitet ist.
Aber es gibt noch mehr Ursachen, seine Daten zu verlieren: Softwareprobleme, menschliches Versagen, Viren, Malware oder andere Katastrophen. Dein Backup ist der doppelte Boden, deine Sicherheitsleine, dein Fallschirm.
Wie und wo kann ich ein Backup machen?
Ein Backup kannst du entweder manuell oder automatisch machen. Wie genau – das erkläre ich unten. Wo und auf welchem Gerät du speicherst, hängt davon ab, wie sicher deine Speicherung sein soll. Als Speicherorte sind mehrere Möglichkeiten denkbar: externen Festplatten, USB-Sticks, CDs/DVDs, Cloud-Speicher oder Netzwerkspeicher.
Cloudspeicher scheinen sicher – aber natürlich können auch dort die Server gehackt werden (alles schon passiert). Und Hardware wie USB-Sticks kann mechanisch zerstört werden.
Mehrgleisige Backups sind deshalb sinnvoll.
Zu Beginn meiner Selbständigkeit vor 20 Jahren hab ich meine Daten auf externe Festplatten gespeichert. Eine der Festplatten hatte ich im Haus, die andere hatte ich in einen gemieteten Tresor der Bank gebracht. Clouddienste, so wie wir sie heute kennen, gab es zu der Zeit noch nicht. Heute sichere ich meine Daten in einem Clouddienst und zusätzlich auf externe Festplatten.
Wie mache ich ein Backup meiner Website in WordPress?
Für ein Backup hast du drei Möglichkeiten:
Eine bequeme und schnelle Methode ist das Backup mit einem Plugin. Ich nutze dazu UpdraftPlus. Die Basisversion ist kostenlos und dennoch sehr umfangreich. Ich habe einige Plugins getestet und kann dir dieses Plugin gut empfehlen. Für UpdraftPlus gibt es einige Gründe: Das Plugin ist leicht zu verstehen und obendrein in Deutsch, du kannst Zeitpläne erstellen (die Backups werden dann automatisch erledigt) und du kannst deine Backups auf anderen Servern als deinem Hoster erstellen.
Einige Webhoster bieten eine Backup-Möglichkeit an. Falls du einen guten Hoster hast und dich darauf verlassen kannst, dann ist diese Option komfortabel.
Manuelles Backups: Meine Websites sichere ich immer zusätzlich manuell. Das empfehle ich dir, selbst wenn du ein Plugin nutzt oder deine Daten per Hoster sicherst.
So machst du das WordPress-Backup mit einem Plugin (UpdraftPlus)
Zuerst musst du UpdraftPlus (oder jedes andere Backup-Plugin) in deinem WordPress installieren. Das ist sehr simpel:
Im WordPress-Menü klickst du auf > Plugins und
gehst du auf > Plugin installieren.
Dort werden dir standardmäßig diverse Plugins angezeigt.
Rechts oben im Suchfeld > Plugin suchen gibst du UpdraftPlus ein und
das Icon des Plugins wird dir gezeigt.
Jetzt drauf klicken, installieren und aktivieren.
UpdraftPlus führt dich mit einem Assistenten durch das Prozedere uns lässt dich gleich ein 1. Backup machen.
Unter > Einstellungen kommst du auf die Oberfläche von UpdraftPlus.
Das Fenster zeigt dir mehrere Tabs. Der erste ist der, auf dem du deine Sicherungen machst: > Sicherung/Wiederherstellen. Gleich unter den Tabs kannst du sofort sichern. Wichtig: Du musst immer beides sichern – Datenbank und Dateien. Mit dem Klick auf den blauen Button wird sofort alles gesichert.
Über den Reiter > Einstellungen kannst du deinen Sicherungsplan anlegen. Damit werden die Sicherungen automatisch von UpdraftPlus ausgeführt – und du kannst dich entspannt zurücklehnen.
Die Standartsicherungen werden auf deinem Hoster abgelegt.
Aber du kannst – und solltest – zusätzliche andere Orte wählen, auf deinen du deine Daten sicherst. UpdraftPlus bietet dir sogar in der kostenlosen Version verschiedene Möglichkeiten an
Die Einstellungen von UpdraftPlus
Datenbank und Dateien in UpdraftPlus sichern
backup plan
Zeitplan der Sicherung festlegen
Das Backup über deinen Hoster
Einige Hoster bieten diese komfortable Sicherung an. Ich bin mit einer meiner Websites bei Raidboxes. Dort wird regelmäßig ein Backup meiner Installation durchgeführt, die ich auf meinen Rechner laden kann.
Schau einfach nach, ob dein Hoster diesen Service anbietet. Allerdings solltest du dich nicht unbedingt nur auf diese Sicherungen verlassen. Ich finde es sinnvoll, zusätzlich manuelle Backups zu laden.
So machst du ein manuelles Backup deiner Website
Nie verkehrt: ein manuelles Backup deiner Website
Ich gebe es zu: Dieser Weg ist weit umständlicher als mit einem Plugin. Und bestimmst fragst du dich jetzt: Warum soll ich mir dann die Mühe machen? Ich empfehle dir diese zusätzliche Sicherung, weil du dann ein Gefühl dafür bekommst, aus welchen Dateien deine Website besteht.
Mich beruhigt die Tatsache, dass alle meine Dateien selig auf meinem Rechner schlummern – und dass ich sie bei Bedarf einfach nur auf den Webserver hochladen brauche.
Es gibt noch einen anderen Grund, warum ich das zusätzliche manuelle Backup empfehle: Ein Plugin ist ein Tool, das auch mal versagen kann. Getreu dem Gesetz: alles was passieren kann, passiert irgendwann.
Oder die Dateien, die vom Plugin auf deinen Server gespeichert werden, sind aus welchen Gründen auch immer futsch. Dann wirst du der glücklichste Mensch auf unserem Planeten sein, wenn du irgendwo auf einer deiner Festplatten ein Backup schlummern hast…
Die Kopie deiner Dateien geht völlig simpel:
Du brauchst dazu ein FTP-Programm
Damit wählst du alle deine WordPress-Dateien bzw. den Ordner mit den Dateien aus
Und dann lädst du diesen Ordner einfach in einen beliebigen Order auf deinem PC.
Deine Datenbank darfst du natürlich nicht vergessen.
Dazu wählst du dich im Kundenbereich deines Hosters ein und dort in den technischen Bereich, wählst deine Datenbank aus und lädst sie ebenfalls auf deinen PC.
Damit ist dein manuelles Backup abgeschlossen.
WordPress ist einfach zu erlernen, aber hat auch einige Stolpersteine. Wenn du Hilfe brauchst, wende dich gern an mich. In einem 4-stündigen Workshop kannst du viele Stolpersteine aus dem Weg räumen.
von ConstanzeStraub | Nov. 10, 2022 | WordPress, Anleitungen
Was ist ein Pagebuilder?
Was sind Plugins?
Meine Antworten, wenn es schnell gehen soll:
- WordPress ist das Programm, mit dem du eine Website baust. Dafür hat WordPress alle grundlegenden Funktionen „an Bord“.
- Das Theme legt das Design und die Optik deiner Website fest und beeinflusst einige Funktionen von WordPress.
- Ein Pagebuilder ist ein Tool, das den Aufbau einer Website leichter macht. Manche Themes haben einen Pagebuilder integriert (so wie „Divi“)
- Plugins erweitern WordPress um zusätzliche Funktionen. Manche Funktionen sind wichtig. Sie sorgen u.a. für die Sicherheit und Ladegeschwindigkeit der Website.
Keine besonders originellen Antworten.
Und irgendwie etwas trocken und abstrakt.
Nichts für visuell denkende Menschen.
Deshalb hab ich eine Art Übersetzung überlegt.
Eine, die das Thema verständlich macht, ohne mit Technik zu langweilen.
Falls du jetzt die Stirn runzelst: Keine Sorge, der Titel diese Artikels soll dich nicht in die Irre führen. Am Ende der Geschichte sage ich dir, mit welchem Theme ich arbeite und welche Plugins du WIRKLICH brauchst.
Lass mich dir ein Bild malen
Stell dir drei neu gebaute Häuser vor.
In eines der Häuser möchtest du einziehen.
Dazu schaust du dir Haus für Haus an.
Du schließt die Haustür von Haus Nummer eins auf.
Schon im Flur siehst du, dass mit dem Haus etwas nicht stimmt:
Der Fußboden ist ein grauer, kalter Betonboden.
Das Haus ist kalt, denn im Haus gibt es keinen einzigen Heizkörper.
Die Küche ist leer. Aus den nüchternen Wänden ragen die nackten Wasserrohre. Wasseranschluss, Stromanschluss und Rohre sind zwar verlegt, aber die Einrichtungen und Anschlüsse fehlen: Spülbecken, Herd, Kühlschrank und Schränke gibt es nicht.
Auch das Bad hat nur die offenen Wasseranschlüsse und einen Ablauf für die Toilette. Waschbecken, Dusche und ein WC: Fehlanzeige.
Licht gibt es natürlich auch nicht: An der Decke baumeln die nackten Stromkabel.
Ziemlich unwohnlich also.
Du ahnst es vielleicht:
Dieses leere Haus ist deine WordPress-Installation.
Ohne Theme, ohne Plugins.
Nur das nackte WordPress.
Du kannst dich in diesem Haus aufhalten, du hast sogar einen Schlüssel für die Haustür, die du abschließen kannst. Du kannst deine Sachen mitbringen und in den Räumen ablegen.
Aber wohnen kann man diesen Aufenthalt nicht nennen.
Diesem Haus fehlt die Grundausstattung:
Heizkörper, Küchenschränke, Herd, Spülbecken, WC, Dusche, Waschbecken.
Erst mit dieser Grundausstattung kann das Haus als „Wohnung“ bezeichnet werden.
Das sagt sogar Wikipedia 😉
So machst du WordPress „wohnlich“: mit einem Theme
Also schaust du dir das zweite Haus an.
Du schließt wieder die Tür auf.
Dieses Haus sieht schon ganz anders aus:
Auf dem Fußboden wurde ein einfaches, aber schickes Klicklaminat verlegt. Das macht einen warmen und gepflegten Eindruck.
Die Küche ist vollständig eingerichtet. Mit Küchenschränken, Arbeitsplatte, Spüle, Herd und sogar einen Kühlschrank gibt es. In den Schränken findest du Tassen, Gläser und Teller.
Auch das Bad ist vollständig: Darin findest du eine Dusche mit Schiebetüren, ein Waschbecken und nebenan ein Stand-WC. Die Wände und der Fußboden sind mit weißen Fliesen bedeckt.
Und natürlich hat das gesamten Haus moderne Flachheizkörper unter den Fenstern.
Die Grundausstattung einer Wohnung ist also schon mal da.
Doch nicht nur das: Mittlerweile dämmert es und du siehst keine Details mehr. Du tippst auf den Lichtschalter und siehe da: Licht. In diesem Haus hängt in jedem Raum eine flache Deckenleuchte. Elegant geht anders, aber du kannst alles sehen. Das ist ja die Hauptsache.
Du gehst weiter:
In einem Raum findest du ein Bett und daneben ein Nachttisch mit einer kleinen LED-Lampe drauf. Im nächsten Raum stehen zwei Sessel, ein kleiner Hocker als Beistelltisch und eine Stehlampe. Im dritten Raum steht ein kleiner Esstisch mit zwei Stühlen.
Zwar ist dieses Haus immer noch nicht der Knaller. Aber wenn du Purist bist, reicht diese Einrichtung völlig: Du kannst dir einen Tee machen, dich auf dem Sessel ausruhen, im Bett die Nächte verbringen und für’s Frühstück setzt du dich an den Tisch.
So, jetzt kommt das Theme ins Spiel:
Dieses rudimentär eingerichtete Haus ist dein kostenloses Standard-Theme.
Nicht besonders schick und sehr einfach gestrickt.
Wenn du dein individuelles Design hinbekommen möchtest, brauchst du Zeit, Geduld und musst vielleicht etwas Technikkenntnisse haben, denn das Theme ist nicht so einfach zu handhaben.
Aber es reicht völlig aus, um damit einen einfach gestalteten Blog zu starten.
Jetzt denkst du sicher: Da geht natürlich mehr.
Und, weil wir ja malen wollen:
Du möchtest nicht nur „irgendwie“ wohnen.
Du möchtest es gemütlich haben, du möchtest deine Wohnung geniessen!
Also gehst du ins Haus Nummer drei.
In diesem Haus findest du das, was eine Wohnung erst so richtig behaglich macht: Teppiche auf den Fußböden, Bilder an den Wänden, Vorhänge an den Fenstern, passend zu den Sesseln eine gemütliche Coach, eine Musikanlage, um richtig schön zu chillen, weiche Kissen und ein hübsches Plaid auf dem Sofa, damit du dich wohlig zurücklehnen und dich einkuscheln kannst, während du dein Lieblingsbuch liest.
An der Wand steht ein cooles Echtholzregal für deine Bücher. Und gegenüber steht eine schicke Landhaus-Kommode, auf der eine stylische Tischlampe steht, die deinen Raum in warmes und gemütliches Licht taucht.
Die Wände haben einen Farbanstrich. Im Esszimmer steht ein einladender, großer Holztisch mit sechs gepolsterten Stühlen. Der Tisch bietet viel Platz und lädt dazu ein, mit Freunden stundenlang gemütlich zu brunchen.
Auch Küche und Bad sind tippitoppi: In der Küche sind moderne Einbaumöbel mit Schubladenelemente, in denen alles seinen festen Platz hat und die beim Schließen wie von Zauberhand leise zufahren. Hier findest du Küchenhelferchen, mit denen du ruckzuck deine Lieblingssachen machen kannst: Kaffee, Smoothies, Toast, Tee oder Kuchen. Eine Spülmaschine ist natürlich ebenfalls vorhanden – damit du deine Zeit nicht mit dem lästigen Abwasch verschwenden musst.
Diese Wohnung hat alles, wonach du dich sehnst, wenn du kaputt von der Arbeit kommst und dich einfach nur in den Kissen rekeln willst, um Vivaldis Vierjahreszeiten zu lauschen.
Das ist dein Premium-Theme, das viele zusätzliche Funktionen hat. Mit diesem Theme bekommst du deine Website schneller und einfacher nach deinem Geschmack hin als mit einem kostenlosen Standard-Theme.
Mit dem Pagebuilder baust du ruckzuck deine Seiten
Doch dieses 3. Haus hat noch mehr zu bieten.
Zu diesem Haus gehört ein Team von Helfern.
Du hast also nicht nur eine exquisite Wohnungseinrichtung, sondern zusätzlich Hilfe für deinen Haushalt:
eine Köchin, die dein Mittagessen zubereitet,
eine Haushaltshilfe, die deine Wohnung in Schuss hält und
eine Fachkraft, die deine Fenster putzt
Du hast endlich mehr Zeit für deine Hobbys.
Du brauchst keine lästige Hausarbeit machen.
Das ist dein Theme mit Pagebuilder
Der Pagebuilder nimmt dir viel Aufbau-Arbeit ab und hilft dir, Zeit zu sparen.
Die Entscheidung ist gefallen:
Haus Nummer 3 ist es. Hier ziehst du ein.
Nun fehlt dir fast nichts mehr zum Glück in deiner Wohnung.
Oder?
Plugins bringen wichtige Funktionen mit
Fast.
Denn dir fällt ein, dass du ein paar Erweiterungen für dein schickes Haus brauchst:
Du möchtest dich vor Einbruch absichern. Und du brauchst einen Schutz vor Sonneneinstrahlung, damit es im Sommer nicht zu heiß wird in der Wohnung. Also lässt du dir eine Aussenjalousie installieren.
Ein Gartenhäuschen fehlt dir auch noch. Damit du Rasenmäher, Werkzeuge und Fahrräder unterstellen kannst. Deshalb holst du dir vom Baumarkt eines der netten Holzhäuschen, die es als Bausatz gibt.
Außerdem fehlt noch ein gut sichtbares Nummerschild am Garteneingang, damit Besucher dich schnell finden und
ein großer Briefkasten, damit der Postbote mit einem Blick sieht, wo er deine Briefe einwerfen darf.
Und schwups: Schon hat deine WordPress-Installation 4 Plugins bekommen.
Du siehst: Es ist gar nicht soooo kompliziert 😉
Mein Empfehlung zu deinem „Haus“
Mit diesem Theme arbeite ich
Ich arbeite seit Jahren mit dem Theme Divi.
Divi stammt vom Anbieter „Element Themes“. Divi ist ein Theme mit integriertem PageBuilder und wird ständig weiterentwickelt.
Mit so einem PageBuilder kannst du die einzelnen Elemente einer Seite ruckzuck zusammen bauen. Denn der Pagebuilder hat fertig programmierte Module, die du nur noch „zusammenstecken“ brauchst. Wie die Steine eines Lego-Hauses.
Übrigens: Viele sagen mir, dass sie Divi getestet haben und damit nicht zurecht gekommen sind.
Ich fand die Arbeit am Divi zu Anfang auch holperig. Immer wieder bin ich gestolpert. Und tatsächlich: Noch vor wenigen Jahren war Divi etwas sperrig – Anfänger konnten schon mal ihre liebe Not mit dem Divi haben.
Inzwischen ist das Theme richtig gut geworden. Es wurde schneller und es wurden Funktionen eingebaut, die richtig Gold wert sind. Einmal das Theme kennengelernt, können Laien ihre Seitenelemente ohne Probleme ruckzuck zusammenbauen.
Diese 4 Plugins brauchst du wirklich
Was ist ein Plugin?
Ein Plugin ist eine technische Erweiterung der Grundprogrammierung von WordPress.
Leider stellen Plugins immer wieder DIE Schreckgespenster von WordPress dar. Ganz zu unrecht. Denn im Gegensatz zu anderen Systemen kannst du auswählen, welche Plugins du installierst und welche nicht. Das ist ein riesiger Vorteil. Denn je mehr Plugins im System installiert werden, desto „schwerer“ wird das System – die Ladezeit der Website wird immer langsamer. Das stört den Besucher der Website und ist deshalb auch ein Rankingfaktor von Google. Außerdem: Die Website wird anfälliger für Störungen.
Viele Websitebetreiber nutzen leider zu viele Plugins.
Hier also meine Empfehlungen. Du brauchst:
ein Plugin für die Ladegeschwindigkeit
ein Plugin, um Spams zu vermeiden
ein Plugin für deine BackUps
ein Plugin zur Suchmaschinenoptimierung
Vielleicht noch das ein oder andere Plugin zusätzlich. Als Beispiel: Falls du viele Bilder auf deiner Website hast, lohnt sich noch Smash, das den Ladevorgang von Bildern optimiert.
Die wichtigsten Plugins:
Ladezeit der Website:
Ein Caching-Plugin verringert die Ladezeit deiner Website. Und das honoriert Google mit einem besseren Ranking. Ich empfehle dafür WP Rocket oder WP Super Cache.
Kommentar-Spams:
Ein Spam-Plugin sorgt dafür, dass du nicht mit Spam-Kommentare deiner Beiträge überhäuft wirst. Ein gutes Plugin ist Antispam Bee. Vorinstalliert in WordPress ist Akismet – das aber würde ich löschen, da es datenschutzrechtlich bedenklich ist.
Backup des Systems:
Ein Backup-Plugin ist wohl eines der wichtigsten Plugins. Zwar machen gute Hoster von sich aus regelmäßige Backups deiner Website. Aber sicher ist sicher und du hast mit einem Plugin die volle Kontrolle deiner Sicherungen. Ein gutes Plugin ist Backup Draft. Aber auch andere funktionieren gut und machen, was sie sollen.
SEO (Suchmaschinenoptimierung)
Du brauchst ein Plugin für die Suchmaschinenoptimierung. Ich nutze auf unterschiedlichen Websites Yoast SEO und RankMath. Beide Plugins sind gut und richtig wertvoll für dich, um dein Ranking zu verbessern.
von ConstanzeStraub | Mai 24, 2022 | WordPress, Allgemein, Anleitungen
Bevor es mit dem Bau einer Website losgeht, müssen wir überlegen: Mit welchem CMS bauen wir die Website? Meine erste Wahl: WordPress. Das heißt: Auf einem Webspace muss WordPress zunächst installiert werden. Auf den meisten Hostern ist WordPress vorinstalliert. Falls nicht oder wenn du – wie ich – lieber die volle Kontrolle haben möchtest über deine Installation, dann kannst du WordPress sehr gut und einfach selber installieren. Wie das geht, erkläre ich hier in 6 Schritten.
WordPress installieren: 6 einfache Schritte zu deiner perfekten WordPress-Website
Vielleicht hast du mal gelesen, dass kaum jemand ohne Fehlermeldungen WordPress installieren kann. „WordPress ist viel zu kompliziert“ höre ich auch immer wieder. Neulich sagte mir jemand, „dass man für WordPress programmieren können muss“.
Das ist Unsinn. Glaub mir, solche Aussagen sind Mythen. Sie entstehen, weil Anwender aus Unkenntnis Fehler gemacht haben beim WordPress installieren und dann enttäuscht waren, weil es nicht weiterging.
WordPress zu installieren ist nicht schwer. Aber ich gebe es zu: Wenn man nicht aufpasst sind Fehler möglich. Damit gerade Anfänger nicht unnötig enttäuscht werden, habe ich diese kleine Anleitung geschrieben. Mit diesem Fahrplan installierst du ruckzuck und ohne Stress dein WordPress.
Was brauche ich, um WordPress installieren zu können?
Wahrscheinlich hast du mindestens eine Grundvoraussetzung: einen PC oder ein Notebook. Der PC sollte einigermaßen modern sein. Das heißt: Er sollte aktuelle Programme und ein relativ aktuelles Betriebssysteme haben. Arbeitsspeicher sollte auch genügend drauf sein. Dann hast du es später einfacher. Der Browser, das ist das Programm, das dir Internetseiten anzeigt, sollte die neueste Version sein. Natürlich brauchst du auch eine gute Internetverbindung. Je schneller die Verbindung ist, desto mehr Spaß macht die Arbeit an der Website.
Nun kommt das, was du dir zusätzlich holen musst:
Hoster:
Natürlich brauchst du noch einen Hosting-Anbieter. Das ist die Firma, die dir Speicherplatz zur Verfügung stellt. Denn du brauchst einen Platz, auf dem deine Website-Daten „lagern“. Der Hoster bietet dir die Infrastruktur, damit deine Website im Internet gesehen werden kann. Achte hier beim Buchen des Hosters auf Mindestvoraussetzungen: genügend Speicherplatz, PHP, SSL-Zertifikat, Datenbank.
Domain:
Deine Website braucht einen Ort, an dem sie im Internet zu finden ist. Dafür ist die Domain da: Die Domain ist Adresse und Name für deine zukünftige Website. Bei jedem Hoster kannst du deine Domain bestellen.
Datenbank
Eine Datenbank brauchst du, wenn du ein Content Management System (CMS) installierst. WordPress ist so ein System. Andere CMS sind Joomla, Typo 3, Redaxo usw., auch sie funktionieren im Zusammenhang mit einer Datenbank. Aber keine Sorge, du musst dafür nichts großartig machen. Die Datenbank muss lediglich einmal – mit einem Klick – angelegt und später mit WordPress verbunden werden.
Datenzugang – ein FTP-Programm:
Du brauchst eine Möglichkeit, die Daten auf deinen Hoster hochladen zu können. Dafür gibt es sogenannte FTP-Programme. Eine Alternative ist das Web-FTP: Das bieten manche Hoster an. Damit kannst du ohne eigenem FTP-Programm deine Daten hochladen. Sicherer und bequemer ist allerdings ein FTP-Programm wie FileZilla.
WordPress
WordPress ist eine Software, mit der du deine Website erstellen kannst. WordPress ist die technische Grundlage für deine Website. Natürlich gibt es viele weitere Systeme und auch Baukästen wie Wix, Jimdo oder Squarespace, allerdings bevorzuge ich WordPress. Du bekommst WordPress vollkommen kostenlos unter dieser Adresse: wordpress.org.
Zusammengefasst brauchst du:
- ein PC oder ein Notebook
- Hoster
- Domain
- Datenbank
- FTP-Programm
- WordPress
- Auf dem Hoster eine Datenbank anlegen
WordPress funktioniert nur mit einer Datenbank
Eine Datenbank speichert all die Texte, die du auf deiner WordPress-Website schreibst. Auch dein Zugang zu deiner WordPress-Website und andere Passwörter werden in der Datenbank gespeichert. Davon merkst du nichts, denn das Speichern spielt sich im Hintergrund ab. Und du musst auch nichts an der Datenbank machen.
Alles was du machen musst: Einmal eine Datenbank anlegen. Doch keine Sorge: Das Anlegen der Datenbank ist mit einem Klick erledigt.
Über die Benutzeroberfläche deines Hosters wählst du deine Datenbank aus. Wo genau du die Datenbank findest und aktivierst, sieht bei jedem Hoster anders aus. Ich erkläre das am Beispiel von Allinkl, einer meiner Hoster:
- Du loggst dich im Kundencenter bei Allinkl ein.
- Dort im linken senkrechten Menü klickst du auf -> Technische Verwaltung.
- Im nächsten Fenster klickst du rechts auf den roten Schriftzug -> KAS Login.
- Du siehst eine neue Ansicht mit einem neuen senkrechten Menü auf der linken Seite. Hier klickst du auf -> Datenbanken
- Nun siehst du das Fenster -> Datenbanken > Übersicht
- Rechts oben findest du ein kleines Symbol mit einem roten Pluszeichen (+). Und die Option daneben: „neue Datenbank anlegen“..
- Hier klicken und es erscheint ein neues Fenster, in dem du die Beschreibung und das Passwort deiner Datenbank eingeben kannst.
- Speichern
- Nun kommst du automatisch auf die Datenbank-Übersicht mit deiner 1. Datenbank.
- Hier findest du rechts den Datenbanknamen und den Nutzernamen deiner Datenbank.
- Datenbankname, Nutzername und dein Passwort musst du sorgfältig notieren.
Tipp: Lege alle Zugangsdaten in einer Excel- oder Google-Tabelle an.
WordPress von wordpress.org herunterladen
WordPress ist ein Open Source System
Das heißt: WordPress ist kostenlos und kann einfach von der offiziellen WordPress-Website heruntergeladen und für jeden Zweck eingesetzt werden.
Dazu gehst du einfach auf wordpress.org und klickst auf den blauen Button oben rechts.
Falls dir englisch nicht so liegt, gibt es eine deutschsprachige Version der Seite -> de.wordpress.org.
Deine Datenautobahn zu deinem Hoster
Nun hast du WordPress auf deinen Rechner runtergeladen.
Der nächste Schritt ist: WordPress muss nun auf deinen Hoster hochgeladen werden. Dafür brauchst du einen sogenannten FTP-Zugang, die Datenautobahn zu deinem Hoster. Jeder Hoster bietet so einen FTP-Zugang an – du musst nur noch die „Autobahnzufahrt“ anlegen. Also Passwort und Zugangscode. Um im Bild zu bleiben.
Im nächsten Schritt (Schritt 4) erkläre ich dir 2 unterschiedliche Wege, auf welche Art du deine Daten auf deinen Hoster lädst. Aber egal welchen Weg du wählst: Als erstes muss der FTP-Zugang angelegt werden.
Doch keine Sorge: Das Anlegen des FTP-Zugangs ist simpel.
Was ist FTP?
Das Kürzel FTP bedeutet File Transfer Protocoll. Auf deutsch und in einfachen Worten: FTP bedeutet schlicht den Vorgang zur Übertragung von Daten.
Und so gehst du bei Allinkl vor:
- Du loggst dich (du kennst das bereits) im Kundencenter bei Allinkl ein.
- Dort im linken senkrechten Menü klickst du auf -> Technische Verwaltung (kennst du auch schon).
- Im nächsten Fenster klickst du rechts auf den roten Schriftzug -> KAS Login.
- In dem neuen Fenster klickst du im linken, senkrechten Menü auf -> FTP.
- Es öffnet sich das Fenster -> FTP > Zugang
- Dort siehst du oben auf der rechten Seite ein kleines Seiten-Symbol mit einem roten Pfeil und der Option daneben -> „Neuen FTP-Nutzer anlegen“.
- Diese Option klickst du an.
- Es öffnet sich ein neues Fenster.
Hier kannst du wie bei der Datenbank eine Beschreibung deines FTP-Zugangs notieren (optional). Ein Passwort ist Pflicht — nimm hier ein sicheres Passwort, möglichst 12-stellig und mit Sonderzeichen und Ziffern (ohne Umlaute)
Das Feld Pfad kannst du leer lassen, dann siehst du beim Einwählen auf deinen Webspace immer alle Verzeichnisse, die du angelegt hast (du bist dann im sogenannten Rootverzeichnis, dem obersten Verzeichnis).
Abschließend wie immer -> Speichern.
- Du kommst dann zurück auf das Übersichtsfenster.
- Dort siehst du nun deine FTP-Verbindung in einer kleinen Tabelle angelegt.
- Den Benutzernamen musst du dir gut notieren, ebenso dein gewähltes Passwort und den FTP-Server
Den FTP-Server nennt dir dein Hoster. Auf Allinkl findest du die Bezeichnung des Servers, wenn du in deiner FTP-Tabelle auf das rechte, kleine, rote Seitensymbol mit dem roten Pfeil klickst: Es öffnet sich ein Fenster mit all den Daten, die du für deinen FTP-Zugang brauchst. Hier kannst du auch dein Passwort ändern.
Hinweis: Auf der Tabellenansicht deines FTP-Zugangs findest du einige grüne Haken. Wenn die Buchstaben R, W, L, V jeweils einen grünen Haken haben, dann ist bei dir alles richtig eingestellt.
Deinen WordPress-Ordner auf den Hoster hochladen
Zwei Wege, um Daten per FTP hochzuladen
Möglichkeit 1
Hochladen mit dem Web-FTP
Du kannst den WordPress-Ordner mit den Web-FTP deines Hosters hochladen. Viele Hoster bieten diese Möglichkeit an. Web-FTP bedeutet: Über das Login deines Hosters kannst du Daten direkt mit dem Browser wie Firefox oder Chrome (oder jeden beliebigen Browser) hochladen.
Und so geht das bei Allinkl:
Wenn du das noch nicht getan hast, legst du zunächst deinen FTP-Zugang an. Wie das geht, hab ich in Schritt 3 erklärt.
Dann gehst du wieder in das KAS.
- Im KAS klickst du wieder im linken, senkrechten Menü auf -> FTP.
- Jetzt bist du wieder im Fenster: FTP > Übersicht.
- Dort steht unten in der Tabelle dein angelegter FTP-Zugang.
- Du klickst auf das linke Symbol mit den 2 kleinen roten Kästchen (wahrscheinlich sollen das Rechner sein)
- Es öfffnet sich ein neues Fenster in deinem Browser: Du siehst nun die Verzeichnisstruktur auf deinem Hoster.
- Dein Verzeichnis mit dem Namen deiner Domain klickst du an, es öffnet sich ein neues Fenster.
- Hier siehst du oben ein horizontales Menü. Dort auf -> Upload klicken.
- Nun kannst du auf -> Durchsuchen klicken.
- Nun wählst du deinen gezippten WordPress-Ordner aus, der auf deinem PC liegt. Wichtig: Es kann nur der gezippte WordPress-Ordner hochgeladen werden.
- Wenn der gezippte Ordner hochgeladen ist, muss er noch entzippt werden.
- Dazu klickst du das kleine weiße Auswahlkästchen links neben dem Symbol der gezippten WordPress-datei aus.
- Dann gehst du auf > Aktionen.
- Es öffnet sich ein Auswahlfeld, hier klickst du auf > Archiv entpacken.
- Mit > ok bestätigen.
- Nun wird der WordPress-Ordner entpackt. Das dauert ein paar Minuten, einfach abwarten.
- Wenn alles entpackt ist, kannst du wieder auf > ok klicken.
Möglichkeit 2
Hochladen mit einem FTP-Programm
Ich nutze zum Hoch- und Runterladen von Dateien immer ein FTP-Programm. Der Grund ist ganz einfach: Hier kann ich sämtliche Zugänge zu allen möglichen Hostern zentral anlegen. Ich brauche dazu nicht jeden Hoster extra aufrufen, alle Zugänge habe ich in meinem FTP-Programm gespeichert. Falls du nur einen Hoster hast, reicht auch das Web-FTP für dich aus. Wenn du mehrere unterschiedliche Zugänge verwalten möchtest, ist das FTP-Programm komfortabler. Außerdem hast du mit dem Programm noch einige zahlreiche Möglichkeiten.
Gute und kostenlose FTP-Programme sind FileZilla und CyberDuck.
Damit du mit einem FTP-Programm deine Daten hoch- oder runterladen kannst, musst du bei deinem Hoster zunächst einen FTP-Zugang einrichten. Wie das geht, hab ich oben in Schritt 3 erklärt.
Das FTP-Programm musst du vorher noch einrichten. Dort trägst du die Daten ein, die du erhalten hast, als du den FTP-Zugang bei Allinkl angelegt hast.
Verzeichnisstruktur anpassen
Ein wichtiger Schritt, der oft vergessen wird.
Hierauf musst du achten, damit es nicht zu Fehlermeldungen kommt.
Wenn du dein WordPress-Ordner hochgeladen hast, muss du sehr wahrscheinlich die Verzeichnisstruktur auf deinem Hoster anpassen. Was es damit auf sich hat erkläre ich hier:
Du kennst es ich von deinem PC oder Mac: Jedes deiner Dokumente ist in einem „Ordner“ angelegt. Deine Apps (Programme) sind ebenfalls in einem „Ordner“, dem Ordner „Programme“. Und so weiter. Nun wunderst du dich, dass ich „Ordner“ in Tüddelchen gesetzt habe… Natürlich sind die Ordner nicht wirkliche Ordner, wie wir sie aus dem analogen Leben kennen, sondern Verzeichnisse. Und genau solche Verzeichnisse befinden sich auf deinem Hoster.
Wenn du eine Domain hast bei Allinkl, dann kannst du beim Einloggen über FTP sehen, dass dort ein Verzeichnis steht, das den Namen deiner Domain hat. Beispiel: Wenn du eine Domain hast, die „sabinemeier.de“ heißt, dann liegt in deinem FTP-Bereich ein Verzeichnis mit dem Namen sabinemeier.de.
Du kannst das Verzeichnis öffnen, darin befindet sich die Datei index.htm. Das ist eine voreingestellte Standarddatei, die immer in neuen und damit leeren Verzeichnissen liegt. Sie sorgt dafür, dass du eine Platzhalterseite mit dem Logo von Allinkl siehst, wenn du deine noch leere Domain sabinemeier.de aufrufst (um im Beispiel zu bleiben).
Wenn du nun in dieses Verzeichnis deinen Ordner WordPress hochgeladen hast, dann steht dort immer noch diese index.htm von Allinkl. Aber du möchtest natürlich, dass dein neues WordPress aufgerufen wird, wenn du deine Domain in den Browser eintippst. Und nicht die index.htm.
Wie das geht?
Du musst ein interne Umleitung einrichten. Damit sagst du dem System: Im Browser des Besuchers soll nicht die Platzhalterseite index.htm von Allinkl angezeigt werden, sondern die Startseite, die in deinem hochgeladenen WordPress-Ordner liegt.
- Das machst du so:
- Du loggst dich wieder bei Allinkl ein.
- Wieder auf technische Verwaltung.
- Dann gehst du wie gehabt auf KAS Login.
- Hier im linken senkrechten Menü klickst du auf Domain.
- Du erhältst eine Übersicht all deiner Domains.
- In der Zeile, in der deine Domain gelistet ist, klickst du auf das linke, kleine Symbol, das rote Dokumentsymbot mit dem roten Pfeil.
- Es öffnet sich ein neues Fenster.
- Hier kannst du ein Ziel angeben für deinen Webspace.
- Damit die Inhalte in deinem WordPress-Ordner angezeigt werden, gibst du in das Feld bei Ziel einfach den Namen deines Ordners an. Das ist in der Regel eben „wordpress“. Wenn du den Ordner umbenannt hast in „meinetolleseite“, dann muss dein Ziel natürlich „meinetolleseite“ heißen. Natürlich immer ohne Tüddelchen und hinter einem Slash (/).
- Nun wird beim Aufruf deiner Domain auf den Inhalt deines WordPress-Ordners verwiesen – und nicht mehr auf die index.htm.
WordPress mit der Datenbank verbinden
WordPress installieren heißt: mit der Datenbank verknüpfen
Dieser Schritt ist die eigentliche Installation. Du hast dein WordPress zwar hochgeladen – aber damit ist noch nichts erreicht. WordPress funktioniert nur in Verbindung mit einer Datenbank. Darum musst du im nächsten Schritt WordPress mitteilen, wie die Datenbank heißt und welches Passwort sie hat. Erst dann kann WordPress mit der Datenbank kommunizieren.
- Den Installationsprozess startest du, indem du deine Domain in die Adresszeile deines Lieblingsbrowsers eingibst (Firefox, Chrome, Safari – was du willst).
- Hinter der Domain tippst du ein Slash (/).
- Und direkt hinter dem Slash tippst du „wpadmin“ oder einfach „admin“ ein – ohne Anführungszeichen natürlich.
- Beispiel: sabinemeier.de/wpadmin
- Dann Entertaste drücken.
- Es öffnet sich ein Fenster, in dem du weiterklicken kannst zum nächsten Schritt.
- Nun erscheint ein großes weißes Formularfenster.
- Hier gibst du die Daten zu deiner Datenbank ein, die du vom Hoster erhalten hast.
- Für das Feld „localhost“ kannst du probieren: Häufig passt „localhost“ und du musst nichts ändern. Bei Allinkl bleibt es bei localhost. Andere Hoster aber könnten einen anderen Datenbankhost haben. Das erfährst du bei deinem
- Hoster. Du findest diese Angaben im Kundenlogin deines Hosters. Falls das nicht zu finden ist: einfach beim Hoster anrufen.
- Das Feld Tabellenpräfix kannst du unverändert lassen.
Damit ist die Installation fertig.
Wenn alles geklappt hat und du dich nicht vertippst hast, erhältst du von WordPress eine Erfolgsmeldung.
von ConstanzeStraub | Feb. 23, 2022 | WordPress, Allgemein, Anleitungen
5 mögliche Menüs und wie sie umgesetzt werden
Außerdem: 5 Fehler, die du beim Aufbau deines Menüs vermeiden solltest
Du möchtest die Besucher sicher durch deine Website führen? Du möchtest ein WordPress Menü erstellen? Dann brauchst du nicht nur eine gute Navigation. Du brauchst mehrere Menüs an verschiedenen Stellen deiner Website. Die schlechte Nachricht: In WordPress ein Menü erstellen kann verwirrend sein. Je nach Theme hast du mehrere Möglichkeiten, wie und wo du Menüs auf deiner Website einsetzt. Die gute Nachricht: Eine durchdachte Navigation anzulegen ist technisch einfach. Ich zeige dir hier, wie du Menüs in WordPress erstellst.
Welche Menüs gibt es?
WordPress selber bietet von Haus aus drei Menüpositionen an. Wo die Menüs stehen, wie genau sie aussehen – das hängt von deinem Theme ab. Denn jedesWordPress- Theme bietet unterschiedliche Menüpositionen an. Deshalb ist als 1. Frage sinnvoll: Wo soll deine Navigation stehen? Für die Antwort darauf musst du folgendes wissen:
- Welche Menüs gibt es überhaupt?
- Welche Menüs bietet dein Theme?
- Welche Positionen können Menüs auf der Website haben?
In WordPress arbeite ich mit dem Theme Divi. Mit WordPress + Divi sind die gängigsten Menüs mit den gängigsten Positionen möglich. Falls du ein anderes Theme benutzt, kann es sein, dass das ein oder andere Menü anders aussieht. Aber ich bin sicher: Meine Anleitungen werden dir weiterhelfen.
Hauptmenü – ein Must-have und das Leitsystem deiner Website
Mit dem Hauptmenü ist die Navigation gemeint, die auf einer Website die erste Geige spielt. Hier werden die wichtigsten Seiten deiner Website angesteuert. Was du wissen solltest: Das Hauptmenü kann verschiedene Positionsmöglichkeiten haben. In dieser Anleitung zeige ich dir, wie ein horizontales Menü am Kopf der Seiten in WordPress erstellt wird.
Footermenü: das Menü am „Fuß“ der Seiten
Das Footermenü findest du im untersten Bereich einer Website. Eben im Footer. Das ist der Bereich, der die einzelnen Seiten deiner Website abschließt und dem Besucher sagt: Weiter kannst du nicht scrollen. Ein Footermenü ist sinnvoll, weil damit die Besucherin ohne scrollen zu müssen weitere Unterseiten findet. Wenn du im Footer ein WordPress Menü erstellen möchtest, hast du mehrere Möglichkeiten. In dieser Anleitung zeige ich dir, wie du ein vertikales Footermenü und wie du ein horizontales Footermenü erstellst.
Sekundäres Menü — eine Linkleiste im Headerbereich
Das Sekundäre Menü steht im Headerbereich oberhalb vom horizontalen Hauptmenü. Dieses Menü ist eher auf großen Portalen sinnvoll. Auf Shopseiten oder mehrsprachigen Seiten kann diese Leiste sinnvoll sein, wenn Warenkorb, Login oder die Sprachauswahl untergebracht werden sollen. Weitere mögliche Elemente sind die Such-Lupe, Social-Icons, deine Telefonnummer oder die Mailadresse.
DropDown-Menü — die Erweiterung des Hauptmenüs
Wenn du ein nicht sichtbares WordPress Menü erstellen möchtest, wählst du das Das DropDown-Menü. Es wird auch Untermenü oder Submenü genannt. Der Name sagt es bereits: Es ist ein „Klappmenü“. Das heißt: Die Besucher klicken zuerst ein Link im Hauptmenü an, damit das Untermenü aufklappt. Sinnvoll ist das DropDown-Menü, weil in der horizontalen Menüleiste nicht mehr als sieben Links angeordnet sein sollten. Je weniger Links im Hauptmenü, desto übersichtlicher ist die Navigation. Der Rest kommt ins DropDown.
Horizontales WordPress Menü erstellen im Header
Eine einzelne Webseite wird in verschiedene Bereiche eingeteilt:
Der zuerst sichtbare Bereich ist der Header. Der Header ist der Kopfbereich einer Webseite. Deshalb wird hier in der Regel das Hauptmenü angebracht. Gut zu wissen: Die Seiten können so eingestellt werden, dass die Navigation auch beim Scrollen oben stehen bleibt. Und so kommst du zum wichtigsten Menü deiner Website:
Schritt 1
Seiten in WordPress anlegen
Damit du überhaupt ein Menü in WordPress sehen kannst, möchte WordPress zunächst Seiten haben. Der umgekehrte Weg – erst Menü, dann Seiten – ist zwar auch denkbar und technisch möglich, aber umständlich. Der erste Schritt also: Seiten anlegen. Auch inhaltlich ist das sinnvoll, denn dann machst du dir vor dem Anlegen der Website Gedanken über deine Inhalte.
Ich erlebe es immer wieder, dass Websitebetreiber zuerst an das Menü denken. Ohne bereits Seiten zu haben. Das ist, als würden sie erst den Sattel kaufen und dann das Pferd… Apropos: Hast du ein Konzept für deine Website? Das ist nämlich sehr sinnvoll und erleichtert dir die Arbeit. Falls du Tipps brauchst, lies gern meine Anleitung, wie du ein Konzept für deine Website erstellst > klick hier
Schritt 2
Bereich „Menüs“ im Dashboard von WordPress öffnen
Du loggst dich wie gewohnt in deine WordPress-Installation ein. Standardmäßig öffnet sich das Dashboard deiner Installation. Hier siehst du links die vertikale Menüleiste mit den Optionen, die du zum Aufbau deiner Website ansteuern kannst. Diese vertikale Menüleiste beginnt oben mit
- > Dashboard, dann
- > Beiträge, dann
- > Medien, dann
- > Seiten
Weiter unten findest du den Link Design. Dieser Menüpunkt enthält den Punkt Menüs. Es gibt 2 Möglichkeiten, zum Bereich Menüs zu kommen.
Möglichkeit 1:
Du „schwebst“ mit dem Mauscurser über den Begriff Design (ohne zu klicken!).
Es öffnet sich nach rechts ein Kontextfenster
Hier findest du unter den aufgeführten Links wie Themes, Customizer, Widgets den Punkt Menüs
Menüs anklicken.
Möglichkeit 2:
Diesmal klickst du auf Design
Das vertikale Hauptmenü in deinem Dashboard öffnet sich nach unten.
Nun siehst du im Menü unter Design dieselben Menüpunkte wie in Möglichkeit 1)
Schritt 3
Den Namen des Menüs eintragen
Wenn du auf Menüs geklickt hast, dann öffnet sich im Dashboard ein neuer Bereich. Das ist der Menübereich. Im Bereich Menüs kannst du deine Navigationen definieren, anlegen und ändern. Links im Bereich findest du einen Kasten Menüeinträge hinzufügen und rechts den Kasten Menü-Struktur. So gehst du vor:
- im Kasten Menü-Struktur findest du das Feld Name des Menüs
- hier trägst du einen beliebigen Namen für dein Menü ein
- dabei ist es sinnvoll, einen eindeutigen Namen zu wählen
- anschließend klickst du auf den blauen Button Menü erstellen.
Schritt 4
Seiten auswählen und dem Menü hinzufügen
Wenn du noch keine Seiten angelegt hast, dann ist das Feld Menüeinträge hinzufügen grau. Ansonsten ist das Feld wie der Kasten Menü-Struktur weiß. Nun kannst du Seiten auswählen. Standardmäßig ist hier der Tab Zuletzt erstellt vorausgewählt. So gehst du vor:
- Gewünschte Seite in der Checkbox links neben der Seitenbezeichnung auswählen
- du kannst auch mehrere Seiten auswählen -> dann mehrere Checkboxen anklicken
- auf den Button klicken: Zum Menü hinzufügen
- anschließend werden die Seiten rechts unter Menü-Struktur als Button dargestellt.
Diese Button kannst du wie erwähnt aufklappen. Im Feld Angezeigter Name kannst du den Namen der Seite ändern. Wichtig: Wenn du hier den Seitennamen änderst, dann ändert sich nicht die URL der Seite! Es wird lediglich die Linkbezeichnung innerhalb des Menüs geändert. Du kannst den Seiten also nach Herzenslust an dieser Stelle neue Namen vergeben.
Schritt 5
So ordnest du dem Hauptmenü eine Position im Theme zu
Nun muss WordPress noch mitgeteilt werden, an welcher Stelle der Website dein neues Menü stehen soll. Soll es im Header stehen? Oder im Footer? Auch das ist kein Hexenwerk: Du setzt einfach einen Haken. Das machst du so: Im selben Feld – im Feld Menü-Struktur – findest du die Option Menü-Einstellungen. Darunter 4 Auswahlfelder, die du jetzt anklicken kannst. Da dein neues Menü als Hauptmenü erscheinen soll, muss die Checkbox Hauptmenü angeklickt werden. Ganz simpel. Oder?
Dasselbe wird später mit dem horizontalen Footermenü und dem Sekundären Menü gemacht.
Seiten automatisch hinzufügen: Diese Auswahlbox kann ebenfalls angeklickt werden. Ich lass diese Box immer deaktiviert, denn es gibt immer mal Seiten, die nicht hinzugefügt werden sollen (wie das Impressum). Zum Abschluss speichern nicht vergessen.
5 Fehler, die du beim Erstellen eines Menüs vermeiden solltest
1. Das Menü hat zu viele Links
Wenn das horizontale Hauptmenü zu viele Menüeinträge hat, wird es unübersichtlich für deine Besucher. Denn die Leser haben keine Zeit zu raten, wo genau was sein könnte… Ein anderer Punkt ist die geringe Aufmerksamkeit für Details: Die Besucher wollen sich auf die Inhalte konzentrieren. Bedienelemente wie Menüpunkte sollten deshalb schnell verstanden werden. Es gibt Untersuchungen, wonach bis zu 7 Links noch gut in Erinnerung bleiben. Je besser Elemente im Gedächtnis bleiben, desto schneller kann sich die Besucherin durch die Website navigieren: Sie muss nicht ständig suchen und überlegen.
2. Die Navigationsleiste läuft zu breit
Manchmal sehe ich horizontale Navigationen, die zwar eine übersichtliche Anzahl an Links haben, aber zu breit laufen. Zu breit laufende Menüs sind natürlich genauso problematisch. Passieren kann das, wenn für die Links im Menü Wörter gewählt werden, die einfach zu lang sind. Bei kleinen Monitoren wie Tablets in der Queransicht oder Notebooks reicht dann der Platz nicht mehr aus – das Menü erhält einen Umbruch. In einem Menü mit Umbruch kann man schlimmstenfalls nicht mehr navigieren, weil sich die Links überlagern oder weil das Submenü nicht mehr angeklickt werden kann. Deshalb: Die Website auch immer auf kleinen Displays ausprobieren.
3. Unwichtige Links im Hauptmenü
Klar, das Impressum ist wichtig. Aber nicht für deine Besucher. Jedenfalls in der Regel. Das Impressum und andere rechtliche Angaben wie der Datenschutzhinweis sind gesetzliche Vorgaben. Es sind Seiten, die die meisten Besucher eher selten bis gar nicht besuchen. Warum also sollten ausgerechnet gesetztliche Pflichtangaben im Hauptmenü stehen? Schließlich ist dort am wenigsten Platz. Mein Tipp: Stell solche Links ganz nach unten. In die unterste Footerleiste.
4. Die Schrift der Links ist schlecht zu lesen
Zu kleine Schrift oder ein schlechter Kontrast: Wenn die Schrift im Hauptmenü nur undeutlich gelesen werden kann, dann muss mehr Zeit investiert werden, um die einzelnen Seiten zu finden. Die Besucher werden unnötig aufgehalten und springen unter Umständen entnervt ab. Mach es deinen Lesern so einfach wie möglich, deine Seiten zu finden. Ein wichtiger Schritt dahin ist eine gut lesbare Navigation.
5. Stumme Links: Menüpunkte, die nichts aussagen
Anbahnung, Mag ich, Katzenliebe… Was mag sich wohl hinter diesen Menüpunkten verbergen? Schwachpunkte eines Menüs sind Linkeinträge (Menüpunkte), die man nicht versteht. Mach es auch hier deinen Besuchern so einfach wie möglich. Lass sie nicht raten, sondern wähle „sprechende“ Links. Gut sind Begriffe, bei denen ohne zu überlegen sofort klar ist, welche Seiten man dahinter findet. „Über mich“? Klar, hier schreibt jemand über sich, was ihn oder sie ausmacht oder ihr Werdegang. „Kontakt“? Versteht sich von selbst, was dort zu finden ist. Auch wenn’s mal langweilig wirkt – du tust deinen Besuchern einen Riesengefallen, wenn du dich an anderer Stelle kreativ austobst.