Targeting the first image in content with image render hook

I want to use the native loading="lazy" in browsers, but to avoid Cumulative layout Shift issues, I want to remove the class in every first image within the content. I am using this image render hook. Is that possible?

1 Like

If you use Hugo >= 0.108.0 you can use the new, drum roll, .Ordinal attribute in the hook template:

{{ if .Ordinal }} loading="lazy"{{ end}}

Ordinal is zero based, so the above will happen for all but the first image.


Amazing! It worked.

1 Like

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