hugo-geekblog/layouts/_default/single.html

{{ define "main" }}
    <article class="gblog-post">
        <header class="gblog-post__header">
            {{ $source := ($.Resources.ByType "image").GetMatch "{*feature*,*cover*,*thumbnail*}" }}
            {{ with $source }}
                <picture class="gblog-post__figure">
                    {{ with $.Resources.GetMatch (replace (.Title) (path.Ext (.Title)) ".webp") }}
                    <source srcset="{{ .Permalink }}" type="image/webp">
                    {{ end }}
                    {{ $featured := .Fill (printf "950x285 %s" (default "Smart" .Params.anchor)) }}
                    <source srcset="{{ $featured.Permalink }}">
                    <img src="{{ $featured.Permalink }}" alt="{{ default $.Title .Params.description }}" >
                </picture>
            {{ end }}

            <h1>{{ partial "title" . }}</h1>
        </header>

        <section class="gblog-markdown">
            {{ partial "content" . }}
            {{ with $source }}
            {{ if .Params.credits }}
            <ul class="gblog-post__credits">
                <li>{{ . | humanize }} image: {{ .Params.credits | safeHTML }}</li>
            </ul>
            {{ end }}
            {{ end }}
        </section>
    </article>
{{ end }}