How to add a one-line description to a Hugo theme's header

I’m using the really nice minimal Minos theme. By default, it does not include a one-liner description.

Minos

After checking the docs, there wasn’t any setting available in config.toml. After some research, I found it’s possible to overide the theme’s header with a custom one.

Here’s the process I performed:

  • in the themes/hugo-theme-minos folder, find the header currently being used for the site

partials

  • in your site folder, find the layouts folder (which is likely empty). This is where you put your custom code
  • under your layouts folder, create a partials folder and copy the above header file into there

Now the fun bit. Make a suitable change to your copy of the header.html. Whatever you do here will override the theme’s default header. This is also great when you update the theme, and your custom changes will persist.

Here’s the simple line I added:

<p style="font-size: 15px; padding-bottom: 12px;"><i>{{ .Site.Params.Desc }}</i></p>

Here’s the full listing with the above line in place near the bottom:

<header id="header">
    <div id="header-outer" class="outer">
        <div id="header-inner" class="inner">
            <a id="main-nav-toggle" class="nav-icon" href="javascript:;"></a>
            <a id="logo" class="logo-text" href="{{ .Site.Home.Permalink }}">{{ .Site.Title }}</a>
            <nav id="main-nav">
                {{ range .Site.Menus.main }}
                <a class="main-nav-link" href="{{ .URL }}">{{ .Name }}</a>
                {{ end }}
            </nav>
            <nav id="sub-nav">
                <div id="search-form-wrap">
                </div>
            </nav>
        </div>
        <p style="font-size: 15px; padding-bottom: 12px;"><i>{{ .Site.Params.Desc }}</i></p>
    </div>
</header>

In your config.toml, add a new key-value pair:

[params]
	googleAnalytics = ""
	smartToc = false
	desc = "A personal study log: mostly about Japanese and programming languages"

The desc key corresponds to the {{ .Site.Params.Desc }} item in the HTML. I tried to make the key like {{ ..Site.Desc }} but I could not get it to work, so the above is an acceptable workaround.

Contents