Post featured image

support
1

Hello, I am new so am not sure if this is possible:

I would like to have a section on one page which displays post featured images (maybe specified in the front matter or the first image used in the post) together with a summary of that post. If this could be done to automatically pick up the most recent post in any given category, that would be marvellous. Can it be done?

2

For anyone else who finds this and wants to know how I did it:

in the .md file, you need to include this in the front matter:

+++
featured_image = “images/pic01.jpg”
+++

Then at the point you want to include it in the page, you add into the template

<a href="#" class="image featured">{{if isset .Params "featured_image" }}<img src="{{ index .Params "featured_image" }}"></a>{{ end }}

so far it seems to work for me…

Be interested to hear if there is a better way :slight_smile:

3

oops I had the {{if statement wrong there, but it goes to show that it won’t work without it!

4

In this case it’s a matter of taste (and space…), but I tend to use this construction for these conditionals:

{{ with .Params.featured_image }}<img src="{{ . }}">{{ end }}

Your code works fine, but “with” has less surprises in some cases, and it’s more compact.

3 Likes
5

Thanks, bjornerik, that is an even better solution

6

A featured image is very useful indeed since it can be separated from the {{ .Content }} variable of a post.
However it really needs an alt attribute. Spent sometime trying to get this to work. Here it is:

<img{{ with .Params.featured_image }} src="{{ . }}"{{ end }} alt="{{ .Title }}">
3 Likes
8

Thanks very much. I use it in my blog.

9

I’m new to Hugo, I can’t get featured image to work. I followed the instruction above, it’s not working.
Can someone please help, I need step by step instructions.
Please help. Thank you.

10

Hi - could you please go ahead and make a new post in here, and give us the info cited in Requesting Help. (If you’re not even sure what that means, then I would say, start by reading the docs and trying the tutorials. )

11

Thanks for replying, I will check the tuts and docs.
are there any newbie tutorials for creating featured images on a blog post?
If not can someone please create one.
Thank you all.

12

I like this addition; however, is there a way to have the size of the featured image responsive to the size of the screen? The images are too big. Thoughts?

13

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.