Advanced SSG features

[npw]

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:

• Data templates, for pages with structured data or data that needs to be displayed in a fancy way.
• Filesystem traversal, for the assets page.
• Image processing, for responsive images with explicitly specified dimensions.
• Leaf bundles, for blog posts with images and for assembling long pages from several short pages.
• Markdown render hooks, for heading anchors.
• Page ancestor traversal, for breadcrumbs and page titles.
• Partials and inline partials, for unholy hacks.
• Recursive partials, for the sitemap.
• Regular expressions, for automatic page descriptions.
• Shortcodes, for things vanilla Markdown can’t pull off.
• Template blocks, for pages that only make a specific override to the base template.

What advanced features have you used personally?

[arevakhach]

@npw

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.

@npw

Image processing, for responsive images with explicitly specified dimensions.

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) 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" }}
          <hr>
          <img src="{{ .RelPermalink }}">
        {{ end }}
      {{ end }}

[eladnarra]

@arevakhach

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.

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.

[arevakhach]

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

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

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

[npw]

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.