Erfahrungsbericht: WordPress 2 Grav
WordPress nervt, oder?
Nachtrag Jan. 2023: wordpress-wp2grav-markdown-exporter ist eingeschränkt immer noch nutzbar: wordpress-wp2grav-markdown-exporter/issues/6
Aber eigentlich nerven die vielen Hacker-Angriffe und die ständigen Updates. Denn es gibt für WordPress nicht nur sehr viele Plug-Ins sondern dadurch auch potentiell sehr viele Schwachstellen und entsprechende Updates.
Also habe ich nach Alternativen gesucht:
- Erzeugung statischer html-Seiten mittels Static Site Generators
- Dynamische Erzeugung aus Text-Dateien mittels flat-file CMS
Ich habe mich dann für GRAV entschieden:
- führendes "open source flat-file CMS"
- Seiten in Markdown und twig-Templates fürs Layout und PHP sagen mir zu
- Die Demo passt zu meinen Anforderungen: blog Demo
- Die Doku hat einen guten Eindruck gemacht: Doku
- Die testweise Installation gelang ohne Hürden: Installation
- Es gibt, bzw. gab, einen WordPress-Export für grav.
Und ich habe mir zugetraut, das Layout der Test-Installation (antimatter-Template) mit wenigen CSS-Änderungen an meine Vorstellungen anzupassen. Das sollte nicht zu aufwändig werden! Es existieren zwar noch weitere Themes, die habe ich aber nicht geprüft. Ich bin bei antimatter geblieben und mit dem Ergebnis sehr zufrieden.
In der grav-Doku und im Internet habe ich zwar alle benötigten Informationen für den Umstieg auf grav gefunden, aber manchmal hat es etwas gedauert. Daher habe ich mich entschlossen, meine Erfahrungen mit grav hier für alle aufzuschreiben, die auch auf grav umsteigen wollen, um ...
- grav besser einschätzen zu können,
- den Aufwand besser einschätzen zu können,
- Fallstricke leichter überwinden zu können.
Ich hoffe also, ihr findet hier hilfreiche Tipps und seid am Ende auch mit eurem Ergebnis zufrieden.
Hinweis: Hier gibt's nur Tipps, als Ergänzung zur offiziellen Doku. Ihr kommt um das Lesen der Doku nicht herum, wenn ihr auch auf grav umsteigen wollt..
Aber Fallstricke gibt es schließlich in jedem CMS. Also los geht's ...
Schritt für Schritt
Ich bin weiter wie folgt vorgegangen:
1. WordPress-Export
Das wp2grav-WordPress-Plugin ist leider nicht mehr verfügbar, aber das GitHub-Repository https://github.com/SiteBeez/wordpress-wp2grav-markdown-exporter existiert noch. Damit konnte ich meine WordPress-Inhalte einigermaßen exportieren. Die Markdown-Dateien landen unter /wp-content/uploads/wp2grav/export und können von dort in die grav-Verzeichnisstruktur kopiert werden.
Einschränkungen, die ich festgestellt habe:
- Kategorien und Tags erfordern Nacharbeiten
- Bilder werden mit der alten, absoluten WordPress-URL eingebunden und müssen manuell ins jeweilige pages-Verzeichnis oder
user/pages/imageskopiert und dann in den Seiten relativ verlinkt werden. - Manche Links, auch zwischen Seiten, verwenden absolute URLs, verweisen auf die alten WordPress-Seiten und müssen manuell korrigiert werden.
- Der "Weiterlesen"-Marker muss manuell in die Grav-Pages eingefügt werden: Summary Size and Separator.
- … und weitere Anpassungen (siehe unten)
Das Grundgerüst der Seiten konnte ich also gut aus WordPress exportieren, aber Nacharbeit ist nötig ...
Ich habe die Nacharbeit auch genutzt, um die Seiten aufzuräumen, externe Links zu korrieren, überflüssiges zu entfernen usw. Das war sowieso nötig.
Alternativ könnt ihr auch nach anderen WordPress-To-Markdown-Exportern suchen, z.B. für andere CMS, die auch Markdown für die Texte verwenden.
2. CSS-Anpassungen
Die Theme-Styles können in user\themes\antimatter\css\custom.css ergänzt und überschrieben werden: Custom CSS. Empfohlen wird allerdings die Ableitung eines Kind-Templates: Theme Inheritance. Das ist einfach und man kommt auch nicht drum herum, wie ich später festgestellt habe: Die Änderung der rechten Spalte (sidebar) oder des Footers erfordert eine Vererbung oder Änderung des Templates.
Denkt bei der Theme-Vererbung daran, auch das favicon dort abzulegen: user\themes\mytheme\images\favicon.png.
Hinweis: Aus mir unerfindlichen Gründen wurden meine Custom-CSS-Änderungen erst dann vom Browser berücksichtigt, als ich eine "leere" CSS-Anweisung davor gesetzt habe, "to activate", z.B.
#body img {
// to activate img
}
#body img.right {
margin: 0 0 20px 20px;
max-width: 47%;
}Mit der Anpassung von Custom SCSS/LESS habe ich mich nicht beschäftigt.
3. Blog-Grund-Einstellungen
Die Grundeinstellungen werden in system/config/system.yaml System Configuration und system/config/site.yaml Site Configuration vorgenommen und sind gut dokumentiert.
Nur über die Sprach-Einstellungen bin ich gestolpert. Damit meine Seiten in deutsch dargestellt werden, z.B. "weiterlesen" statt "continue reading", waren die folgenden Anpassungen nötig:
-
system\config\site.yaml:default_lang: de -
system\config\system.yamlunter languages:supported: [de]include_default_lang: false
4. Bilder
Das antimatter-Theme zeigt das erste Bild im Page-Ordner automatisch als Header-Bild an. Dies kann mit header_image: false in der .md-Datei der Seite abgeschaltet werden.
Alternativ können Bilder z.B. unter user/pages/images oder user/images abgelegt werden, statt im Page-Ordner.
Die Bilder erscheinen nach dem WordPress-Export im "Fließtext" und können über CSS-Klassen positioniert werden. Die Bild-Anzeige wird über URL-Parameter gesteuert.
Hier ein paar Beispiele:
- Bild rechtsbündig, Text links umfließend:
- Bild rechtsbündig mit Beschriftung und Plugin image-captions
- Bild mit Lightbox und Plugin featherlight
- Bild rechtsbündig mit Lightbox und Beschriftung
- Bild rechtsbündig mit Lightbox, mit Titel, ohne Beschriftung
Und hier die zugehörigen Markdown-Befehle:
Es sind also grav-Plugins nötig, um Bilder so anzeigen zu können. Die oben genannten Plugins habe ich - auch im Zusammenspiel - erfolgreich getestet. Infos über Einschränkungen und Erweiterungsmöglichkeiten findet ihr auf den verlinkten Plugin-Seiten.
Hinweis: Manchmal musste ich Bilder unter anderem Namen neu abspeichern, damit sie in der richtigen resize-Größe angezeigt wurden. Vermutlich hat hier das eigentlich intelligente Caching von grav dazwischen gefunkt. Manchmal hilft es auch, die Cache-Verzeichnisse zu löschen: Clearing Grav Cache, z.B. mit dem Befehl bin/grav clearcache --images-only
/images/cache/user/data
Hinweis: Die caches können auch über die Kommandozeile oder das Admin-Dashboard gelöscht werden.
5. Plugins
Zusätzlich habe ich die folgenden Plugins installiert:
- Bild-Beschriftung: image-captions: s.o.
- Lightbox: featherlight: s.o.
- einfache Formulare: form, z.B. mein Kontaktformular
- Cookie-Zustimmung: cookieconsent
- Google Analytics, aber ohne "opt out", damit der User das Tracking abschalten kann. Das habe ich ergänzt und dem Entwickler als Pull Request zur Verfügung gestellt und so kommt es hoffentlich bald für alle in das Plugin.
Weitere Plugins findet ihr unter https://getgrav.org/downloads/plugins.
6. Mehr als Markdown
In den Markdown-Dateien ist übrigens mehr möglich:
- HTML kann direkt verwendet werden, z.B.
<div style="clear: both;"></div> - Markdown Extra, muss unter pages eingeschaltet werden
- twig-Befehle und Einbettung von anderen twig-Templates, wenn eingeschaltet: Reuse page or modular content on another page
- Plugins für PHP-Snippets und Shortcode (wie in WordPress)
7. Server-Probleme
Die offizielle Doku gibt viele Hinweise, auch ein extra Kapitel Troubleshooting bei Server-Problemen.
Ich hatte z.B. fehlende Schreibrechte auf dem Live-Server und bei mir hat dann der folgende Befehl geholfen:
chmod g+w assets/ backup/ cache/ images/ logs/ tmp/ user/data/Daraufhin wurde das "Prüfergebnis" des Plugins problems angezeigt und ich konnte die Seiten auch live ans Laufen kriegen. (Dieses Plugin und weitere waren bei mir von Anfang an installiert.)
8. Admin-Tool nur in Entwicklung
Zusätzlich gibt es noch das komfortable Administration Panel, über das z.B. Plugins aktualisiert oder Seiten erstellt und bearbeitet werden können.
Wer auf dem Live-System eine andere Konfiguration haben möchte als auf der Entwicklungssystem, der kann abweichende Environment Configuration einrichten. Ich habe z.B. das Admin-Panel generell abgeschaltet und es nur lokal eingeschaltet:
-
user\plugins\admin\admin.yamlmitenable: false -
user\localhost\config\plugins\admin.yamlmitenable: true
9. Kommentarfunktion
Das gibt es in einem flat-file-CMS leider nicht und man muss auf "externe" Lösungen ausweichen. Aber diese Thema habe ich für mich auf später verschoben … grav-comments-plugin, grav-jscomments-plugin, Disqus-Alternativen, Alternatives For Disqus?.
Schlussbemerkung
Hmm, es war doch mehr Arbeit, als ich dachte. Aber alles hat für meine Anforderungen eines einfachen Blogs ohne große Umwege geklappt. Und mit diesen Tipps wäre es noch schneller gegangen.
Rückmeldung übers Kontaktformular
Ich hoffe, meine Erfahrungen sind hilfreich
und für Rückmeldungen bin ich dankbar!