Hur man sparar miniatyrbilder i sidan bundel mapp för Hugo-webbplatser med Mainroad-tema

Håll all sidorelaterad innehåll i en mapp...

Sidinnehåll

Länge har jag varit irriterad över att behöva placera miniatyrbilder av sidorna i statisk katalog. Det gäller för Mainroad, Rodster och liknande Hugo-teman.

Jag föredrar att organisera Hugo-sidinnehåll som sidsamlingar, och skulle hellre se att alla bildrelaterade bilder för en sida lagras inom denna sidsamling.

bild sidsamling

Och här presenterar jag en lösning!

Hur man håller Mainroad Hugo-temats (och liknande) miniatyrbilder i mappen för sidsamlingar

Lägg bara till denna text i filen ./layouts/partials/post_thumbnail.html, och du kan lagra din bild var som helst från samling och statisk mapp :).

{{- if $thumbnail := .page.Params.thumbnail }}
    {{- $class := .class }}
    {{- $visibility := .page.Site.Params.thumbnail.visibility | default (slice "list" "post") }}

    {{- $valueType := printf "%T" $thumbnail -}}
    {{- $isMap := in $valueType "map" -}}
    {{- if $isMap }}
        {{ $visibility = default (slice "list" "post") (default .page.Site.Params.thumbnail.visibility $thumbnail.visibility) }}
        {{ $thumbnail = $thumbnail.src }}
    {{- end }}

    {{- if in $visibility $class }}
    {{- $thumbnailURL := "" }}

    {{- /* Försök hitta bilden som en sidsresurs först (för samlingssidor) */ -}}
    {{- $resource := .page.Resources.GetMatch $thumbnail }}
    {{- if $resource }}
        {{- $thumbnailURL = $resource.RelPermalink }}
    {{- else }}
        {{- /* Fallback till bild i statisk mapp med relURL */ -}}
        {{- $thumbnailURL = $thumbnail | relURL }}
    {{- end }}

    <figure class="{{ with $class }}{{ . }}__thumbnail {{ end }}thumbnail">
        {{ if eq $class "list" }}<a class="thumbnail__link" href="{{ .page.RelPermalink }}">{{ end }}
        <img class="thumbnail__image" src="{{ $thumbnailURL }}" alt="{{ .page.Title }}">
        {{ if eq $class "list" }}</a>{{ end }}
    </figure>
    {{- end }}
{{- end }}

Som du ser från kommentarerna försöker detta fina stycke mall att generera en bildreferens till den som lagras i sidsamlingen, och om bilden inte hittas - faller den tillbaka till standarden - statisk mapp. Så det är bakåtkompatibelt!

Njut!

Lycka till med Hugo!

Användbara länkar