Some Hugo tips

Here are some tips I’ve discovered while using Hugo server. This post is like a cheatsheet that I’ll extend when more Hugo tips come out.

Paragraphs to include in teasers

By listing the posts on your blog, Hugo decides where to cut the teaser for every item in the post list. When rendering certain types of blocks too close to the top also produces a buggy HTML code…

Use the <!--more--> HTML comment after the paragraph of your post that you want to show as the last paragraph in the teaser:

This is a paragraph to show on the teasers list...

<!--more-->

This is the first paragraph to show only with the full view of the post.

Expand code blocks

By default, Hugo uses Chroma to render the Markdown code blocks. However, it collapses de block view when there are more than a certain number of lines.

If you want to always show the block as expanded, still collapsible by the user, put this setting in the Hugo configuration:

params.page.code.maxShownLines: -1

Social link to your Mastodon page

This tip applies (at least) to the FixIt theme and it allows you to include the social link to your Mastodon regardless of your instance.

Edit your Hugo config, write this sample and adapt to your user and Mastodon instance:

1
2
3
4
5

params:
  social:
    mastodon:
      prefix: "https://social.linux.pizza"
      id: "@caligari"