Displaying Featured Images

bep · February 13, 2018, 7:29am

The documentation about this may be a little mix and match.

But what I would recommend is to use the new resources and image processing capabilities in the latest Hugo.

You may get some inspiration from the new showcase section in the docs:

gohugoio/hugoDocs/blob/master/themes/gohugoioTheme/layouts/showcase/single.html#L36


    Last Update: {{ .Lastmod.Format "January 2, 2006" }} <br>
    {{ partial "page-edit.html" . }}
  </div>
  <div class="b">The Showcase articles are copyright the content authors. Any open source license will be attached.</div>
</article>
{{ end }}






{{define "sc-main-column"}}
{{ $img := (.Resources.ByType "image").GetMatch "*featured*" }}
{{ with $img }}
   {{ $big := .Fill "1024x512 top" }}
   {{ $small := $big.Resize "512x" }}
    <img srcset="{{ $small.RelPermalink }} 1x, {{ $big.RelPermalink }} 2x" alt="{{ $img.Title }}" width="{{ $big.Width }}"  class="mw-100 b--light-gray ba">
{{ end }}
 <div class="mid-gray nested-copy-line-height nested-img nested-links">
{{with .Params.byline }}
   <div style="margin-top: 20px; font-style: italic;">By {{ . | markdownify -}}</div>
{{ end }}
{{with .Content}}

But you would also need to read up on resources vs metadata configuration.

Topic		Replies	Views
Post featured image support	11	12738	June 16, 2020
Hugo leaf bundle blog feature image support	6	568	September 17, 2018
[SOLVED] Display cover image on post list support	3	4731	July 24, 2018
Images not displaying in full article support	6	2918	May 7, 2017
Images in posts support	8	8751	January 5, 2018

Displaying Featured Images

Related Topics