Wechsel von WordPress zu Hugo

Seit 9 Jahren blogge ich mit WordPress auf diesem Blog. Auf meinem zweiten Blog, christoph.miksche.org blogge ich seit 7 Jahren mit WordPress. Zudem habe ich seit 2013 ebenfalls immer wieder eine Plattform (WebPage4.me) zum Erstellen eines eigenen WordPress-Blog betrieben und auch beruflich habe ich immer wieder WordPress Websites verwaltet.

Ich habe also eine ziemlich tiefe Beziehung mit WordPress. Allerdings habe ich in den letzten Jahren seit 2017 unter blog.m5e.de einen Blog ausschließlich mit statischen Generatoren betrieben. Hierbei war ich mit Jekyll zwar nicht so super zufrieden aber Hugo ist dafür wunderbar.

Nun will ich meinen zweiten Blog auf Hugo migrieren. Meine Hauptgründe dafür sind:

  • WordPress ist langsamer als Hugo
  • WordPress ist unsicherer als Hugo
  • WordPress benötigt mehr Aufwand (z.B. Aktualisierungen, …)
  • WordPress Hosting ist teurer und aufwändiger (da PHP und eine Datenbank benötigt wird)
  • Gerade bei Shared-Hosting kommt es öfter zu Problemen mit WordPress

Der letzte Punkt ist der heftigste. Denn ich habe mir z.B. für automatische Updates bei Shared-Hosting Anbietern, die keine automatischen Updates via JS möglich machen, ein Skript geschrieben: https://github.com/CMiksche/wp-remote-updater

Auch für automatische Backups habe ich ein Skript geschrieben: https://git.kernel.fun/cmiksche/php-sharedhost-backup

Trotz dieser beiden Skripte bleiben aber bei Shared-Hosting-Anbietern weitere Probleme. Aktuell funktioniert z.B. der Gutenberg-Editor bei meinem zweiten Blog nicht. Auch Updates von Plugins usw. müssen dort manuell gemacht werden, weil der Hosting-Anbieter anscheinend keine JS-Verbindungen zu WordPress zulässt.

Es gibt sogar einige Anbieter wie HelioHost, welche aktiv von dem Betreiben eines WordPress-Blogs auf der eigenen Plattform abraten. (Dieser Anbieter deaktiviert anscheinend sogar Kundenaccounts, deren WordPress-Instanz zu hohe Auslastungen haben)

Bei diesem Blog (blog.wronnay.net) und auch bei WebPage4.Me habe ich dieses Problem zwar nicht, weil ich die beiden Seiten auf eigenen Servern betreibe, allerdings will ich auch noch Online-Präsenzen haben, wenn mein Server mal ausfällt und deshalb setze ich bei meinem zweiten Blog auf einen anderen Anbieter.

Diese ganzen Probleme habe ich mit einer statischen Website aber nicht. Für statische Websites gibt es unzählige kostenlose Anbieter, statische Websites sind viel schneller und leichter umzuziehen. Typischerweise ist der größte Vorteil von WordPress zwar, dass man online von überall seine Beiträge schreiben kann und auch mehrere Autoren möglich sind aber alle meine aktuellen Blogs werden nur von mir geschrieben und es gibt auch Lösungen für statische Blogs, die das gleiche möglich machen.

Bei mir kommt dann noch hinzu, das ich als Softwareentwickler seit Jahren sehr gerne Markdown schreibe und meine Projekte in Git verwalte. Dies gibt es bei statischen Generatoren „out of the Box“ und ich fühle mich in so einer Umgebung richtig wohl.

Deshalb möchte ich nun versuchen, meinen persönlichen Blog (christoph.miksche.org) auf Hugo umzuziehen. Dieser Umzug wird vermutlich etwas aufwendig sein, da ich z.B. dort auch ein custom Theme verwende, allerdings werde ich danach unabhängiger von Hosting-Anbieter sein und muss mir keine Sorgen mehr machen, dass ein Update irgendwas kaputt macht.

Das Exportieren der Daten von WordPress

Bevor man irgendwas mit Hugo macht, sollte man die Daten von WordPress exportieren.

Für Hugo gibt es z.B. WordPress Plugins wie wordpress-to-hugo-exporter, dieses hat bei meinem Hoster aber leider wegen einer Zeitüberschreitung bzw. Netzwerkfehlers nicht geklappt.

Es gibt auch den wordpress-to-jekyll-exporter, den man nach dem Export dann mit dem Jekyll Importer von Hugo importieren könnte, allerdings war ich mit dem Export von dem Plugin nicht zufrieden. Oft war in den Posts z.B. noch HTML vorhanden…

Deshalb habe ich eine andere Methode gewählt: Man kann man einfach via “Werkzeuge“ > „Daten exportieren“ > „Alle Inhalte“ > „Export-Datei herunterladen“ eine XML-Datei mit den WordPress-Daten herunterladen, die man anschließend konvertieren kann.

Das Exportieren

Konvertieren in Hugo Format

Es gibt verschiedene Tools zum Konvertieren. Von WordPress-Plugins bis zu CLI-Tools. Wie schon beschrieben, habe ich keine guten Erfahrungen mit den WordPress-Plugins gemacht.

Die Ausgabe von blog2md war jedoch besser, auch wenn dort keine Bilder exportiert werden und es bei manchen Posts z.B. an Absätzen fehlt.

D.h. jetzt gehen wir jeden Beitrag durch und prüfen, ob alles passt. Wir fügen Absätze hinzu, korrigieren evtl. URLs und Bilder usw…

Erstellen des Hugo-Projekts

Mit dem folgenden Befehl legt man eine neue Website mit Hugo an:

hugo new site mein-toller-blog

Nun kann man die konvertierten Dateien in den /content Ordner verschieben. Die Bilder habe ich nach /static verschoben.

Erstellen / Anpassen des Theme

Unter /themes legen wir einen neuen Ordner für unser Theme an. Als Vorlage kann man so einfache Themes wie https://github.com/J-Siu/hugo-theme-sk1 oder https://github.com/yanlinlin82/simple-style verwenden.

Anschließend musste ich mühsam mein WordPress-Theme auf die Hugo Syntax anpassen…

Fazit

Trotz der Mühe hat sich das gelohnt! Meine Seite lädt nun viel schneller und hat weniger Wartungsaufwand. In Zukunft werde ich wohl eher Hugo-Seiten als WordPress-Instanzen aufsetzen.

WordPress: Kann Kategorie nicht bearbeiten bzw. setzen

Vor Kurzem hatte ich das Problem, das ich auf einem WordPress Blog eine bestimmte Kategorie nicht setzen konnte. Nach eine Suche bin ich auf https://stackoverflow.com/questions/41880458/wordpress-sorry-you-are-not-allowed-to-edit-this-item gestoßen und ein Post konnte mir wirklich helfen.

Anscheinend trat der Fehler bei mir auf, weil ein Begriff für eine Kategorie gleichzeitig auch als Schlagwort gesetzt war. Das ist wohl nicht möglich / erlaubt. Daher war die Lösung, sich entweder für die Kategorie oder dem Schlagwort zu entscheiden.

Zuerst sollte man in der Datenbank nach den doppelten Einträgen suchen:

SELECT term_id, COUNT(term_id) FROM wp_term_taxonomy GROUP BY term_id HAVING COUNT(term_id) > 1;

Anschließend habe ich die Einträge mit der term_id in der Tabelle anschaut und den Eintrag für den Tag gelöscht.

WebPage4.Me Relaunch

WebPage4.Me war ab 2013 ein Portal zum Erstellen einer Website mit verschiedenen CMS. Man konnte dort unter anderem WordPress Blogs oder Webseiten mit meinem eigenen CMS („WronnayCMS“, aktuell nicht verfügbar) erstellen.

Das Portal wurde ca. 2014 geschlossen, da der Wartungsaufwand zu hoch war (damals hatte ich für die Verwaltung noch ein eigenes System genutzt, jeder Nutzer bekam eine eigene Datenbank und Subdomain und konnte externe Domains aufschalten, dadurch musste mit jeder neuen WordPress / Joomla, etc Version der (sehr aufwendige) Installationsvorgang angepasst werden).

Gestern habe ich auf Basis von WordPress Multisite das Projekt mit einem für mich viel geringeren Wartungsaufwand neu gestartet. Das neue Webdesign kann man durchaus den Minimalismus zuschreiben. Mein Ziel ist es, den Wartungsaufwand so gering wie möglich zu halten, d. h. es werden alle wiederholenden Vorgänge automatisiert.

Piwik / WordPress Remote Update

Wie ich teilweise bereits auf meinem persönlichen Blog erwähnt habe, wurden von mir in letzter Zeit Python Scripts zum Aktualisieren von WordPress und Piwik über die Kommandozeile geschrieben.

Wenn man diese z.B.: als Cronjob laufen lässt, kann man von einem entfernten Gerät die Piwik- oder WordPress Instanz automatisch aktualisieren lassen.

Das ist in manchen Fällen recht nützlich.

Downloaden kann man die beiden Programme von GitHub, eine Installationsanleitung ist in der jeweiligen README.md Datei:

Bei Fehlern / Problemen kann gerne im jeweiligen GitHub Repo ein Issue erstellt werden.

Spam unter WordPress ohne Plugins verhindern!

Ich habe bei einem meiner Projekte das Problem, dass ich WordPress verwende, allerdings keine Plugins oder Themes verwenden kann. Wie verhindert man also bei so einem Projekt Kommentar-Spam?

Es ist eigentlich ganz einfach: Man baut in die functions.php ein paar neue Funktionen gegen Spam ein:

1. Webseiten-Feld entfernen!

Spammer / Spam-Bots wollen ihre Webseite bekannter machen, gibt es kein -Webseiten-Feld ist das Risiko niedriger, dass Spam gepostet wird.

PHP-Code:

function remove_comment_fields($fields) {
    unset($fields['url']);
    return $fields;
}
add_filter('comment_form_default_fields','remove_comment_fields');
 
function rkv_url_spamcheck( $approved , $commentdata ) {
   return ( strlen( $commentdata['comment_author_url'] ) > 1 ) ? 'spam' : $approved;
}
 
add_filter( 'pre_comment_approved', 'rkv_url_spamcheck', 99, 2 );

Diese Funktion entfernt das Webseiten-Feld und markiert Kommentare mit Webseite automatisch als Spam. (Quelle: catswhocode.com)

2. Kommentare mit Links entfernen

Als Nächstes weist man die Besucher des Blogs darauf hin, dass Links in den Kommentaren verboten sind und baut die folgende von mir erstellte Funktion ein, die Kommentare mit Links erkennt.

PHP-Code:

// BBCodes und HTML-Links erkennen - Wronnay.net
function wy_link_on_comment() {
if(stristr($_POST['comment'],"[link=") || stristr($_POST['comment'],"[url=") || stristr($_POST['comment'],"a href=") || stristr($_POST['comment'],"http://")){
wp_die( __('Bitte keine Links posten!') );
}
}
add_action('pre_comment_on_post', 'wy_link_on_comment');

Die Funktion erkennt sogenannte BBCodes, die eigentlich gar nicht in WordPress verwendet werden und normale HTML-Links und weist den Autor darauf hin, dass Links nicht erlaubt sind.

Update (23.04): Ich habe jetzt „ || stristr($_POST[‚comment‘],“http://“)“ hinzugefügt. Der Code erkennt jetzt alle Links.

WebPage4.Me fertiggestellt!

WEBPAGE4.ME Logo

Eigentlich wollte ich WebPage4.Me ja verkaufen, aber da sich keine Interessenten gefunden haben, die die Domain gerne hätten, habe ich beschlossen, das Projekt zu Ende zu führen: Gestern habe ich die letzten Fehler behoben und die Website fertiggestellt!

Jetzt kann man unter WebPage4.Me eine eigene Webseite / Homepage / Blog mit dem Content Management System WordPress erstellen! Das Ganze ist kostenlos und mit unbegrenztem Speicherplatz!

Weitere CMS sollen im Laufe der Zeit folgen. Außerdem soll es ab nächstem Jahr auch die Möglichkeit geben, auf „Premium“-Status upzugraden. Das bedeutet, dass man eine eigene Top-Level-Domain und andere Features gegen Bezahlung bekommt. (Dasselbe ist auch für ForenHosting.net geplant)

Mein nächstes Projekt wird ein Werbenetzwerk, das 2014 starten soll …

Der Ausfall meines vServers …

Gestern Abend ging es los: mein vServer und somit alle meine Webseiten mit Top-Level-Domains, war nicht mehr erreichbar. Also habe ich versucht, meinen Server neu-zu-starten, aber das ging nicht. Daraufhin habe ich im Kundenbereich meines Anbieters ein Ticket erstellt und ihm mein Problem erklärt. Heute um 11:54 meldete darauf mein Anbieter auf Twitter, dass es eine Störung gäbe und um 12:28 wurde die Störung behoben. Weil ich allerdings schon am Vorabend CloudFlare eingeschaltet hatte, ist mein System allerdings (schon wieder) nicht mit CloudFlare zurecht gekommen. So musste ich CloudFlare deaktivieren und meinen Server neu-starten. Aber das ist noch nicht alles: da ich danach feststellen musste, dass mein Dashboard von WordPress weiß blieb und die Deaktivierung aller Plugins (was üblicherweise bei einem weißem Dashboard empfohlen wird) nichts nützte, musste ich alle meine WordPress Ordner und Dateien bis auf die Uploads löschen und neu hochladen. Ob das jetzt alles war, weiß ich nicht.

WordPress aktualisiert und eventuellen Spam gelöscht!

Da vor kurzem eine neue WordPress Version herausgekommen ist, habe ich WordPress aktualisiert und mögliche Spam-Kommentare gelöscht!

PS: Falls die Kommentare kein Spam waren, kann ja hier gerne der Verfasser schreiben, warum er immer eine andere E-Mail Adresse angegeben hat.

Homepage (oder Blog) mit Facebook verbinden!

Da ich in einem Internet-Forum vor kurzem einen Thread gelesen habe, in dem jemand gefragt hat, wie man seine Homepage mit Facebook verbindet, möchte ich heute zeigen, wie das geht!

Schritt 1:

Auf Facebook eine Fanseite erstellen!:

-> Erstmal auf Facebook registrieren: https://www.facebook.com/ (ich denke, es ist klar, wie man sich registriert…)

-> Dann Anmelden und auf diese Seite gehen: http://www.facebook.com/pages/create.php?ref_type=sitefooter, dann „Marke oder Produkt“ auswählen, „Webseite“ auswählen und den Namen der Webseite in das untere Feld eingeben, die Richtlinien zustimmen und auf „Los geht’s“ klicken.

-> Danach Infos und Daten über die Webseite in Facebook eingeben, ein Screenshot  oder Logo von der Webseite hochladen, Freunden und Mitgliedern den Link der Fanseite  (z.B.: http://www.facebook.com/pages/Wronnaynet/187987734609511) geben und ein „Gefällt mir“- Feld auf der Webseite hinzufügen.

Schritt 2:

Jetzt kommt es darauf an, was man auf Facebook und was man auf seiner Homepage veröffentlichen will!

Wenn man z.B.: News veröffenlichen will, dann ist es nützlich ein RSS-Feed der News zu haben (Blogsysteme wie z.B.: WordPress, haben meistens einen RSS-Feed eingebaut!), denn dann kann man per RSS Graffiti (http://www.facebook.com/RSS.Graffiti) einfach automatisch die News, die man auf seiner Homepage in das RSS-Feed einfügt auch auf Facebook einfügen lassen (http://twitterfeed.com/ ist ein ähnlicher Dienst für Twitter und Facebook!).

Wenn man aber auf Facebook anderes veröffentlichen will, als auf der Homepage, dann muss man Statusmeldungen auf Facebook posten.

Nun sollte auf der Facebook-Fanseite das selbe (in Abständen von meistens 30 Minuten aktualisiert) stehen, wie auf der Homepage! 🙂