Advanced SSG features

I’ve used Hugo for my website for the past 4 years, and over this time, I’ve managed to use quite a few of its non-trivial features. A couple days ago, I decided to make a list of them:

What advanced features have you used personally?


So one that I recently implemented was Build Options: List Without Publishing. It basically lets you control what pages are created on build. ‘List Without Publishing’ specifically lets me write “headless” pages (that aren’t created), but then pull and display their data onto a list page. My intent is for like a micro-blog.

Don’t mean to turn this into a support session, but I recently got image resizing working, but haven’t found success with image converting (in my case to WebP) :confused: Do you have any experience with that? Here’s what I’ve managed so far:

{{ range .Pages }}
      <!-- image resize (content) -->
      {{ $image := .Resources.Get .Params.image }}
      {{ if $image }}
        <!-- dial image size here: -->
        {{ with $image.Resize "300x" }}
          <img src="{{ .RelPermalink }}">
        {{ end }}
      {{ end }}

I’m doing something like this for my Changelog page and RSS feed with Eleventy - if you set pages’ permalink to false in front matter, you can use their data on other pages and as part of collections without outputting HTML files.

1 Like

Ofc, after I write it out, I figure it out:

{{ with $image.Resize "300x webp" }}

And 1 word too. :person_facepalming:
EDIT: That’s what I get for using a rando post as a reference rather than the actual docs.

Sorry, didn’t notice your question. All of the images on my website so far are pretty much pixel art (low resolution and paletted), and PNG deals with them just fine, so I don’t bother resizing or transcoding them.

1 Like