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

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.

[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='|'.

[params]
  titleSeparator = '|'

params:
  titleSeparator: '|'

{
   "params": {
      "titleSeparator": "|"
   }
}

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.

Copy Anchor Links

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

[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.

[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.

[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.

[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.

Hide from Search

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

[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.

[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.

[params]
  disableTagHiddenPages = true

params:
  disableTagHiddenPages: true

{
   "params": {
      "disableTagHiddenPages": true
   }
}