Content
Changing the content area width
Configuring titles and breadcrumbs to your needs
Display page meta information with your content
Configuring heading anchors
What options are available for links and images
Learn about the hidden pages feature
Changing the content area width
Configuring titles and breadcrumbs to your needs
Display page meta information with your content
Configuring heading anchors
What options are available for links and images
Learn about the hidden pages feature
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.
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>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 = trueparams:
breadcrumbSeparator: /
disableRootBreadcrumb: true
disableTermBreadcrumbs: true{
"params": {
"breadcrumbSeparator": "/",
"disableRootBreadcrumb": true,
"disableTermBreadcrumbs": true
}
}Option You can override the default title separator by using titleSeparator='|'.
[params]
titleSeparator = '|'params:
titleSeparator: '|'{
"params": {
"titleSeparator": "|"
}
}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.
Option You can disable the output of an author’s name and its according email address by setting this parameter to true.
[params]
hideAuthorName = trueparams:
hideAuthorName: true{
"params": {
"hideAuthorName": true
}
}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.
[params]
hideAuthorEmail = trueparams:
hideAuthorEmail: true{
"params": {
"hideAuthorEmail": true
}
}Option # If the standard content-footer finds an authoring date, you can disable its output by setting this parameter to true.
[params]
hideAuthorDate = trueparams:
hideAuthorDate: true{
"params": {
"hideAuthorDate": true
}
}Option You can overwrite the default date format used when displaying a pages meta information. See the Hugo docs for possible values.
[params]
dateFormat = ':date_medium'params:
dateFormat: :date_medium{
"params": {
"dateFormat": ":date_medium"
}
}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.
[params]
disableAnchorCopy = trueparams:
disableAnchorCopy: true{
"params": {
"disableAnchorCopy": true
}
}Option Set disableAnchorScrolling=true to stop the page from scrolling to the heading when you click the anchor icon.
[params]
disableAnchorScrolling = trueparams:
disableAnchorScrolling: true{
"params": {
"disableAnchorScrolling": true
}
}Further settings are available to be used in your configuration or front matter.
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 = trueparams:
disableExplicitIndexURLs: true{
"params": {
"disableExplicitIndexURLs": true
}
}You can link to pages of different languages by appending the lang query parameter with the language code to the URL, e.g. /my-page?lang=pir.
In previous releases of the theme you had to prepend the language code to the URL, e.g. /pir/my-page to achieve this.
If you still need the old behavior, you can set enableLegacyLanguageLinks=true in your hugo.toml. Note that this legacy feature may be removed in the future.
relref ShortcodeOption 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 = trueparams:
disableDefaultRelref: true{
"params": {
"disableDefaultRelref": true
}
}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.
[params]
disableSearchHiddenPages = trueparams:
disableSearchHiddenPages: true{
"params": {
"disableSearchHiddenPages": true
}
}Option To hide pages from search engines by removing them from the sitemap, RSS feed and make them nofollow, use disableSeoHiddenPages=true.
[params]
disableSeoHiddenPages = trueparams:
disableSeoHiddenPages: true{
"params": {
"disableSeoHiddenPages": true
}
}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 = trueparams:
disableTagHiddenPages: true{
"params": {
"disableTagHiddenPages": true
}
}