Mein Blog https://horstsondermann.com ist eine Website mit einem WordPress-Content-Management-System. WordPress selbst ist Open-Source-Software – ein rudimentärer Blog lässt sich recht einfach damit einrichten. Will man ein bestimmtes Layout, Videoeinbindung, Newsletter etc., dann braucht man zusätzliche Tools, etwas Geld und moderne Nerven. Hier mein Bericht.
Ich sollte vorab darauf hinweisen, dass ich kein Experte für Webseiten bin – das merkt Ihr dann schon. Und: Ich werde von keinem der Hersteller unten gesponsert. Mit keinem der Links in diesem Post verdiene ich Geld. Ich habe mit niemand außer Amazon einen Affiliate-Vertrag, und der Laden spielt in diesem Post keine Rolle.
Im Gegenteil habe ich für das Meiste, was ich Euch hier präsentiere, Geld ausgegeben bzw. tue es noch.
Mir geht es vor allem darum, Euch an den Ergebnissen meiner Tests und Trial & Error-Feldversuche teilhaben zu lassen. Ich habe selbst auch was davon: Ich kann selbst später nachlesen, wie ich all die Dinge gehändelt habe, als ich meinen Blog einrichtete.
Hier ein Überblick, was Euch erwartet:
- Domainfactory: Heimat meiner Website
- SSL-Zertifizierung: Das s in https
- Theme: Wie soll es aussehen?
- Genesis Framework und Sample: Theme der Wahl
- CSS-Hero: Fonts, Farben, Layout
- Yoast SEO: nimmt es mit Google auf
- Bin ich attraktiv? Google Analytics
- Ladebeschleunigung: WP Rocket und LazyLoad
- Imagify: Bildoptimierung
- WP Broken Link Checker: Checkt broken links
- Hacker-Abwehr: WP Limit Login Attempts
- Backup/Wiederherstellung: UpdraftPlus
- Kein Blog ohne Newsletter
- Mail-Adressen sammeln: Sumo
- Wie kommt der Post in den Newsletter? RSS-Feed
- Newsletter verschicken: ActiveCampaign
- Nicht nur bei YouTube: Video Showcase mit YourChannel
- Mehr Schreibwerkzeuge: TinyMCE Advanced
- Linkziel verfehlt? Hash Link Scroll Offset
- Farbe für den Texteditor: HTML Editor Syntax Highlighter
- Muss sein: Access Press Social Icons
Domainfactory: Heimat meiner Website
Eine Website wie https://horstsondermann.com ist eine Sammlung von Dateien. Den Kern bildet in meinem Fall (WordPress-System) eine Datenbank – mit den Posts, Links etc. als Datensätzen. Alles zusammen liegt in einem Ordner auf einem Server, der in meinem Fall bei der Firma Domainfactory steht, meinem Web-Hoster. Dieser Hosting-Service kostet ca. 15 €/Monat.
Nach oben
SSL-Zertifizierung: Das s in https
Das s in https steht für secure und bedeutet, dass im Gegensatz zu einer bloßen http-Webseite die Verbindung zwischen Browser und Webserver verschlüsselt ist. Deswegen auch das kleine Schloss-Icon in der Adressleiste Eures Browsers, wenn Ihr eine https-Seite aufruft.
Das s kostet Geld: Man muss dafür bei seinem Webhoster ein sogenanntes SSL-Zertifikat kaufen, welches bei Domainfactory pro Jahr ca. 24 € kostet:
Ich bin nicht vom Fach, deswegen ein Verweis auf Wikipedia: Dort heißt es, der Standard heiße seit 1999 TLS, erscheine aber im Seiten-Header als SSL3.1. Ist auch egal, weil es bei der Zertifikation diesbezüglich eh keine Wahl gibt.
Bis jetzt wäre es in meinem Fall eigentlich nicht so dramatisch, wenn die Verbindung zwischen Eurem Browser und meiner Webseite nicht verschlüsselt wäre. Denn wir tauschen ja keine empfindlichen Daten wie Kreditkarten-Informationen aus.
Trotzdem hilft mir das s dabei, als seriöser Content-Anbieter wahrgenommen zu werden. Immerhin biete ich einen Newsletter an, für den Ihr Euch mit Angabe Eurer Mail-Adresse anmelden könnt. Die kann dann schon mal kein Hacker auslesen.
Auch Google’s Lighthouse-Tool, mit dem Ihr die Qualität jeder x-beliebigen Webseite checken lassen könnt, bewertet eine https- besser als eine http–URL. Nochmals bei Wikipedia, gleicher Artikel: “Seit Januar 2017 markiert der Web-Browser Chrome Internetseiten als unsicher, die Informationen sammeln, ohne dabei HTTPS zu nutzen.”
Theme: Wie soll es aussehen?
In einem WordPress-System sind Inhalt und Aussehen technisch getrennt. Der Inhalt – Content genannt – sind die Posts, Links, Seiten etc., also alles, was man so in WordPress schreibt und an Bildern einfügt. Wie der Content dagegen auf der Webseite aussieht, wird mithilfe eines sogenannten Theme gesteuert, das Ihr prinzipiell jederzeit austauschen könnt, ohne Eure Daten zu verlieren. Ein Theme bestimmt den Look Eurer Daten vor allem mithilfe von Cascading Style Sheets (CSS-Dateien). Es kann aber noch mehr Dinge steuern und Features bereitstellen (z.B. eine Galeriefunktion für Fotografen) – die Sache ist also etwas komplex.
Theoretisch braucht man sich nicht um diese Frage zu kümmern, denn WordPress stellt mit der Installation ein Theme bereit, das sofort anstandslos funktioniert. Zur Zeit ist das Twenty-Seventeen (“2017”):
Es erfüllt auch alle Basis-Funktionen – Ihr könnt Posts schreiben, Video und Bilder einfügen, alles verschlagworten, taggen, Seiten anlegen. Das Theme ist auch responsiv, passt sich also diversen Interfaces an (Mobil, Tablet, PC).
Für jemand, der nicht gern in den HTML– und CSS-Innereien der Theme-Files herumeditiert, ist das Theme aber nur begrenzt anpassbar, was das Layout betrifft. Das ist – für mich auf jeden Fall – sein größter Nachteil.
Deswegen mache ich mich jedesmal, wenn ich einen neuen Blog einrichte, auf die Suche nach einem anderen, “schickeren” Theme. Es ist gar nicht so leicht, hier durchzublicken, wenn man nicht vom Fach ist. Warum? Die meisten sogenannten Testberichte (so in der Art: “Best 10 Themes for Photographers 2017“), die man beim Googeln findet, sind nicht wirklich informativ. Es kommen immer alle Kandidaten sehr gut weg, man erfährt nur wenig über konkrete Einschränkungen eines Theme, die Beschreibungen sind für einen Nicht-Nerd meist recht geheimnisvoll.
Und komischerweise sieht alles nach dem Installieren immer gar nicht so aus wie auf den Screenshots der Theme-Anbieter …
Genesis Framework und Sample: Theme der Wahl
Für meinen aktuellen Blog habe ich mich für das Genesis-Theme von Studiopress entschieden. Warum? Um ehrlich zu sein, weil mir die vielen Rezensionen den Eindruck vermittelt haben, dass es nachhaltig ist. (Denkt dran: Ich bin kein Studiopress-Affiliate!)
Zuerst mal: Genesis ist eigentlich gar kein Theme, sondern ein Framework. In anderen Kontexten würde man so etwas ein Template nennen, also eine Vorlage, die man kopiert und dann diese Kopie für einen bestimmten Zweck editiert. In der Welt der Themes heißt eine solche Kopie Child (-Theme). Und ja, auch ich verwende ein Genesis-Child (Genesis Sample, das Child-Theme, das gratis mit dem Framework geliefert wird).
Und was heißt jetzt nachhaltig? Ich hatte mal ein Theme (gekauft!), dessen Entwicklung ein Jahr später eingestellt wurde. Das ist kein Spaß, glaubt mir – Ihr könnt nämlich leider nicht mit einer Alt-Version arbeiten, wenn WordPress selbst immer weiter entwickelt wird. Und das wollt Ihr wiederum sehr wohl.
Also, nachhaltig heißt: So ein Theme oder Framework wird von unglaublich vielen Blogs verwendet. D.h. seine Hersteller haben finanziell etwas davon, es am Leben zu halten. Es ist auch schon einige Zeit am Markt, hat also bereits einen gewissen Reifungsprozess durchlebt. Es ist deshalb auch gut dokumentiert – vom Hersteller selbst, aber auch durch all die User, die Tutorials schreiben und Videos dazu machen. Es gibt sehr viele Child-Themes, die auf Genesis basieren. Das heißt: Selbst wenn ich mein Layout satt habe, kann ich mich im vertrauten Genesis-Framework neu aufstellen, ohne riskieren zu müssen, etablierte Datenstrukturen zu ändern.
Vereinfacht ausgedrückt: Ich habe zwar keine Ahnung, wie sich meine Webseite entwickelt und was ich dann vielleicht anpassen muss. Ich habe aber mit Genesis ein Framework, was mir oder – hoffentlich – einem bezahlten Dienstleister den geschmeidigen Relaunch meiner Seite ermöglicht.
Das Genesis Framework kostet – es ist ein Premium Theme (klingt irgendwie nach Immobilienbranche): zur Zeit 60 $. Da ist dann das genannte Child Theme namens Genesis Sample dabei.
Eine Rezension zu Genesis findet Ihr hier und hier – unter anderem.
Nach oben
CSS-Hero: Fonts, Farben, Layout
Jetzt zu den Plugins. Ihr wisst wahrscheinlich: Das sind die wichtigsten Tools nach dem Theme, die man als Seitenbetreiber installieren will, um die Funktionalität zu erweitern. Viele sind umsonst und können direkt aus dem WordPress-Dashboard heraus installiert werden. Die guten Plugins haben meistens eine Bezahl-Variante (Premium), die mehr Funktionen bietet. Soviel vorab.
Mein erstes Plugin ist CSS Hero. Es erlaubt mir als eher gestaltungsaffinem Mensch, intuitiv das Aussehen meiner Webseite zu steuern: Fonts, Zeilenabstände, Farben, Umrandungen, (allerhand Schnickschnack wie Buttons, Checkboxen, was ich eher nicht brauche) – und das Ganze für PC-, Tablet- und Mobiltelefon-Screens anpassbar:
Das sind alles Dinge, die ich ohne das Plugin über Eingriffe in die CSS-Dateien des aktiven Theme regeln kann. Insofern ist das Plugin theoretisch überflüssig. Praktisch ist es aber eine enorme Erleichterung, eben weil ich mich nicht mit CSS beschäftigen muss. Allein die Live-Vorschau ist Gold wert.
Ich habe CSS Hero 2 installiert, es kostet einmalig 35 $. Damit kann man 6 Webseiten händeln. Jetzt gerade kam eine neue Version 3 raus. Leider kann man die nicht einfach über Version 2 rüber-installieren – ich warte also noch ein wenig, bis ich das bei mir integriere. Deswegen hier und jetzt nur meine Empfehlung für CSS Hero 2 – es ist die 35 $ in jedem Fall wert.
Hier gibt’s ein Video zum Einsatz des Plugins (Version 2).
Nach oben
Yoast SEO: nimmt es mit Google auf
Nach Theme und CSS-Editor nun das nächste Superthema eines jeden Seitenbetreibers: Ich will mit meiner Seite gefunden werden. Hier kann man als Betreiber und Autor viel machen, damit Suchmaschinen die eigene Seite höher ranken als andere. Der Fachbegriff heißt hier Search Engine Optimization – kurz SEO.
Es ist kein Wunder, dass sich das Ganze zu einem eigenen Geschäft für Dienstleister entwickelt hat. Denn: Erstens ist es für fast alle Seitenbetreiber essentiell, möglichst weit oben auf den Suchlisten zu stehen (denn fast alle müssen mit ihren Seiten Geld verdienen) und zweitens kann kein normaler Mensch wissen, nach welchen Kriterien die großen Suchmaschinen, allen voran Google, Seiten gerade genau ranken.
Hier kommt das Plugin eines niederländischen Unternehmens ins Spiel: Yoast SEO. Das Plugin macht Folgendes: Bei der Erstellung von Posts (aber auch Seiten, Links etc.) checkt es, wie gut der Inhalt gefunden werden kann. Dazu wird die Vergabe von Keywords in Betracht gezogen, wie häufig diese im Text erscheinen usw.
Der Sinn des Plugins ist, dass ich mir als Nicht-Experte nicht merken muss, was ich alles tun kann, um Google die Sucharbeit zu erleichtern, sondern dass mir echte Experten live alle nötigen Hinweise dazu geben.
Was noch dazu kommt, ist die Überprüfung der Lesbarkeit meines Contents – auch hier begleitet mich das Plugin wohlwollend mit Korrekturvorschlägen. Während ich dies schreibe (ich habe noch keine Bilder eingesetzt), sagt mir Yoast SEO zum Beispiel Folgendes:
Wie Ihr richtig vermutet, muss das Plugin dazu gut Deutsch können. Das tut es und es ist sicher auch einer der Hauptgründe für seine Beliebtheit – dass es nicht auf den englischen Sprachraum beschränkt ist. Ich verwende das Plugin nach längerer Gratis-Testphase jetzt in der Premium-Version. Auf der Seite von yoast.com könnt ihr sehen, was die gegenüber der Gratis-Variante macht. Yoast SEO Premium kostet 105 $ pro Jahr.
Nach oben
Bin ich attraktiv? Google Analytics
Wenn ich schon alles tue, um gut gefunden zu werden, will ich auch wissen, welchen Erfolg ich damit habe. Google Analytics ist deswegen eigentlich Standard, denn es verbindet einerseits meine Seite mit Googles Analysetool (über einen Code, den ich bei Google generiere und auf meiner Seite einfüge), andererseits zeigt es mir im WordPress-Dashboard dann auch die Ergebnisse der Analyse: Klickzahlen etc.
Was muss ich genau machen? Erstens meine Seite bei Google Analytics registrieren:
Dort bekomme ich dann einen sogenannten Tracking Code, den ich auf meiner Seite einfügen muss. Um das – zweitens – nicht selbst machen zu müssen, habe ich das Plugin Google Analytics Dashboard for WP (GADWP) verwendet. Es liefert außerdem (wie der Name schon sagt) ein eigenes Fenster für mein WordPress-Dashboard, wo ich mir Googles Analyse-Ergebnisse für meine Website anschauen kann. Das Plugin kostet nichts.
Nach oben
Ladebeschleunigung: WP Rocket und LazyLoad
Auf pingdom.com kann ich testen, wie schnell meine Seite eigentlich lädt. Neben dem guten Aussehen, der guten Auffindbarkeit aus meiner Sicht das Drittwichtigste: Wie lang muss eigentlich ein Betrachter warten, bis sich meine Seite in ihrer ganzen Schönheit auf dem Monitor zeigt? Denn: Leute, die sich für CAD, 3D-Visualisierung und dergleichen interessieren, bekommen schnell schlechte Laune, wenn eine Seite zu lang zum Laden braucht – insbesondere die Hälfte meiner Leser, die horstsondermann.com auf einem Smartphone konsumiert.
Was ich also dringend brauche, ist ein Plugin, welches das Laden meiner Seiten beschleunigt. Wichtigste Ingredienz – ich bin kein Experte! – ist das Cachen der Seiten, d.h. eine Art Zusammenstellung aller Inhalte, so dass sie auf einmal in den Browser geladen werden können.
Beim Recherchieren und Durchlesen diverser Reviews bin ich auf WP Rocket gestoßen (WP = WordPress), das ich seither verwende. Außer dem Cachen meiner Seiten macht es noch mehr. Lest Euch am Besten durch, was genau:
LazyLoad (ein zusätzliches Plugin vom gleichen Hersteller) ist ein wichtiger Bestandteil davon: Es sorgt dafür, dass immer nur die Bilder und Video-Previews geladen werden, die innerhalb des Browserfensters liegen.
Ich verwende auch hier die Bezahlversion – sie kostet einmalig ca. 40 $ – da sie offensichtlich viel mehr bietet als die Gratis-Variante. Und viel mehr als die Konkurrenz, wie Ihr hier sehen könnt.
Nochmals: Ich lese viele Reviews, um mir einen Eindruck zu verschaffen, wie die Funktionalität von Plugins in der Fachwelt beurteilt wird. Meine Entscheidung, ein Plugin wie WP Rocket anzuschaffen, basiert also vor allem auf dem Vertrauen, dass ich diesen Reviews entgegen bringe.
Was ich selbst bestätigen kann: Das Plugin ist sehr angenehm einzurichten und zu bedienen. Keine Selbstverständlichkeit.
Imagify: Bildoptimierung
Das nächstwichtige Plugin gehört thematisch zu dem, was WP Rocket leistet – es hilft mit, dass meine Seiten schneller laden. Es handelt sich um Imagify, ein Tool, welches Bilder komprimiert, die ich in meine Datenbank hochlade und in meine Posts einbaue. Es stammt vom gleichen Hersteller wie WP Rocket und kostet 5 $ pro Monat, wenn man nicht mehr als 1 GB Bildmaterial pro Monat zu komprimieren hat – meine Variante. Die Gratis-Version, die es auch gibt und mit der ich gestartet bin, hört bei 250 MB auf (glaube ich) – das ist bei einem bildlastigen Blog wie meinem schnell erreicht.
Ich hatte davor ein anderes Tool im Einsatz – WP Smush. Es ist Teil einer umfassenden Plugin-Suite von wpmudev. In der Free-Version ist es ähnlich begrenzt im Umfang wie Imagify (in der Gratis-Variante), will man es aber kaufen, muss man die gesamte Toolsuite nehmen für knappe 50 $. Letztlich ist das ja auch nicht teurer als die Kombi WP Rocket und Imagify – und ein SEO-Tool ist auch noch dabei … aber das habe ich ja schon mit Yoast, einschließlich deutschkundiger Lesbarkeitsanalyse. Ihr seht schon, alles etwas unübersichtlich, wie Handy-Tarife.
Für die Ladebeschleunigung schien mir, wie gesagt, WP Rocket das Beste, deswegen eben jetzt Imagify. Interessant war, dass dieses Tool alle bereits von Smush komprimierten Bilder noch weiter optimierte, ohne dass ich Unterschiede in der Bildqualität feststellen konnte.
Technisch ist der Ablauf folgender: Meine Bilder haben alle das Format 1920 x 1080 px, weil die Ausgangslage meistens HDTV-1080-Videos sind, von denen ich Screenshots in meine Post einbaue. Die Screenshots speichere ich aus Adobe After Effects heraus. Alle Bilder, die nicht Screenshots sind, durchlaufen Photoshop’s JPG-Export-Tool, sind also schon vergleichsweise stark komprimiert. Screenshot oder nicht, schlussendlich werden alle Bilder in meine WordPress-Mediathek hochgeladen, und hier komprimiert sie dann Imagify noch einmal automatisch. Alle weiteren Bildformate, die WordPress beim Import noch anlegt, lasse ich von Imagify ebenfalls komprimieren.
Imagify ist für ein WordPress-Plugin sehr leicht zu benutzen und hervorragend dokumentiert.
Nach oben
WP Broken Link Checker: Checkt broken links
Noch zu den Basics zählt auf jeden Fall WP Broken Link Checker. Wie der Name andeutet, checkt es im Hintergrund alle von mir selbst erzeugten und in Posts oder auf Seiten eingebauten Links auf ihre Gültigkeit. Falls ein Linkziel mal nicht mehr existiert, erscheint eine Meldung im WordPress-Dashboard. Das hat natürlich den Vorteil, dass keine peinlichen 404-Meldungen auftauchen, wenn man auf einen meiner Links klickt.
Das Plugin ist kostenlos. Es ist schon etwas älter und – wie es so schön heißt – nicht mit meiner Version von WordPress getestet. Ich nehme aber an, dass es sich bei der Aufgabenstellung des Plugins eher um eine Basistechnik handelt und ich deswegen nichts zu befürchten habe.
Nach oben
Hacker-Abwehr: WP Limit Login Attempts
Als Webseiten-Betreiber beschleicht einen irgendwann die Sorge, jemand könne sich in das System hacken und dort Unsinn anstellen. Das Tor zum WordPress-System ist das Login-Fenster, und wie echte Einbrecher am liebsten durch eine Tür spazieren, die sie mit einem ihrer Werkzeuge geöffnet haben, knacken Hacker einen Login mit einem sogenannten Brute-Force-Angriff, d.h. sie testen solange Username-/Passwort-Kombinationen, bis sich das Türchen öffnet.
Das Gratis-Plugin WP Limit Login Attempts verhindert dies. Einmal, indem es nur eine begrenzte Zahl an Login-Versuchen zulässt, zum anderen, indem es nach fehlgeschlagenem Loginversuch keinen Hinweis gibt, ob Username oder Passwort falsch waren (was WordPress erstaunlicherweise tut). Und ein Captcha-Fensterchen richtet es auch ein. Wie gesagt, das Plugin kann man gratis verwenden. In der Variante muss man mit den 3 Voreinstellungen vorlieb nehmen, die man mit dem Plugin vornehmen kann. Das scheint mir aber vollkommen O.K. zu sein. Ein echtes Basis-Tool:
Backup/Wiederherstellung: UpdraftPlus
Wie Ihr seht, versuche ich meine Plugins in einer gewissen logischen Reihenfolge zu präsentieren. In absteigender Wichtigkeit, wenn man so will.
Und mit diesem Abschnitt bin ich – je nach Sichtweise natürlich – am Ende meiner Basis-Tools angekommen. D.h. der Plugins, von denen ich keines weglassen würde. Daher kommt jetzt – ebenso logischerweise – ein Backup-Tool für meine Seite. Jawohl, auch ein WordPress-System kann mirnichts, dirnichts den Geist aufgeben – es reicht schon eine unsaubere Editierung in einer seiner Seiten. Und dann ist eben der ganze Webauftritt weg vom Fenster – nicht mehr “on air”, sozusagen.
Da hilft ein Backup-Plugin, mit welchem ich – klar – regelmäßig ein Backup erzeuge. Und mit dem ich, wenn etwas schiefgelaufen ist, eine ältere, funktionierende Konfiguration meiner Seiten wiederherstellen kann.
Das Plugin meiner Wahl ist gratis und heißt UpdraftPlus. Es erlaubt mir, Backups zu erstellen, manuell:
Wie man sieht, kann ich im Gegenzug Daten auch wiederherstellen. Und: Ich darf bestimmen, wohin gesichert wird. Bei mir ist es mein Dropbox-Account:
Nach dem Sichern sind diverse Dateien im entsprechenden Ordner zu sehen:
Ich kann im Dashboard von UpdraftPlus auch nachsehen, welchen Platz die Komponenten meines Webauftritss einnehmen:
Die Pro-Variante des Plugins macht noch Einiges mehr – man kann den Backup-Prozess mit Uhrzeit automatisieren, mehr als einen Speicherort bestimmen, alles mögliche verschlüsseln etc. Das ist mir zum jetzigen Zeitpunkt nicht wichtig genug, deswegen läuft dieses Plugin bei mir in der Free-Version.
Nach oben
Kein Blog ohne Newsletter
Nun, da die Basis-Tools vorgestellt sind, zum großen Thema Newsletter. Um was geht’s? Ich schreibe Tutorials und manches andere und will, dass meine Leser davon sofort erfahren. Jetzt kann ich das jeweils in meinen Social Networks teilen – das mache ich auch. Beschränke ich mich aber darauf, riskiere ich, dass es einen Teil meiner Follower, Freunde, Kontakte nicht interessiert und umgekehrt, dass ich eine Menge potentieller Leser auf diesem Weg nicht erreiche, weil sie eben nicht Follower usw. sind.
Hier kommen jetzt Newsletter ins Spiel, also Mails an Leser, die sich für ein Newsletter-Abo bei mir eingetragen haben. Und zwar erstmal nur in der Form, dass es eine kurze, schmucklose Information über ein Blog-Update gibt:
Verkaufsmarketing, A-B-Kampagnen, Shop-Transaktionen etc. sind dagegen gar kein Thema für mich. Und, ganz wichtig: Ich will die Mails natürlich nicht per Hand schreiben, sondern das soll alles automatisiert ablaufen.
Was brauche ich also?
- Eine Möglichkeit für Leser, sich auf meiner Seite für einen Newsletter einzutragen
- Einen Workflow, mit dem ich neue Blogposts extrahiere
- Einen Mail-Service, der eine Mail an alle Abonnenten rausschickt, sobald ein neuer Blogpost online geht
Der Mittelteil ist nicht unwichtig, denn das “Herausziehen” eines neuen Blogposts ist Aufgabe des Mail-Service, und das kann nicht jeder.
Wie funktioniert das im Detail? Wenn ich meine Blog-URL https://horstsondermann.com in einen Browser eingebe und ein /feed/ hintendran hänge, bekomme ich das hier angezeigt:
Das ist der RSS-Feed meiner Seite. Ich habe keine Ahnung, wie genau sich der zusammensetzt (und warum er offensichtlich nur einen Ausschnitt zeigt), aber das ist das Material, das sich der Mail-Service vorknöpft und hieraus die neuen Posts extrahiert, um sie brav im Newsletter aufzulisten.
Also: Es gilt einen E-Mail-Service zu finden, der diese Kunst beherrscht.
Da wir dabei sind: Wozu brauche ich überhaupt einen Mail-Service? Nehmen wir an, ich hätte wirklich viele Subscriber, z.B. 2.000 (viel für meine Verhältnisse). Würde ich ein WordPress-internes Mail-Plugin verwenden, um ca. alle 2 Tage 2.000 Mails zu verschicken, würde ich wahrscheinlich bald Ärger mit meinem Webhoster bekommen. Oder der erlaubt erst gar nicht, dass ich die Mails von seinem Server aus verschicke. (Denkt dran: Die Mails würden nicht wirklich von meinem Computer rausgehen, sondern vom Server der Firma Domainfactory, wo auch mein WordPress-System liegt.)
Das ist die wichtigste Aufgabe eines E-Mail-Service-Provider (ESP) – auch wenn er noch allerhand Zusatzkram anbietet.
Ich sollte schon erwähnen, dass es auch “kleine” Lösungen gibt – z.B. das WordPress-Plugin Newsletter – aber auch das bietet an, ab einer bestimmten Anzahl von Abonnenten den Mailversand auszulagern, gegen Bezahlung selbstredend.
Bevor es jetzt an die gewählten Tools geht, noch ein paar Sätze zu dem ersten Punkt in meiner Liste, dem Sammeln der Mailadressen.
Ihr kennt alle diese Popup-Fenster, in denen Ihr Eure Mail-Adresse eintragen dürft, um dann bis an Euer Lebensende Newsletter in Eure Inbox zu bekommen. Darum geht es im Prinzip: Dass man Leser/Kunden auf legalem Weg dazu bringt, sich Werbung schicken zu lassen.
Ich verfolge natürlich eher einen Servicegedanken: Ihr wollt nichts verpassen? Dann gebt mir Eure Mail-Adresse und ich schreibe Euch immer dann, wenn eines meiner Tutorials online gegangen ist.
Wie auch immer: Zum Aufbau einer Mailing-Liste braucht’s einen sogenannten Opt-In, d.h. eine Möglichkeit, sich auf einer meiner Seiten für das Abo meines Newsletters einzutragen. Anders als beim Mail-Service ist dies keine Angelegenheit für einen externen Dienstleister, sondern für mein WordPress-System.
Mail-Adressen sammeln: Sumo
Zum Sammeln von Mail-Adressen interessierter Leser brauche ich ein Plugin, welches
- eine Eingabemaske für eine E-Mail-Adresse bietet
- mir erlaubt, diese nach meinen Vorstellungen zu gestalten
- diese an sinnvollen Stellen in meinem Blog platziert
- aus den Einträgen eine Liste generiert
- und diese an meinen Mail-Service übermittelt
Zu den genannten Punkten gibt es noch mehr, was das Tool leisten muss. Zum Beispiel ist Standard, dass eine eingegebene Adresse auf Gültigkeit gecheckt wird und daraufhin, dass sie von einem realen Menschen und keinem Bot stammt. Ersteres regelt solch ein Opt-In-Tool mit einer automatisierten Mail an den Abonnenten, der gebeten wird, seine Mailadresse durch Klick auf einen Link zu bestätigen (Double Opt-In). Diese Dinge werden aber von allen Opt-In-Plugins erfüllt.
Nun aber zu meiner Wahl: Ich habe mich für das Sumo-Plugin entschieden. Warum? Nach dem Lesen diverser Reviews wird klar, dass es zwar unendlich viele Tools gibt, dass aber nur wenige nicht so aussehen, als seien sie ausschließlich für HTML-Java-wasweißich-Nerds gemacht.
Also, powerful sollte das Tool schon sein, andererseits aber für einen sensiblen Ästheten und Gestalter wie mich benutzbar. Da kamen letztlich nur Sumo in Frage (das von mir gewählte) und Optinmonster.
Und jetzt kommt der unkomplizierte Teil: Sumo kann man umsonst benutzen, solange man will, Optinmonster kostet von Anfang an, mindestens 108 $ (der Basic-Tarif für ein Jahr, leider nicht auf Monatsbasis zahlbar).
Hier die Features, die Sumos Gratis-Tarif bietet:
Ich habe das lange studiert, glaubt mir – der einzige Grund für einen einfachen Blogger wie mich, hier einen Bezahltarif zu wählen, wäre, dass ich mehr als 200 Subscriber habe. Das ist nämlich die Obergrenze beim Gratis-Tarif. Ich verwende Sumo jetzt schon länger und kann sagen, dass alle anderen Funktionen der Plugin-Suite vollkommen ausreichen, auch wenn man nichts bezahlt.
Hier seht Ihr ein paar Screenshots, wie sich die Gestaltung des Eintragungsformulars gestaltet. Auf Englisch heißt das Modul List Builder, und was ich gestalten kann, ist eine Form:
Man hat diverse Möglichkeiten, Position und Darstellung des Formulars zu bestimmen:
Hier seht Ihr, was zum Schluss kommt: die Verbindung zu meinem Mail-Service. Damit ist sichergestellt, dass der jede neue Mail-Adresse übermittelt bekommt, die Sumo eingesammelt hat:
Mit Sumo kann ich soviele Formulare produzieren, wie ich will – Pop-Ups, In-Line etc. – und sie auf meinen Seiten verteilen, wie ich es für richtig halte. In einer Übersicht seht Ihr dann, wie erfolgreich jedes einzelne Formular bereits beim Sammeln war (Conversions):
Sumo kann noch mehr als Formulare und Adressen auf Listen sammeln. Es kann auch zeigen, wie oft ein Formular gezeigt wurde und wie oft sich dann jemand eingetragen hat: die sogenannte Conversion Rate. Ich kann also sehen, welches Formular “erfolgreicher” ist.
Dann stellt Sumo die Daten von Google Analytics dar – das brauche ich eigentlich nicht, denn das macht Google Analytics ja selbst auch.
Sumo zeigt anhand sogenannter Heat Maps, was sich Besucher meiner Seite am meisten ansehen, auch innerhalb von Blog Posts.
Mit Sumo kann ich Push-Nachrichten an Subscriber schicken …
Und, wie gesagt, bis zu 200 Abonnenten kostet mich dieses Toolset nichts.
Nun zu dem, was eigentlich in den Mails stehen soll. Die Sache ist etwas weniger kompliziert als das Adressen-Sammeln.
Nach oben
Wie kommt der Post in den Newsletter? RSS-Feed
In der Art Newsletter, wie ich ihn will, wird jeweils der neueste Teil des RSS-Feeds meiner Seite gezeigt. Natürlich nicht in RSS-Notation, sondern wieder in lesbarer Form. Der RSS-Feed wäre prinzipiell nichts, um das man sich kümmern muss. Beim Einrichten der Mail-Kampagne – z.B. bei ActiveCampaign (siehe unten) – gibt man an, dass man ein RSS-Update als Mail versenden will (RSS Triggered), und gibt die korrekte URL an, in meinem Fall https://horstsondermann.com/feed/:
Aber: Der RSS-Feed zeigt per Voreinstellung nicht das Beitragsbild an – das Featured Image – also das Bild, welches ich jedem Blog-Post zuordnen kann wie eine Überschrift. Was ich auch mache, konsequent.
Und im Newsletter hätte ich gern dieses Beitragsbild – denn schließlich ist mein Blog sehr bildlastig und der Newsletter darf das gern zeigen.
Man kann das mit einem Code-Schnipsel im functions-sheet des Theme lösen, oder aus Komfortgründen zu einem Plugin greifen (hier gibt es eine Beschreibung von beidem).
Ich mache Letzteres, das Plugin heißt etwas langatmig: Featured Images in RSS. Es kostet nichts und erlaubt ein paar Einstellungen:
Entscheidend ist bei dem Ganzen die generierte Ausgabegröße – denn die bestimmt, wie die Darstellung im Newsletter erfolgt. Ich habe in meinem System ein eigenes Bildformat ergänzt, da ich das Seitenverhältnis 16:9 für meine Postbilder verwende (1920 x 1080 px) und es dazu kein passendes Preview-Bildchen-Format gab.
Die Ergänzung habe ich als Codezeile im functions-sheet meines Theme eingetragen (die Zeile, in der home-left steht):
Die Datei functions.php spielt übrigens eine wichtige Rolle, wenn es darum geht, bestimmte Funktionen (!) per Code-Einfügen zu ermöglichen. Das kann jeder. Ihr seht die Datei rechts aufgelistet, wenn Ihr links im WordPress-Menü Design – Editor wählt. functions.php ist eine Theme-spezifische Datei, d.h was da drin steht, gilt nur für das aktive Theme.
Und wenn ich jetzt in irgendeiner Anleitung einen Code-Schnipsel sehe, von dem es heißt, er solle in functions.php eingefügt werden, dann mache ich das eben in dieser Datei.
Das ist übrigens eine gute Gelegenheit, das Backup-Plugin UpdraftPlus vorher einzusetzen – falls der Code falsch war.
Newsletter verschicken: ActiveCampaign
Nun zur dritten Komponente meines Newsletter-Unterfangens. Ich brauche einen Mail-Service,
- der meinen RSS-Feed auslesen kann (siehe oben)
- der einen leistungsfähigen Server verwendet, um all die Mails zu verschicken
- der mir erlaubt, ohne HTML-Kenntnisse o.ä. ein Newsletter-Layout zu gestalten, das nicht hässlich ist, primitiv oder austauschbar wirkt
- und der ein humanes Preismodell anbietet, dass sich meiner Abonnentenzahl anpasst
Es folgt eine längere Leidensgeschichte.
Meine 1. Wahl war MailChimp, eigentlich ein sehr beliebter Mail-Service. Das Tolle an ihm ist, dass er bis zu einer Abonnentenzahl von 2.000 gar nichts kostet. Auch einen Newsletter zu gestalten war nicht besonders schwierig – (auch nicht besonders intuitiv, allerdings). Und MailChimp kann RSS-Feed, also automatisiert Mails zu Blog-Updates verschicken.
So weit, so gut – leider wurde mir noch vor dem Versand des ersten Newsletters in dürren Worten von MailChimp mitgeteilt, dass ich gegen rechtliche Auflagen des Anbieters verstoßen habe und mein Account deswegen pausiert sei. Das Studium des Kleingedruckten brachte mich auf die Idee, dass Affiliate-Links in einigen Posts (zu Amazon) das Problem sein könnten. Da ich schon viele Newsletter auf MailChimp-Basis mit kommerziellem Inhalt gesehen habe, wundert mich das natürlich. Wie auch immer, auf meine Bitten nach Aufklärung des Sachverhalts habe ich bisher keine Antwort erhalten. Der Account ist bereits wieder gelöscht – auch darauf hin hat sich niemand gemeldet.
Meine 2. Wahl war AWeber, auch ein ziemlich etablierter Service. Der teurer ist als MailChimp. Auch dieser Service kann RSS (bei AWeber heißt die Funktion Broadcast), auch war die Einrichtung eines Newsletter ähnlich klar strukturiert wie bei MailChimp (im ESP-Jargon heißt das: eine Kampagne einrichten). Nur die Gestaltung des Letters selbst war so anti-intuitiv, dass mir die Lust verging. (Ich kann mir vorstellen, dass andere damit kein Problem haben – ich hatte einfach den Eindruck, AWeber ist für ein anderes Kundenmilieu gemacht.) AWeber schied deswegen aus.
Meine 3. Wahl war ConstantContact. (Ich will an dieser Stelle einschieben, dass man sich bei allen Anbietern erst registrieren muss, bevor man loslegen darf – d.h. Vor- und Nachteile des Handlings lernt man erst nach nach Vertragsabschluss kennen. Die Werbung vor der Registrierung ist leider bei allen Anbietern sehr unpräzise, wenn es um konkrete Features geht.)
Bei Constant Contact – der Web-Auftritt suggeriert Modernität und Coolness – war überraschend, dass man keine Mails mit RSS-Feed generieren kann. Damit war der Service natürlich aus dem Rennen.
Richtig irritierend war dann, dass ich ConstantContact nicht einfach online kündigen konnte – wie bei allen anderen Anbietern. Nein, ich musste tatsächlich eine Service-Nummer in den USA anrufen, um dort in einem persönlichen Gespräch (auf englisch) um die Aufhebung des Accounts zu bitten. Angesichts der Tatsache, dass man sich mit der Registrierung für die Trial-Phase eines kostenpflichtigen Service anmeldet, eine höchst enervierende Angelegenheit. Und eigentlich unglaublich.
Aber – at last – ich wurde doch noch fündig auf meiner Suche. Meine 4. Wahl ist jetzt ActiveCampaign. Dieser Service erfüllt alle oben genannten Anforderungen – insbesondere auch, dass der Newsletter intuitiv zu gestalten ist. Hier habe ich zum ersten Mal das Gefühl, dass der Anbieter zu mir passt:
Auch das Handling des Scheduling – also, wann und nach welchen Kriterien jeweils eine Mail rausgeht – ist nachvollziehbar und einfach:
Zu den Kosten: Noch bin ich im Genuss einer kostenlosen Trial-Phase, danach kommen 15 $ pro Monat auf mich zu, solange ich nicht mehr als 500 Adressaten habe. Das ist günstiger als AWeber und ConstantContact und teurer als MailChimp. Insgesamt bietet ActiveCampaign ein sehr differenziertes Preismodell, was einem Blog-Starter wie mir natürlich entgegenkommt:
Ein erster Newsletter ist bereits erfolgreich rausgegangen. Meine Empfehlung lautet also ganz klar: ActiveCampaign.
Damit ist das Thema Newsletter vorerst abgeschlossen. Ich fasse alles nochmal zusammen:
- Das List Building erfolgt mit Sumo in WordPress
- In meinen RSS-Feed habe ich mithilfe des Plugins Featured Image in RSS und ein wenig Code-Editierung die Post-Beitragsbilder eingefügt
- Der Mailversand erfolgt automatisiert mit ActiveCampaign – sobald ein neuer Post veröffentlicht wurde
Nicht nur bei YouTube: Video Showcase mit YourChannel
Nach den Basis-Tools und dem Newsletter-Thema kommt jetzt meine Video-Seite dran. Ich will die ca. 100 Videos meines YouTube-Channels auch auf meiner WordPress-Seite sehen. Warum?
Erstens bin ich stolz darauf und zeig sie gerne her. Schließlich will ich Euch zeigen, was ich schon alles zum Thema digitale Architekturvisualisierung produziert habe. Auch ich kann dort vieles nachschauen, was mir gerade nicht geläufig ist.
Zweitens ist der YouTube-Channel selbst eine feine Sache, aber es gibt dort jede Menge Ablenkungen. Natürlich Videos anderer Produzenten – so soll es ja auch sein – aber auch Werbung, Thumbnails, Texte etc. Es liegt in der Natur der Sache, dass das Aussehen der Channel-Seite auf YouTube, die Präsentation meiner Videos, nicht in meiner Hand liegt. Das ist YouTube’s Party.
Also schaffe ich mir auf meiner Seite horstsondermann.com noch einmal ein eigenes Schaufenster für meine Tutorial-Filme. Technisch ist das insofern kein Problem, als dass ich die Filme nicht wirklich auf mein System hochladen muss, sondern nur Vorschaubilder mit Referenzierung der YouTube-URLs meiner Filme. Und anschauen kann man sie sich trotzdem auf meiner Seite.
Es funktioniert so wie mit den Videos, die ich in meinen Blog-Post zeige, nur eben für alle Filme auf einer Seite.
Das Plugin, das ich für diesen Zweck einsetze, heißt YourChannel:
Das Plugin nistet sich in den Einstellungen meines WordPress-Systems ein. Dort bestimme ich, welchen meiner YouTube-Channel ich auf meiner Seite zeigen will. Das ganze Prozedere ist leicht zu meistern:
Das Plugin erzeugt für das Display der Videos eine eigene Seite, die ich in mein Menü aufgenommen habe. Ich darf bestimmen, in welcher Weise meine Videos dort angezeigt werden:
An dieser Stelle habe ich mich entschieden, 15$ auszugeben und die Pro-Variante des Plugins zu verwenden. Warum? Die Free-Fassung erlaubt für die Grid-Darstellung der Videos maximal 3 Spalten, ich wollte aber gern 4 haben – das geht nur gegen Geld. Und wenn man sich dann auf der Herstellerseite den Feature-Vergleich anschaut, wird schnell klar, dass die 15$ echten Mehrwert bringen:
Das Wichtigste vielleicht: die Suchfunktion. Sie funktioniert wirklich sehr gut.
Nach oben
Mehr Schreibwerkzeuge: TinyMCE Advanced
Mit den wichtigsten Tools bin ich durch. Jetzt kommen noch ein paar Nice-to-have-Plugins, mit denen ich mir das Leben in WordPress ein bisschen angenehmer gestalte. Zu ihnen gehört TinyMCE Advanced. Es erlaubt mir, im Visual Editor Werkzeuge für die Textbearbeitung hinzu zu fügen, die per Voreinstellung erstmal nicht zu sehen sind. Das funktioniert einfach per Drag & Drop:
Die Tools, die ich hinzugefügt habe, sind: ein besseres Hyperlink-Tool (zum Verlinken), eine Text-Suchfunktion und einen Button zum Setzen eines Anker-Tags:
Das Anker-Tag brauche ich zum Verlinken innerhalb eines Posts. Also wenn ich per Klick auf einen Hyperlink an eine andere Stelle im Post springen möchte. Das Anchor-Tag kann ich auch per HTML manuell einfügen – der Vorteil des TinyMCE-Buttons ist, dass er das Tag speichert und ich es jedesmal, wenn ich einen Link setze, als Linkziel angeboten bekomme.
Nach oben
Linkziel verfehlt? Hash Link Scroll Offset
Thematisch zum Anchor-Tag gehört dieses Plugin. Wenn ich einen Link zu einem Anchor-Tag setze (welcher ein Hash-Tag enthält) – ob dies nun im gleichen Text liegt oder in einem anderen meiner Texte – dann “springt” der Browser an diese Stelle. So soll es auch sein. Leider passiert es häufiger, dass das Ziel (z.B. eine Zwischenüberschrift) leicht oberhalb des oberen Rands des Browserfensters liegt. Also außerhalb. Und wenn der Leser dann diese Zwischenüberschrift nicht sehen kann, bekommt er leicht den Eindruck, der Link habe ihn in die Irre geführt.
Das Plugin Hash Link Scroll Offset ist ein einfaches Tool, das sich in meinem Fall in den Allgemein-Einstellungen meines WordPress-Systems einnistet. Dort darf ich einen Pixelwert eingeben – um den wird dann beim Spring zum Link der Fensterausschnitt nach unten verschoben, so dass oben beschriebenes Problem nicht auftritt:
Farbe für den Texteditor: HTML Editor Syntax Highlighter
Ich schreibe meine Posts gern im Text-Editor. Nichts gegen den Visuellen Editor – den brauche ich auch – aber im Text-Editor fühle ich mich zuweilen sicherer, was das HTML-Markup meiner Artikel angeht. Und was gibt es Schöneres, als im Text-Editor aussagekräftige Title-Tags in Links einzufügen?
Was aber gar nicht geht, ist, dass der Editor von Haus aus den Markup-Text in schnöder Schwarz-Weiß-Grafik darstellt. Hier kommt das Plugin HTML Editor Syntax Highlighter ins Spiel. Einmal installiert, darf ich aus einer langen Liste verschiedener Themes wählen, wie mein HTML farbig kodiert wird:
Man darf noch einiges mehr einstellen (Wrapping), aber das Wichtigste sind die Farben. Das Plugin ist kostenlos.
Nach oben
Muss sein: Access Press Social Icons
Das letzte Plugin in dieser Vorstellungsrunde ist Access Press Social Icons. Mit seiner Hilfe kann ich all die kleinen Icons auf meinen Seiten platzieren, die zu meinen Social-Media-Accounts führen. Das kostenlose Plugin erlaubt das Anlegen diverser Icon-Sets (ich habe eines), deren Aussehen man sich aussuchen kann. Alles was man tun muss, ist seine entsprechenden Facebook-, Twitter- etc. URLs einzugeben. Das Plugin bastelt daraus ein Widget, das ich im Customizer im Header, dem Footer und der Sidebar (wenn vorhanden) einfügen darf.
Es gibt eine Premium-Variante, deren Vorteile mir zum gegenwärtigen Zeitpunkt nicht einleuchten. Vielleicht kommt das ja noch.
Und bevor ich es vergesse: Share-Buttons, also Icons, auf die Leser klicken können, wenn Sie etwas von meinem Content mit ihren Homies teilen wollen, gibt es auch auf meiner Seite. Das ist aber etwas anderes und wird von Sumo beigesteuert. Ihr seht die Buttons jeweils auf der linken Seite in einer Float-Palette.
Fazit: Ein Blog macht Spaß, aber auch viel Arbeit…
- … wenn er nicht austauschbar aussehen soll
- … wenn er im Google-Universum gut performen muss
- … wenn man Leser mit Updates versorgen will
… und er kostet Geld, aus den gleichen Gründen. Was man auch nicht unterschätzen darf: So ein System aufzubauen erfordert einiges Recherchieren und Lesen. Informationen kommen aus sehr unterschiedlichen Quellen: Herstellerseiten, Reviews und Tests, Foren … und 95% davon findet man nur auf Englisch.
Lohn der Mühe
Damit habe ich jetzt eine Struktur, die ich mit Inhalt füllen kann. Dem Schreiben unzähliger und hochinteressanter Blogposts steht jetzt also nichts mehr im Wege!
© 2018 / Horst Sondermann / Alle Rechte vorbehalten
Nach oben
Leave a Reply
You must be logged in to post a comment.