Datum in Listen

Hugo Typo - Datum in bestimmten Kollektionen anzeigen

  ·  2 min read

Das Hugo-Theme Typo sieht vor, das Erstellungsdatum der Artikel bedingt darzustellen. Leider funktioniert dieses Partial nicht wie erwartet. Es gibt jedoch Lösungen.


Der Parameter “showListDate: false” ist in Frontmatter gesetzt.

post-entry Partial (Typo):

<div class="post-line">

    {{ $dateFormat := .Site.Params.listDateFormat | default "2 Jan 2006" }}

    {{ if .Parent.Param "showListDate" | default true }}
        <p class="line-date">{{ .Date | time.Format $dateFormat }} </p>
    {{ end }}

    <div>
        <p class="line-title">
            <a href="{{ .RelPermalink }}">
                {{ .Title }}
            </a>
        </p>

        {{ if .Site.Params.listSummaries }}
        <p class="line-summary"> {{ .Summary }} </p>
        {{ end }}
    </div>
</div>

⚠️ Das Datum bleibt noch sichtbar.

Ursache #

Es liegt an ‘.Parent.Param’.

{{ if .Parent.Param "showListDate" | default true }}

Diese Zeile wird immer als „true“ ausgewertet, da „| default true“ auf das Ergebnis von .Parent.Param als String und nicht als bedingten Boolean angewendet wird. Ausserdem kann die Vorrangstellung von „|“ (Pipe) in Hugo-Templating zu unerwartetem Verhalten führen.

Korrekte Vorgehensweise:

Die Parametersuche korrekt mit „default“ umschliessen, zum Beispiel:

{{ if (.Parent.Param "showListDate" | default true) }}

oder sowieso besser: ‘.Param’ direkt nutzen. Hugo beachtet Parameter hierarchisch (inkl. in _index.md)

{{ if (.Param "showListDate" | default true) }}

Wieso .Param statt .Parent.Param?

  • .Param prüft bereits die Seitenparameter und ihre Vorgänger, falls keine gefunden worden sind.
  • .Parent.Param ist nur nötig, falls die Verwendung der übergeordneten Seite ausdrücklich zu erzwingen ist.

Page-Parameter #

Das korrekte Snippet. Aber: Auf jeder Seite muss der Parameter “showListDate: false” gesetzt sein 🤨.

{{ if (.Param "showListDate" | default true) }}
    <p class="line-date">{{ .Date | time.Format $dateFormat }}</p>
{{ end }}

Pro Sektion #

Der .Section-Ansatz führt zum Ziel. Hugo setzt .Section automatisch auf das oberste Verzeichnis (in diesem Fall „Posts“) für alle Inhalte in ‘/content/posts/’ – einschließlich aller Unterverzeichnisse.

{{ if and (eq .Section "posts") (.Param "showListDate" | default true) }}
  <p class="line-date">{{ .Date | time.Format $dateFormat }}</p>
{{ end }}