Getting Resized Image's Path of Related Content

[whotheheck]

Hi all.

I’m currently trying to add a related content feature to my blog with thumbnails for each of the related posts.

What works like a charm:

1. Generating/getting related content
2. Generating thumbnails with the built-in image processing

Unfortunately I’m stuck though. how do I get the path to those thumbnails? I know the code which generates the unique filenames but afaik there’s no way to implement that in hugo templates, right?

Is there another way to add thumbnails to the related content without hard coding the paths in the front matter? Without thumbnails the related content is kinda useless in my case

Or to be more concrete: is there a way in hugo to get image hash, the second part following _hu?

Cheers,
Felix

[maiki]

How are the thumbnails related to the posts?

[whotheheck]

I use page bundles for each post.
The first image resource per post will be used to generate a thumbnail.

So the thumbnail has a path like resources/_gen/images/blog/foobar/foo_hu5101bc7448d74c77047dbf0b923b0924_478402_500x500_fill_q60_box_smart1.jpeg

I’m able to re-construct the path with the help of the related post’s first resource’s .RelPermalink and os.Stat. The only dynamic part of the path which is missing is 5101bc7448d74c77047dbf0b923b0924 in the example above. Seems to be a (md5?) hash of the file content but (index .Resources 0).Content | md5 yields another hash.

[bep]

It’s a little hard to see what you’re trying to do, but you will never be able to construct those filenames “by hand”.

But you should not need to. The .Resources and the image operations is there to hide the complexities, so you should not need to use os.Stat etc.

[whotheheck]

Hi @bep,
let me clarify it a bit more.

I have post A and post B.
Below post A, I wanna show a thumbnail of post B with a link saying “See also:”.

But that’s just possible by accessing somehow the permalink of the automatically generated image. This permalink is no accessible outside the image operation’s scope though.

That’s the reason why I need to construct those filenames manually since there’s no other way to get the thumbnails’ permalinks. So my question is:

1. is there an official way to get the path of post B’s thumbnail in the scope of post A?
2. if not: what do I need to do to get the hash of the thumbnail’s filename?

[bep]

<h1>Below post A</h1>
{{ range (.Site.RegularPages.Related . )}}
{{ .Title }} {{ ((.Resources.GetMatch "myimage.png").Resize "200x").RelPermalink }}
{{ end }}

So I’m pretty sure I got the above wrong some way, but it should get the message across?

[whotheheck]

sorry for wasting your time and thanks a lot for nudging me in the right direction.

I processed the image somewhere else instead of directly in the “related content” partial Long day, sorry

[bep]

Sure; also note that Hugo will effectively cache the processed image if you use the same resize operations on it in different templates (which is why I said that you would never be able to construct those URLs by hand – as those ops are encoded into the URL hash).

[whotheheck]