Hugo Fragments

Hugo is the static site generator that is used to build the new parts of the Infinite Ink website, including this page.

Page contents

Commenting out code in Hugo layout files

In the Go Template language, which is also known as Go HTML, you can comment out code with the following single- or multi-line comment syntax.

{{/* Go HTML single-line comment */}}


{{/*
     Go HTML
     multi-line
     comment
*/}}

 

‼︎

In a child block layout file, do not put a comment — or anything other than blank lines — outside the define-end container:

only blank lines here

{{ define "main" }}

   Go Template code and comments here

{{ end }}

only blank lines here

Inline shortcodes

Shortcodes are a way to use Go Template code within a Hugo content file. Reusable and one-off shortcodes usually live in the layouts/shortcodes directory, but starting with Hugo 0.52, you have the option to put a shortcode directly into a content file by using an “inline shortcode.” This is especially useful for a one-off shortcodes such as the two discussed below.

To use inline shorcodes you need to set enableInlineShortcodes to true in your Hugo config file by, for example, putting the following in your config.yaml.

enableInlineShortcodes: true

 

“Writing in Progress” shortcode

On Infinite Ink’s To-Do and Done Lists in the section Writing in Progress, there is a list of articles that have not yet been published. For the public, this is a list of titles without links. For me, when I am developing the website with hugo server, this is a list of titles with links to these unreleased articles. I do this by putting my writing in progress in a directory named content/wip/.[1][2] And in my website-todo-done.asciidoc,[3] I have the following inline shortcode.

{{< wip.inline >}}
    
<ul class="posts">

  {{ range where .Site.RegularPages.ByTitle "Section" "wip" }}

    <li>
  
      {{ if eq hugo.Environment "development" }}
    
        <a href="{{ .Permalink }}"><i>{{ .Title }}</i></a>
        
      {{ else }}  <!-- not development -->
    
          <i>{{ .Title }}</i>
    
      {{ end }}  <!-- end if-else -->
  
    </li>

  {{ end }}  <!-- end range -->

</ul>

{{< /wip.inline >}}

 

Hugo version shortcode

The Tools section of the About Infinite Ink page includes this list item:

  • hugo v0.62.2/extended

Each time hugo builds the Infinite Ink site, the part after “hugo” is generated by the following.

v{{< hv.inline >}}
  {{- hugo.Version -}}
{{< /hv.inline >}}/extended

 

💡︎
The dashes (-) in {{- and -}} tell hugo to remove whitespace around the output of hugo.Version.

Notes

Discussion and reactions


1. WIP can mean “work in progress” or “writing in progress.”
2. Some of the WIP articles have draft: true and some have draft: false. Only the titles of the WIPs that are not drafts are listed when I publish the Infinite Ink site.

Discussion and reactions

All comments are welcome, including relevant links to your site and suggestions for improving this page. Thanks to GitHub and Utterances, the possible reactions are 👍️ 👎️ 😂️ 🎉️ 😕️ ❤️ 🚀️ and 👀️.