Hugo on maik.io

Panda Day

Mon, 16 Mar 2026 09:25:57 +0000

Der eine oder andere hat vermutlich bemerkt, dass ich Hugo als CMS nutze. Hugo bringt im Kern bereits GoAT mit, ein ASCII-Tool für Diagramme. Damit lassen sich nicht nur klassische Schaubilder erstellen, sondern auch Pixel- oder Dotgrafiken. Damit habe ich ein wenig experimentiert.

Happy Panda Day!

Alte Beiträge in Hugo markieren

Tue, 21 Oct 2025 15:58:00 +0200

Ich habe eine kleine Hinweisfunktion eingebaut, die bei Beiträgen erscheint, die älter als ein Jahr sind. Mir war wichtig, dass dieser Hinweis nicht bei reinen Fotobeiträgen auftaucht – Fotos verlieren schließlich selten an Relevanz. Zuerst habe ich selbst eine funktionierende Version geschrieben, anschließend den Code von einem Sprachmodell noch etwas optimieren lassen. Jetzt läuft bei mir folgende Variante:

{{- /* Tags prüfen */ -}}
{{- $tags := default (slice) .Params.tags -}}
{{- $tagsLower := apply $tags "lower" "." -}}
{{- $hasPhoto := in $tagsLower "photo" -}}

{{- /* Relevantes Datum bestimmen und Stichtag berechnen */ -}}
{{- $pageDate := time.AsTime (or .Lastmod .PublishDate .Date) -}}
{{- $oneYearAgo := (now).AddDate -1 0 0 -}}

{{- /*Hinweis nur auf echten Seiten, mit gültigem Datum, älter als 1 Jahr und nicht beim Tag "photo" */ -}}
{{- if and .IsPage (not $hasPhoto) (gt ($pageDate.Unix) 0) (lt $pageDate $oneYearAgo) -}}
  <div class="alert alert-warning">
    Hinweis: Dieser Artikel ist über ein Jahr alt. Die Informationen könnten veraltet sein.
  </div>
{{- end -}}

HugoMods

Mon, 22 Apr 2024 17:43:00 +0100

Wer das CMS Hugo einsetzt, dem sei HugoMods empfohlen. Hier werden Tools und Plugins für das Content-Management-System gebündelt.

]]>

Vielen Dank fürs Lesen! Wenn du Lust auf noch mehr Gedanken, Updates und ab und zu einen Blick hinter die Kulissen hast, folge mir doch gern auf Mastodon oder Instagram.

Hast du Fragen oder Feedback? Schreib mir gern eine E-Mail.

Externe Umleitung in Hugo

Sun, 17 Dec 2023 10:55:00 +0200

Als Blogger hatte ich heute den Wunsch, URLs, die auf ein Unterverzeichnis zeigen, auch extern umzuleiten.

In dem Blogpost »Using Hugo as a redirect service« von Daniel Terhorst-North stieß ich auf eine super schlanke Lösung.

Um dies zu erreichen, muss die folgende Datei im Theme-Ordner angelegt werden: /layouts/redirect/single.html.

Der Datei muss der folgende Quellcode hinzugefügt werden:

{{- template "_internal/alias.html" (dict "Permalink" .Params.target) -}}

Nun kann man eine Datei erstellen und die Weiterleitung mit den folgenden vier Zeilen definieren. Dabei bestimmt der Dateiname auch das Verzeichnis der Quell-URL:

---
type: redirect
target: https://google.de
---

]]>

Vielen Dank fürs Lesen! Wenn du Lust auf noch mehr Gedanken, Updates und ab und zu einen Blick hinter die Kulissen hast, folge mir doch gern auf Mastodon oder Instagram.

Hast du Fragen oder Feedback? Schreib mir gern eine E-Mail.

Hugo kostenlos mit GitHub und DigitalOcean

Sat, 18 Nov 2023 13:53:54 +0100

Dieses Tutorial beschreibt, wie ein Hugo-Blog mit GitHub als Versionskontrollsystem und DigitalOcean App Platform als Hosting-Dienst konfiguriert wird. Die Anleitung basiert auf macOS, die beschriebenen Schritte können jedoch auch unter Linux ausgeführt werden. Dafür muss Homebrew (über brew) durch sudo apt-get ersetzt werden.

Voraussetzungen

macOS oder Linux: Betriebssystem.

Homebrew (oder apt-get für Linux): Paketmanager. Installieren unter macOS mit:

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Git: Installieren mit:
```
brew install git
```
Hugo: Installieren mit:
```
brew install hugo
```
GitHub-Konto: GitHub für Versionskontrolle.
DigitalOcean-Konto: DigitalOcean für das Hosting. Es wird ein Konto mit einer Zahlungsmethode benötigt (Kosten entstehen nicht).

Schritt 1: Neues Hugo-Projekt erstellen

Terminal öffnen und folgenden Befehl ausführen, um ein neues Hugo-Projekt zu erstellen:
```
hugo new site example.com
```

Hinweis: example.com ist ein Platzhalter. Hier muss die eigene Domain eingesetzt werden.

Wechsel in das Projektverzeichnis:
```
cd example.com
```

Das Theme “PaperMod” hinzufügen:

git init
git submodule add https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod
echo 'theme = "PaperMod"' >> config.toml

Beispiel-Inhalte generieren:

hugo new posts/welcome.md
echo "---
title: 'Willkommen'
date: $(date +%Y-%m-%dT%H:%M:%S%z)
draft: false
---
Dies ist der erste Beitrag." > content/posts/welcome.md

Projekt lokal starten, um die Inhalte zu überprüfen:
```
hugo server
```
Der Blog ist unter http://localhost:1313 verfügbar.

Schritt 2: Projekt zu GitHub hochladen

Neues Repository auf GitHub erstellen. Name: example.com.

Terminal öffnen und das Projekt zu GitHub hochladen:

git remote add origin https://github.com//example.com.git
git branch -M main
git add .
git commit -m "Initial commit"
git push -u origin main

Schritt 3: Deployment mit DigitalOcean App Platform

DigitalOcean App Platform öffnen.
Auf “Create App” klicken und GitHub als Quelle auswählen.
GitHub-Zugriff gewähren und das Repository example.com auswählen.
Folgende Einstellungen konfigurieren:
- Branch: main
- Build Command: hugo
- Publish Directory: public
Auf “Next” klicken und den kostenlosen Plan auswählen.
App bereitstellen, indem auf “Deploy” geklickt wird.

Schritt 4: Domain konfigurieren

Auf DigitalOcean zur App navigieren und “Settings” öffnen.
Unter “Domain” auf “Add Domain” klicken und example.com eingeben.
DNS-Einträge auf der Domain-Registrar-Seite anpassen:
- Typ: CNAME
- Name: @
- Ziel: Die von DigitalOcean bereitgestellte Adresse.
Die Änderung kann bis zu 24 Stunden dauern.

Schritt 5: Blog testen

Nach Abschluss der Konfiguration ist der Blog unter https://example.com erreichbar.

Disclaimer

Die beschriebene Konfiguration basiert auf meiner persönlichen Erfahrung und kann je nach individuellen Anforderungen variieren. Es wird empfohlen, die offizielle Dokumentation von Hugo, GitHub und DigitalOcean zu konsultieren, um detaillierte Informationen zu erhalten. Da DigitalOcean und GitHub weder europäische noch deutsche Anbieter sind, ist es im Hinblick auf die DSGVO wichtig, genau zu prüfen, welche Benutzerdaten gespeichert oder verarbeitet werden. In meinem Fall werden keinerlei Besucherdaten gespeichert oder ausgewertet, weshalb dies keine Einschränkung darstellt.

]]>

Vielen Dank fürs Lesen! Wenn du Lust auf noch mehr Gedanken, Updates und ab und zu einen Blick hinter die Kulissen hast, folge mir doch gern auf Mastodon oder Instagram.

Hast du Fragen oder Feedback? Schreib mir gern eine E-Mail.