Hallo Hugo
Dieses Blöglein wurde mit HUGO , einem Static- Site- Generator erstellt. Damit erstellt man ratz- fatz im Handumdrehen statische HTML Web- Seiten, oder einen Blog.
Es gibt mehrere solcher Generatoren…
- Jekyll
- Pelican
- Hexo
- Octopress
Und und und….
Zuvor hatte ich mit Hexo diese Blöglein generieren lassen.
Das coole an diesen Static-Site Generatoren ist, das man sich im Prinzip voll und ganz auf das Schreiben konzentrieren kann, so man sich zuvor für das richtige Template entschieden hat. Der Content, also das was man schreibt, landet als reines Text-file in einer *.md Datei.
Die Erweiterung sagt, das es sich hier um Markdown handelt. Markdown ist eine Text- Auszeichnungssprache,
Die Markdown-Konvertierungssoftware wandelt Text in gültiges und W3C-konformes XHTML um. Was will man mehr. Markdown ist selbst für den ungeübtesten Anfänger kinderleicht zu erlernen.
Eine Überschrift sieht so aus :
## Überschrift
Fettschrift würde so aussehen :
**Fettschrift**
Oder wenn man z.B. ein Bildchen in den Text einfügt, dann schreibt man :
Im schlimmsten Fall schreibt man eben nur einfachen Text. Dann halt ohne die Möglichkeit Grafiken einzubinden. Aber immerhin, es geht. Ich möchte jetzt nicht zu Tief ins Detail eingehen. Hier gibt es eine übersicht der gängigsten Markdown Formatierungen.
Da, wie ich bereits schon erwähnt habe, der Content in lauter kleine Markdown Dateien verpackt ist - jedes Posting existiert in einer separaten *.md Datei - hat man es hinterher um so leichter, den eigenen Blog mit einem anderen Statsichen- Seiten- Generator weiterzuführen. Z.B. mit jekyll.
Ich habe mich von HEXO getrennt, weil fast alle verfügbaren Hexo- Templates zu sehr mit unnötigen Java-Script schnick-schnack völlig überladen sind.
Wenn man jetzt noch selbigen Blog im Onion Gelände publiziert, sollte Java-Script ein Tabu sein. Man kann von einem Tor Benutzer nicht wirklich verlangen, das er gefälligst Java-Script in seinem Browser erlauben soll. hust !!
Hinzu kommt noch der Umstand das Node.js, respektive also auch NPM, benötigt wird um Hexo, plus diverse Plugin’s ans laufen zu bekommen.
Beides liegt für mein O.s. nur in Asbach - Uralt Versionen vor. Ich möchte mein System nicht unnötig mit Fremdquellen zu- Müllen.
Die Hugo Installation :
Die Hugo Installation unter Ubuntu/Mint gestaltet sich als extrem schwierig einfach. Man lädt sich das aktuelle Archiv von Github herunter, entpackt es und verschiebt abschließend den Inhalt (unter root) nach /usr/local/bin/
wget https://github.com/gohugoio/hugo/releases/download/v0.37/hugo_0.37_Linux-64bit.tar.gz
tar -xf hugo_0.37_Linux-64bit.tar.gz
sudo mv hugo /usr/local/bin/hugo
Das war’s auch schon.
Die ersten Schritte :
Erste Schritte nach der Installation
Wir checken im terminal zuerst mal welche Version wir intalliert haben.
hugo version
Hugo Static Site Generator v0.37 linux/amd64 BuildDate: 2018-02-27T09:15:25Z
Okay, dies scheint die neueste Version zu sein. Nämlich die vom 27.02.2018
Jetzt erstellen wir einen Ordner in dem Hugo seinen Projekt-Dateien ablegen kann.
mkdir ~/sites
Jetzt wechselt man im Terminal in den neu erstellten ordner
cd sites
In diesem Ordner erstellen wir ein neues HTML Projekt mit dem Namen quickstart
hugo new site quickstart
Ausgabe im Terminal :
Your new Hugo site is created in /home/benutzer/sites/quickstart.
Hugo hat nun einige Ordner, welche zum projekt quickstart gehören, erstellt.
.
└── quickstart
├── archetypes
│ └── default.md
├── config.toml
├── content
├── data
├── layouts
├── static
└── themes
Bevor wir mit dem erstellen eigener Artikel, postings usw. beginnen können, müssen wir uns zuerst ein passendes Hugo-theme herunterladen. Eine Übersicht findet man bei https://themes.gohugo.io
Ich habe mich für ein responsive taugliches Theme namens “Ananke” enstchieden. Responsive deshalb, weil man später den Blog auch auf einem WischoPhone gut zu Gesicht bekommt.
Nach dem herunterladen (wer möchte, kann dies natürlich auch per git machen) entpackt man gohugo-theme-ananke-master.zip in den dafür veorgesehenen thems Ordner.
└── quickstart
├── archetypes
│ └── default.md
├── config.toml
├── content
├── data
├── layouts
├── static
└── themes
└── gohugo-theme-ananke-master
Damit Hugo weiß, mit welchem Theme der Blog künftig generiert werden soll, muss man diese Information in der Blog - Konfigurationsdatei config.toml hinterlegen.
Diese Datei befindet sich im Ordner ~/sites/quickstart/ und kann mit jedem X-beliebigen Texteditor bearbeitet werden. Da ich am Desktop -Rechner sitze, benutze ich einen Editor mit GUI und verzichte auf nerdlastige tools wie emacs, vim, nano und co. und benutze statt dessen mousepad, leafpad oder pluma.
mousepad ~/sites/quickstart/config.toml
Nun fügt man eine Zeile mit demenstrechenden Eintrag hinzu.
baseURL = "http://example.org/"
languageCode = "en-us"
title = "My New Hugo Site"
theme = "gohugo-theme-ananke-master"
Jetzt beginnen wir mit dem erstellen des ersten Blog - Posts. Dazu führen wir im Ordner ~/sites/quickstart folgendes im Terminal aus.
hugo new posts/my-first-post.md
Hugo hat jetzt im Ordner ~/sites/quickstart/content/posts/ einen neuen Markdown Eintrag erstellt my-first-post.md, welchen man ebenfalls mit jedem x-belieben Texteditor öffnen kann und unterhalb des Trenners
- - -
mit eigenem content befüllt werden möchte.
---
title: "My First Post"
date: 2018-03-04T15:22:04+01:00
draft: true
---
## Hallo Welt
Franz jagt im komplett verwahrlosten Taxi quer durch ganz Bayern
Nach dem Speichern der Markdown - Datei lassen wir hugo unseren Blog im Browser Anzeigen und führen im ordner ~/sites/quickstart
hugo server -D
aus.
Ausgabe im Terminal :
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
Der Hugo Server liefert uns die Seite im Webbrowser unter http://localhost:1313/ aus.
Neue Blog -Posts erstellt Hugo per Default immer als Entwurf (draft) ! Die Option -D bewirkt, das Draft’s ebenfalls angezeigt werden.
Nun ist es an der Zeit, den Blog zu veröffentlichen. Dazu muß Hugo zuerst alle statischen Seiten generieren, welche im Ordner “public” landen.
Dazu führt man im Ordner ~/sites/quickstart einfach nur den Befehl
hugo
….aus.
.
└── quickstart
├── archetypes
│ └── default.md
├── config.toml
├── content
│ └── posts
│ └── my-first-post.md
├── data
├── layouts
├── public
│ ├── 404.html
│ ├── categories
│ │ ├── index.html
│ │ └── index.xml
Jetzt muss nur noch der Inhalt des Ordners public per rsync ins docroot auf dem eigenen auf den Webspace transferiert werden.
Z.B.
rsync -a -e "ssh" /home/user/hugosites/fotoblog/public/ user@mein.server.com:/var/www/ --del
Die Option - -del (delete) stellt sicher, das sich keine nicht mehr benötigten Dateileichen auf dem Server befinden um selbigen mit der Zeit unnötig zuzumüllen. Aber dies bleibt natürlich jedem selbst überlassen.
