Hugo statt jekyll
14. Juli 2017
Kaum beschäftigt man sich etwas mit Generatoren von statischen Webseiten, schon findet man vielversprechende Konkurrenz.
Das auf Ruby basierende jekyll ist schon deutlich länger im Geschäft als hugo, entsprechend finden sich auch mehr Anleitungen und Hilfen für jekyll.
Das Schöne an hugo ist seine Kompaktheit.
Es besteht nur aus einer ausführbaren Datei und nicht aus vielen verschiedenen Paketen wie jekyll.
Das erleichtert die Installation deutlich, aber alles was hugo nicht von selbst mitbringt, ist nicht sooo einfach nachzurüsten.
Ein Beispiel dazu ist das Syntax-Highlighting.
Bei jekyll wurde es mittels CSS und einer gewissen Anpassung der HTML-Daten umgesetzt.
Hugo setzt hierbei (noch?) auf
Hier hat sich was getan, siehe.javascript
.
Neues Projekt
Zu allererst legt man mit
$ hugo new site NeueHP
ein neues Projekt an. Das ist leer und damit man überhaupt etwas zu sehen bekommt, muss man eine Vorlage dem Projekt hinzugefügt werden. Für diese Seite wurde Minimal gewählt. Zum Hinzufügen klont man die Vorlage einfach ins Projektverzeichnis wie folgt.
$ cd NeueHP
$ git clone http://github.com/calintat/minimal/ themes/minimal
Anschließend kopiert man noch die Beispielkonfiguration.
$ cp themes/minimal/exampleSite/config.toml .
Alle Vorlagen haben eine Beispielkonfiguration und diese passt man natürlich noch an.
Einträge hinzufügen
Neue Einträge lassen sich händisch erstellen, aber hugo nimmt einem das auch ab. Ein neuer Blogeintrag wird mit
$ hugo new post/neuer-eintrag.md
erstellt, eine neue Seite mit
$ hugo new ueber-mich.md
Während die Blogeinträge automatisch indiziert werden, verlangt die verwendete Vorlage für die Verlinkung von “Seiten” Handarbeit.
Der Einstiegspunkt hierfür ist die Konfigurationsdatei config.toml
.
Seite darstellen
Mit
$ hugo server
startet hugo einen Webserver, der unter localhost:1313 erreichbar ist, und mit dem Parameter -t Vorlagenname
können auf einfache Weise verschiedenste Vorlagen ausprobiert werden.
Allerdings zieht dies i.d.R. eine Anpassung der Konfigurationsdatei config.toml
nach sich.
Konfigurationsdatei anpassen
Während jekyll die fertige Webseite unter _site
ablegt, legt hugo diese standardmäßig unter public
ab.
Das beißt sich mit den bestehenden Domainstellungen, die hier beschrieben sind.
Deshalb muss in der Konfigurationsdatei config.toml
noch folgende Zeile hinzugefügt werden.
publishdir = "_site/"
Webseite generieren
Ein einfacher Aufruf von hugo ist alles was zu tun ist.
$ hugo
Anschließend findet sich im Projektverzeichnis der Ordner _site
(bzw. public
).
Vorlage aufmotzen
Im Gegensatz zur Vorlage verwendet diese Seite tags. Die Funktionalität habe ich der Vorlage hugo-now entnommen und mein Gesamtkonstrukt findet sich auf GitHub. Auch sind mit Ausnahme der Schrift alle CDN-Verknüpfungen entfernt worden.