Hugo - i18n Multilingual - lastmod Datum länderspezifisch anpassen

Wenn das Erstellungsdatum (date) oder Änderungsdatum (lastmod - last modifikation) auf der Webseite angezeigt wird, sollte die Anzeige je nach Sprache länderspezifisch angepasst werden. In dem nachfolgenden Hugo Partial zeige ich wie es auf meinen Webseiten eingesetzt wird.
Beitrag aktualisiert am 07.06.2023
Ich habe den Inhalt dieses Beitrags etwas ĂĽberarbeitet.
date und lastmod auf meiner Website
Auf meinen Blogseiten wird das Erstellungsdatum (date) oder, wenn die Seite später geändert wurde, das Änderungsdatum (lastmod) angezeigt. In der Blogliste und auf der Blogbeitragsseite wird das gleiche Hugo Partial createDate-lastMod.html
verwendet. Jede Seite ist in Deutsch und Englisch verfĂĽgbar.
Beim Erstellen eines Blogbeitrags wird das Feld date
im Front Matter automatisch mit dem aktuellen Datum gefĂĽllt. Durch eine etwas angepasste Einstellung in der hugo.toml
fĂĽr die Systemvariable lastmod
wird das date
bei der Erstellung automatisch in die Systemvariable lastmod
übernommen. Zusätzlich habe ich ein Front Matter Feld lastmod
. Dieses Feld lastmod
wird nur manuell gefüllt, wenn ich inhaltliche Änderungen an einem Blogbeitrag vornehme. Ich verwende dieses Feld auch, wenn Blogbeiträge von mir geprüft und aktualisiert werden.
Durch die Sortierung der Blogliste mit .ByLastmod.Reverse
werden die Blogbeiträge in absteigender Reihenfolge nach lastmod
sortiert. Dadurch werden aktualisierte, ältere Blogbeiträge wieder auf den vorderen Pagination Seiten angezeigt.
Im Front Matter fĂĽr meinen Blogbeitrag - Kostenlose Bootstrap SVG-Icons in Hugo benutzen
- ist ein date
und ein von mir manuell geändertes lastmod
vorhanden. Im dem Fall zeige ich das lastmod
in einem länderspezifischen Format mit dem Hinweis Update an. Wenn kein manueller Front Matter Eintrag für lastmod
vorhanden ist wird date
ohne Hinweis ausgegeben.
Durch Klick auf die Länderflagge rechts oben, wird die Sprache umgeschaltet. Die Anzeige des Datums erfolgt länderspezifisch.

Front Matter Variablen date und lastmod
Der Front Matter Eintrag fĂĽr die deutsche index.md
und die englische index.en.md
ist bei date
und lastmod
in meinen Blogbeiträgen identisch. Bei der Erstellung schreibe ich zuerst die deutsche Markdown Datei, kopiere diese dann und übersetze anschließend. Deshalb das identische date
und lastmod
.
Front Matter Eintrag in der Markdown Datei von diesem Blogbeitrag:
---
..
date: 2023-01-18T18:15:47+01:00
lastmod: 2023-06-07T18:15:47+01:00
..
---
Unter themes/tekki/archetypes/
habe ich das Content Template File blog.md
erstellt. Informationen zu Archetypes finden Sie in der Hugo Dokumentation - What are Archetypes?
. Das Erstellungsdatum date
wird dadurch automatisch eingefĂĽgt.
Mein Front Matter aus themes/tekki/archetypes/blog.md
:
---
..
date: {{ .Date }}
lastmod:
..
---
Das Änderungsdatum eines Blogartikels - lastmod
- schreibe ich bei einer nachträglichen Änderung in Form von 2023-06-07T18:15:47+01:00
in die Front Matter Variable. Dort gebe ich nur ein Datum an, wenn inhaltliche Änderungen / Erweiterungen in dem Blogbeitrag erfolgen. Rechtschreibkorrekturen sind für mich keine inhaltlichen Änderungen. Keine Änderung gleich kein Datum.
Eintrag in der hugo.toml
Damit die Anpassung von lastmod
bei mir funktioniert, habe ich in der hugo.toml
, im Hauptverzeichnis vom Hugo-Projekt, die default Einstellungen wie folgt ĂĽberschrieben:
..
[frontmatter]
lastmod = ['lastmod', 'date']
..
Das Erstellungsdatum date
wird beim Erstellen eines neuen Blogbeitrags automatisch in die Systemvariable lastmod
kopiert. Die lastmod
Front Matter Variable ist zu dem Zeitpunkt noch leer. Die default Werte können in der Hugo Dokumentation unter - Configure Dates
- nachgelesen werden.
Bei einigen hugo.toml
Änderungen muss man Hugo mit ctrl+c
beenden und neu starten, damit die Änderungen wirksam werden. Ich mache das aus Sicherheitsgründen immer.
Hugo Partial für die länderspezifische Anpassung von date und lastmod
Das Hugo Partial wird unter themes/tekki/layouts/partials/createDate-lastMod.html
gespeichert. tekki
ist mein Themename.
{{ $datetime := substr .Date 0 10 }}
{{ $date := .Date | time.Format ":date_medium" }}
{{ $lastmod := "" }}
{{ if eq .Site.Language.Lang "de" }}
{{ $lastmod = .Lastmod.Format "02.01.2006" }}
{{ $date = substr $date 0 10 }}
{{ else }}
{{ $lastmod = .Lastmod.Format "Jan 2, 2006" }}
{{ $date = substr $date 0 12 }}
{{ end }}
{{ if eq $lastmod $date }}
<time datetime="{{- $datetime -}}">{{- $date -}}</time>
{{ else }}
{{ $datetime = substr .Params.lastmod 0 10 }}
<strong>Update:</strong> <time datetime="{{- $datetime -}}">{{- $lastmod -}}</time>
{{ end }}
Im ersten Teil des Partial
.. werden die benutzten Variablen initialisiert:
$datetime
wird fĂĽr das HTML-Tag time
benötigt. Die Formatierung des time
HTML-Tag weicht von der länderspezifischen Darstellung ab. Deshalb die Verrenkungen mit dieser Variablen. Suchmaschinen mögen mit Datum gekennzeichnete HTML-Tags. Das W3C schreibt die Formatierung des datetime
Attributes wie folgt vor: Date and Time Formats
$date
das Erstellungsdatum wird mit .Date | time.Format “:date_medium”
initialisiert. Dadurch wird automatisch ein länderspezifisches Format erstellt und alles hinter dem Datum abgeschnitten - Zeit etc. Die Hugo Dokumentation - time.Format
- beschreibt die Formatoptionen.
Die Variable $lastmod
wird deklariert. Ansonsten gibt es Probleme mit dem folgenden if
.
Im zweiten Teil des Partial
.. wird zuerst festgestellt ob der Webseitentext in deutsch geschrieben wurde. Wenn ja - dann wird mit .Lastmod.Format “02.01.2006”
die Systemvariable lastmod oder die Front Matter Variable lastmod ausgelesen und im deutschen Datumsformat in die Variable $lastmod
geschrieben. Das war ein Punkt den ich am Anfang nicht verstanden habe. Anscheinend ist es so, dass wenn die Systemvariable einen Inhalt hat und das Front Matter Feld lastmod ebenfalls einen Inhalt hat, das dann der Inhalt des Front Matter Felds verarbeitet wird. Magisch!
Weiter oben wurde $date
mit time.Format
länderspezifisch gefiltert. In der deutschen Sprache wird das Datum mit 10 Zeichen angezeigt. Alles andere wird mit substr
abgeschnitten.
Wenn nicht deutsch, dann wird das amerikanische Datumsformat benutzt. Und $date
mit 12 Zeichen angezeigt.
Im dritten Teil des Partial
.. erfolgt die Kontrolle ob $lastmod oder $date
ausgegeben werden soll.
Zuerst wird mit if eq $lastmod $date
festgestellt ob $lastmod und $date
gleich sind. Wenn ja, bedeutet dies das noch keine manuelle Eingabe im Front Matter Feld lastmod
erfolgt ist. Das heiĂźt, das Erstellungsdatum muss ausgegeben werden. Dies erfolgt eingepackt in das HTML-Tag time
. Die weiter oben vorbereitete Variable $datetime
kann benutzt werden. $date
wurde weiter oben länderspezifisch aufbereitet und kann ebenfalls ausgegeben werden.
Wenn $lastmod und $date
nicht gleich sind muss $lastmod
ausgegeben werden. Aber da ist ja noch das HTML-Tag time
mit $datetime
. Die Variable wurde am Anfang mit .Date
initialisiert. In diesem Zweig muss aber $lastmod
in das HTML-Tag geschrieben werden. Das mache ich mit substr .Params.lastmod 0 10
direkt aus dem Front Matter Feld. Danach wird alles ausgegeben.

Die absteigende lastmod Sortierung / Pagination
Die Teaser meiner Blogbeiträge möchte ich in absteigender lastmod Sortierung anzeigen. Dadurch werden überarbeitete Beiträge vom Ende der Blogliste an den Anfang gehoben und wecken dadurch hoffentlich ein entsprechendes Interesse.
Ich setze zwei Pagination auf meiner Website ein. Einen für die Teaser der Blogbeiträge und einen für die Teaser der Tagliste. Eine Erklärung dazu finden Sie in meinen Beitrag - Hugo - Pagination für Blogbeiträge und Tags .
{{ $paginator := slice }}
{{ if .IsHome }}
{{ $paginator = .Paginate (where .Site.RegularPages.ByLastmod.Reverse "Section" "blog") }}
{{ else }}
{{ $paginator = .Paginate .Pages.ByLastmod.Reverse }}
{{ end }}
Durch die Erweiterung .ByLastmod.Reverse
und der weiter oben beschriebenen, automatischen System date/lastmod Kopieraktion war die Umstellung der Sortierung nicht weiter aufwändig.
sitemap.xml kontrollieren
Wenn date
und lastmod
sauber angezeigt werden - solten Sie die länderspezifische sitemap.xml
kontrollieren.
Der von Hugo statisch generierte Sourcecode wird im Verzeichnis publishDir
gespeichert. Dort finden Sie in den Verzeichnissen de
und en
die länderspezifische sitemap.xml
. Wenn ein lastmod
sauber durch das System gerutscht ist, finden Sie dort das XML-Tag lastmod
bei dem entsprechenden Beitrag oder Tag.

Fazit
Das war ein ganz schöner Aufwand für mich. Am Anfang habe ich nicht verstanden wie Hugo lastmod
intern benutzt. Die von mir gefundenen Suchmaschinenbeispiele zum Thema lastmod
haben in meinem Fall alle nicht zum gewĂĽnschten Ergebnis gefĂĽhrt. Die Dokumentation von Hugo war in diesem Fall auch nicht sehr hilfreich. Aber Ende gut - alles gut, es funktioniert. Wenn Sie einen Fehler auf dieser Seite finden oder wenn ich etwas falsch dargestellt habe, dann benutzen Sie bitte den Kommentar um mir dies mitzuteilen.
Linkliste zu diesem Beitrag
- Kostenlose Bootstrap SVG-Icons in Hugo benutzen
SVG-Icons mit HTML und CSS/SCSS in Hugo integrieren
- Hugo Dokumentation - What are Archetypes?
- Hugo Dokumentation - Configure Dates
- Hugo Dokumentation - time.Format
- W3C - Date and Time Formats
Das könnte Sie auch interessieren
- Hugo - Pagination für Blogbeiträge und Tags
Pagination mehrfach auf einer Website einsetzen
- Hugo - Anleitung Teil 1 - i18n multilinguale Site erstellen
i18n - Teil 1 von 3 aufeinander aufbauenden Anleitungen fĂĽr das Erstellen einer Hugo multilingualen Website.
- ahrefs.com - kostenlose Webmaster-Tools
Technische SEO UnterstĂĽtzung.
Kommentare werden bei deutscher Spracheinstellung nicht in der englischen Variante der Webseite angezeigt und umgekehrt.