Subsections of Content

Width

The theme adjusts the content width when you resize your browser.

If you want to change the chosen default width, you can add CSS variables to layouts/partials/custom-header.html.

Changing the Main Area’s Maximum Width

The main area has a default maximum width of 80.25rem for better readability. If you want to change this, you can set a CSS variable

For full width, use a large value like 1000rem.

​
<style>
:root {
    --MAIN-WIDTH-MAX: 1000rem;
}
</style>

Titles & Breadcrumbs

Learn how to turn off the breadcrumbs completely and further configure the topbar.

Option Set disableRootBreadcrumb=true to remove the root breadcrumb which often feels redundant. This will also apply to the breadcrumbs of the search results and taxonomy pages.

Option You can override the default breadcrumb separator by using breadcrumbSeparator='/'. This separator will also be used in the breadcrumbs of the search results and taxonomy pages.

Option By default the term pages of a taxonomy will display the breadcrumb for each page. Set disableTermBreadcrumbs=true to remove the breadcrumb if the term pages look to cluttered.

hugo.
[params]
  breadcrumbSeparator = '/'
  disableRootBreadcrumb = true
  disableTermBreadcrumbs = true
params:
  breadcrumbSeparator: /
  disableRootBreadcrumb: true
  disableTermBreadcrumbs: true
{
   "params": {
      "breadcrumbSeparator": "/",
      "disableRootBreadcrumb": true,
      "disableTermBreadcrumbs": true
   }
}

Titles

Option You can override the default title separator by using titleSeparator='|'.

hugo.
[params]
  titleSeparator = '|'
params:
  titleSeparator: '|'
{
   "params": {
      "titleSeparator": "|"
   }
}

Page Meta Information

The theme supports a default display of page meta information in layouts/partials/content-footer.html.

The content footer dynamically pulls information based on the availability of GitInfo metadata. If Git information is present, it uses the author’s name, email, and the date from the Git commit details. This ensures that the displayed information is always up-to-date with the latest modifications.

In cases where Git information is not available, the theme falls back to LastModifierDisplayName, LastModifierEmail, and Date defined in the page’s front matter.

Disable Display of Author’s Name

Option You can disable the output of an author’s name and its according email address by setting this parameter to true.

hugo.
[params]
  hideAuthorName = true
params:
  hideAuthorName: true
{
   "params": {
      "hideAuthorName": true
   }
}

Disable Display of Author’s Email

Option The author’s email, when displayed, is presented as a clickable mailto link, providing a convenient way for readers to reach out. You can disable the output of an author’s email address by setting this parameter to true.

hugo.
[params]
  hideAuthorEmail = true
params:
  hideAuthorEmail: true
{
   "params": {
      "hideAuthorEmail": true
   }
}

Disable Display of Authoring Date

Option # If the standard content-footer finds an authoring date, you can disable its output by setting this parameter to true.

hugo.
[params]
  hideAuthorEmail = true
params:
  hideAuthorEmail: true
{
   "params": {
      "hideAuthorEmail": true
   }
}

Adjust the Timestamp Format

Option You can overwrite the default date format used when displaying a pages meta information. See the Hugo docs for possible values.

hugo.
[params]
  dateFormat = ':date_medium'
params:
  dateFormat: :date_medium
{
   "params": {
      "dateFormat": ":date_medium"
   }
}

Headings

Headings can have anchor links that appear when you hover over them.

You can change what happens when you click the anchor icon in your hugo.toml file. By default, all options are turned on. If you turn off all options, no anchor icon will show up when you hover.

Option Set disableAnchorCopy=true to prevent copying the anchor link when you click the icon.

hugo.
[params]
  disableAnchorCopy = true
params:
  disableAnchorCopy: true
{
   "params": {
      "disableAnchorCopy": true
   }
}

Scroll to Heading

Option Set disableAnchorScrolling=true to stop the page from scrolling to the heading when you click the anchor icon.

hugo.
[params]
  disableAnchorScrolling = true
params:
  disableAnchorScrolling: true
{
   "params": {
      "disableAnchorScrolling": true
   }
}

Linking

Further settings are available to be used in your configuration or front matter.

URL Management

Option By default, the theme adds index.html to page links when uglyURLs=false (Hugo’s default).

If you’re only using a web server scenario and dislike this, you can reset to Hugo’s default behavior by settings disableExplicitIndexURLs=true.

For the file system scenario, you are not allowed to change this value.

hugo.
[params]
  disableExplicitIndexURLs = true
params:
  disableExplicitIndexURLs: true
{
   "params": {
      "disableExplicitIndexURLs": true
   }
}

Patching the relref Shortcode

Option While the usage of relref is obsolete and discouraged by Hugo for a while, existing installations may still use it.

In configurations using a baseURL with a subdirectory and having relativeURLs=false (the default), Hugo’s standard relref implementation is failing.

To work around this, you can activate a patched version of the shortcode by setting disableDefaultRelref=true.

hugo.
[params]
  disableDefaultRelref = true
params:
  disableDefaultRelref: true
{
   "params": {
      "disableDefaultRelref": true
   }
}

Hidden Pages

This theme allows you to create hidden pages.

Hidden pages are created but not shown in the navigation. This is useful for pages you only want to access via a direct link.

When you visit a hidden page’s URL, it will appear in the navigation menu.

Hidden pages can also have hidden subpages, creating multiple levels of hiding.

By default, hidden pages are only hidden from human visitors. Search engines can still find them by crawling your site and the pages are linked in your taxonomies and site search. You can prevent this with these options.

Option To remove hidden pages from search results, use disableSearchHiddenPages=true.

hugo.
[params]
  disableSearchHiddenPages = true
params:
  disableSearchHiddenPages: true
{
   "params": {
      "disableSearchHiddenPages": true
   }
}

Hide from Search Engines

Option To hide pages from search engines by removing them from the sitemap, RSS feed and make them nofollow, use disableSeoHiddenPages=true.

hugo.
[params]
  disableSeoHiddenPages = true
params:
  disableSeoHiddenPages: true
{
   "params": {
      "disableSeoHiddenPages": true
   }
}

Hide from Taxonomies

Option To prevent hidden pages from appearing on taxonomy and term pages, use disableTagHiddenPages=true. If this makes a term’s count zero, an empty term page will still be created but not linked.

hugo.
[params]
  disableTagHiddenPages = true
params:
  disableTagHiddenPages: true
{
   "params": {
      "disableTagHiddenPages": true
   }
}