Per-post thumbnail through filename convention?

support
4

There is a way to do this automatically @ptrvrhvn

First of all you need to place your photos in folders that have the same name as your post title.

Then in the following folder /static/images/index/ place these folders.

For example for a post with the .Title Blue create /static/images/index/blue/

The same for a post called Yellow, its image will go under /static/images/index/yellow/

Then create a partial over here /layouts/partials/index-posts.html

Inside the partial you need to include the following:

{{ range where .Data.Pages "Section" "post" }}
{{ $url := (printf "/images/index/%s" .Title) }}
{{ $folder := (printf "/static/images/index/%s" .Title) }}
{{ $files := readDir $folder }}
<div class="index-post">
    <a href="{{ .Permalink }}">
  {{ range $files }}
  <figure>
      <img src="{{ $url }}/{{ .Name | urlize }}">
  </figure>
  {{ end }}
      </a>
</div>
{{ end }}

Here is an explanation of what is inside this partial

{{ range first 5 (where .Data.Pages "Section" "post") }}

We are going to render the first 5 content pages from the posts section. These content files are located under /content/posts/

{{ $url := (printf "/images/index/%s" .Title) }}

Defined a URL variable with the printf function so that it looks for folders corresponding to the titles of the above posts under /static/images/index/

{{ $folder := (printf "/static/images/index/%s" .Title) }}

Defined a Folder path variable as above

{{ $files := readDir $folder }}

Then with the readDir function I am getting the files that are contained in the folders.

  {{ range $files }}

We are using another range function to render the images

Then in index.html simply this partial like so {{ partial "index-posts.html" . }}

You may change the section name and the HTML structure to whatever suits you.

Enjoy!

This is based on the work of @fedelibre with some modifications by me.

Notes
.Name turns a string Uppercase so you need to name your folders accordingly.
This works also with titles that are more than one word e.g Blue Post