docs: improve code examples #788

This commit is contained in:
Sören Weber 2024-03-02 11:04:52 +01:00
parent 8226ce02b6
commit 0d30b6713f
No known key found for this signature in database
GPG key ID: BEC6D55545451B6D
20 changed files with 543 additions and 480 deletions

View file

@ -18,26 +18,25 @@ Once configured in your `hugo.toml`, you can select them with the variant select
Set the `themeVariant` value to the name of your theme file. That's it! Your site will be displayed in this variant only.
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
themeVariant = "relearn-light"
````
{{< /multiconfig >}}
{{% notice note %}}
Your theme variant file must reside in your site's `static/css` directory or in the theme's `static/css` directory and the file name must start with `theme-` and end wit `.css`. In the above example, the path of your theme file must be `static/css/theme-relearn-light.css`.
If you want to make changes to a shipped color variant, create a copy in your site's `static/css` directory. Don't edit the file in the theme's directory!
{{% /notice %}}
### Multiple Variants
You can also set multiple variants. In this case, the first variant is the default chosen on first view and a variant selector will be shown in the menu footer if the array contains more than one entry.
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
themeVariant = [ "relearn-light", "relearn-dark" ]
````
{{< /multiconfig >}}
{{% notice tip %}}
The theme provides an advanced configuration mode, combining the functionality for multiple variants with the below possibilities of adjusting to your OS settings and syntax highlightning and even more!
@ -51,10 +50,10 @@ You can also cause the site to adjust to your OS settings for light/dark mode. J
You can use the `auto` value with the single or multiple variants option. If you are using multiple variants, you can drop `auto` at any position in the option's array, but usually it makes sense to set it in the first position and make it the default.
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
themeVariant = [ "auto", "red" ]
````
{{< /multiconfig >}}
If you don't configure anything else, the theme will default to use `relearn-light` for light mode and `relearn-dark` for dark mode. These defaults are overwritten by the first two non-auto options of your `themeVariant` option if present.
@ -62,10 +61,10 @@ In the above example, you would end with `red` for light mode and the default of
If you don't like that behavior, you can explicitly set `themeVariantAuto`. The first entry in the array is the color variant for light mode, the second for dark mode.
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
themeVariantAuto = [ "learn", "neon" ]
````
{{< /multiconfig >}}
## Change the Favicon
@ -105,20 +104,20 @@ Like with the [multiple variants](#multiple-variants) option, you are defining y
Again, in this case, the first variant is the default chosen on first view and a variant selector will be shown in the menu footer if the array contains more than one entry.
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
themeVariant = [ "relearn-light", "relearn-dark" ]
````
{{< /multiconfig >}}
you now write it that way:
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
[[params.themeVariant]]
identifier = "relearn-light"
[[params.themeVariant]]
identifier = "relearn-dark"
````
{{< /multiconfig >}}
The `identifier` option is mandatory and equivalent to the string in the first example. Further options can be configured, see the table below.
@ -132,7 +131,7 @@ The `identifier` option is mandatory and equivalent to the string in the first e
### Example Configuration of This Site
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
[[params.themeVariant]]
identifier = "relearn-auto"
@ -152,7 +151,7 @@ The `identifier` option is mandatory and equivalent to the string in the first e
identifier = "zen-dark"
[[params.themeVariant]]
identifier = "neon"
````
{{< /multiconfig >}}
## Modify Shipped Variants
@ -180,9 +179,9 @@ In case you like a shipped variant but only want to tweak some aspects, you have
Afterwards put this in your `hugo.toml` to use your new variant:
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
themeVariant = "my-branding"
````
{{< /multiconfig >}}
In comparison to _copy and change_, this has the advantage that you profit from any adjustments to the `relearn-light` variant but keep your modifications.

View file

@ -4,10 +4,21 @@ title = "Configuration"
weight = 20
+++
On top of [Hugo's global configuration options](https://gohugo.io/overview/configuration/), the Relearn theme lets you define further options unique to the theme in your `hugo.toml`. The defaults are written in the comments of each option.
On top of [Hugo's global configuration options](https://gohugo.io/overview/configuration/), the Relearn theme lets you define further options unique to the theme in your `hugo.toml`.
Note that some of these options are explained in detail in other sections of this documentation.
## All config options
The values reflect the options active in this documentation. The defaults can be taken from the [annotated example](#annotated-config-options) below.
{{< multiconfig file=hugo >}}
[params]
{{% include "config/_default/params.toml" %}}
{{< /multiconfig >}}
## Annotated config options
````toml {title="hugo.toml"}
[params]
{{% include "config/_default/params.toml" %}}

View file

@ -9,32 +9,32 @@ The theme is usable in different scenarios, requiring the following mandatory se
### Public Webserver from Root
````toml
{{< multiconfig file=hugo >}}
baseURL = "https://example.com/"
````
{{< /multiconfig >}}
### Public Webserver from Subdirectory
````toml
{{< multiconfig file=hugo >}}
baseURL = "https://example.com/mysite/"
relativeURLs = false
````
{{< /multiconfig >}}
### Private Webserver (LAN)
The same settings as with any of the public webserver usage scenarios or
````toml
{{< multiconfig file=hugo >}}
baseURL = "/"
relativeURLs = true
````
{{< /multiconfig >}}
### File System
````toml
{{< multiconfig file=hugo >}}
baseURL = "/"
relativeURLs = true
````
{{< /multiconfig >}}
{{% notice warning %}}
Using a `baseURL` with a subdirectory and `relativeURLs=true` are mutally exclusive due to the fact, that [Hugo does not apply the `baseURL` correctly](https://github.com/gohugoio/hugo/issues/12130).
@ -49,20 +49,20 @@ Sublemental pages (like `sitemap.xml`, `rss.xml`) and generated social media lin
{{% notice info %}}
If you are using `uglyURLs=false` (Hugo's default), the theme will append an additional `index.html` to all page links to make your site be servable from the file system. If you don't care about the file system and only serve your page via a webserver you can generate the links without this:
````toml
{{< multiconfig file=hugo >}}
[params]
disableExplicitIndexURLs = true
````
{{< /multiconfig >}}
{{% /notice %}}
## Activate search
If not already present, add the following lines in your `hugo.toml` file.
```toml
{{< multiconfig file=hugo >}}
[outputs]
home = ["html", "rss", "search"]
```
{{< /multiconfig >}}
This will generate a search index file at the root of your public folder ready to be consumed by the Lunr search library. Note that the `search` outputformat was named `json` in previous releases but was implemented differently. Although `json` still works, it is now deprecated.
@ -74,10 +74,10 @@ If you want to use the search feature from the file system, migrating from an ol
You can add a dedicated search page for your page by adding the `searchpage` outputformat to your home page by adding the following lines in your `hugo.toml` file. This will cause Hugo to generate a new file `http://example.com/mysite/search.html`.
```toml
{{< multiconfig file=hugo >}}
[outputs]
home = ["html", "rss", "search", "searchpage"]
```
{{< /multiconfig >}}
You can access this page by either clicking on the magnifier glass or by typing some search term and pressing `ENTER` inside of the menu's search box .
@ -93,12 +93,12 @@ To make sure, there is no duplicate content for any given URL of your project, r
You can activate print support to add the capability to print whole chapters or even the complete site. Just add the `print` output format to your home, section and page in your `hugo.toml` as seen below:
```toml
{{< multiconfig file=hugo >}}
[outputs]
home = ["html", "rss", "print", "search"]
section = ["html", "rss", "print"]
page = ["html", "rss", "print"]
```
{{< /multiconfig >}}
This will add a little printer icon in the top bar. It will switch the page to print preview when clicked. You can then send this page to the printer by using your browser's usual print functionality.
@ -114,25 +114,21 @@ If the `disableLandingPageButton` option is set to `false`, a Home button will a
on the left menu. It is an alternative for clicking on the logo. To edit the
appearance, you will have to configure the `landingPageName` for the defined languages:
```toml
{{< multiconfig file=hugo >}}
[languages]
[languages.en]
...
[languages.en.params]
landingPageName = "<i class='fas fa-home'></i> Home"
...
[languages.pir]
...
[languages.pir.params]
landingPageName = "<i class='fas fa-home'></i> Arrr! Homme"
...
```
{{< /multiconfig >}}
If this option is not configured for a specific language, they will get their default values:
```toml
{{< multiconfig >}}
landingPageName = "<i class='fas fa-home'></i> Home"
```
{{< /multiconfig >}}
The home button is going to look like this:

View file

@ -34,28 +34,25 @@ Besides the usual version tags (eg `1.2.3`) there are also tags for the main ver
## Basic configuration
When building the website, you can set a theme by using `--theme` option. However, we suggest you modify the configuration file (`hugo.toml`) and set the theme as the default. You can also add the `[outputs]` section to enable the search functionality.
When building the website, you can set a theme by using `--theme` option. However, we suggest you modify the configuration file `hugo.toml` and set the theme as the default. You can also add the `[outputs]` section to enable the [search functionality](basics/customization#activate-search).
```toml
# Change the default theme to be use when building the site with Hugo
{{< multiconfig file=hugo >}}
theme = "hugo-theme-relearn"
# For search functionality
[outputs]
home = [ "html", "rss", "search"]
```
home = [ "html", "rss", "search", "searchpage"]
{{< /multiconfig >}}
## Create your first chapter page
Chapters are pages that contain other child pages. It has a special layout style and usually just contains a _chapter name_, the _title_ and a _brief abstract_ of the section.
```markdown
````md
### Chapter 1
# Basics
Discover what this Hugo theme is all about and the core concepts behind it.
```
````
renders as
@ -63,9 +60,9 @@ renders as
The Relearn theme provides archetypes to create skeletons for your website. Begin by creating your first chapter page with the following command
```shell
````shell
hugo new --kind chapter basics/_index.md
```
````
By opening the given file, you should see the property `chapter=true` on top, meaning this page is a _chapter_.
@ -75,10 +72,10 @@ By default all chapters and pages are created as a draft. If you want to render
Then, create content pages inside the previously created chapter. Here are two ways to create content in the chapter:
```shell
````shell
hugo new basics/first-content.md
hugo new basics/second-content/_index.md
```
````
Feel free to edit those files by adding some sample content and replacing the `title` value in the beginning of the files.
@ -86,9 +83,9 @@ Feel free to edit those files by adding some sample content and replacing the `t
Launch by using the following command:
```shell
````shell
hugo serve
```
````
Go to `http://localhost:1313`
@ -102,9 +99,9 @@ You should notice three things:
When your site is ready to deploy, run the following command:
```shell
````shell
hugo
```
````
A `public` folder will be generated, containing all static content and assets for your website. It can now be deployed on any web server.

View file

@ -683,7 +683,7 @@ This document shows you what's new in the latest release and flags it with one o
You may see errors on the console after the update in the form:
````sh
````shell
ERROR 2021/11/19 22:29:10 [en] REF_NOT_FOUND: Ref "basics/configuration/_index.md": "hugo-theme-relearn\exampleSite\content\_index.en.md:19:22": page not found
````

View file

@ -17,20 +17,20 @@ A **Home** page is the starting page of your project. It's best to have only one
To create a home page, run the following command
```shell
````shell
hugo new --kind home _index.md
```
````
This leads to a file with the following content
```markdown
````toml {title="_index.md"}
+++
archetype = "home"
title = "{{ replace .Name "-" " " | title }}"
+++
Lorem Ipsum.
```
````
### Chapter {#archetypes-chapter}
@ -40,13 +40,13 @@ A **Chapter** displays a page meant to be used as introduction for a set of chil
To create a chapter page, run the following command
```shell
````shell
hugo new --kind chapter <name>/_index.md
```
````
This leads to a file with the following content
```markdown
````toml {title="_index.md"}
+++
archetype = "chapter"
title = "{{ replace .Name "-" " " | title }}"
@ -54,7 +54,7 @@ weight = X
+++
Lorem Ipsum.
```
````
Replace the `X` with a number. Because this number will be used to generate the subtitle of the chapter page, set the number to a consecutive value starting at 1 for each new chapter level.
@ -66,26 +66,26 @@ A **Default** page is any other content page. If you set an unknown archetype in
To create a default page, run either one of the following commands
```shell
````shell
hugo new <chapter>/<name>/_index.md
```
````
or
```shell
````shell
hugo new <chapter>/<name>.md
```
````
This leads to a file with the following content
```markdown
````toml {title="*.md"}
+++
title = "{{ replace .Name "-" " " | title }}"
weight = X
+++
Lorem Ipsum.
```
````
Replace the `X` with a number or delete the whole `weight` parameter entirely.
@ -97,7 +97,7 @@ If you are in need of further archetypes you can define your own or even redefin
Define a template file in your project at `archetypes/<kind>.md` and make sure it has at least the frontmatter parameter for that archetype like
````markdown
````toml {title="&lt;kind&gt;.md"}
+++
archetype = "<kind>"
+++
@ -105,9 +105,9 @@ archetype = "<kind>"
Afterwards you can generate new content files of that kind with the following command
```shell
````shell
hugo new --kind <kind> <name>/_index.md
```
````
### Partials

View file

@ -3,271 +3,21 @@ title = "Frontmatter"
weight = 2
+++
Each Hugo page has to define a [frontmatter](https://gohugo.io/content/front-matter/) in _toml_, _yaml_ or _json_. This site will use _toml_ for documentation in all cases.
Each Hugo page **has to define** a [frontmatter](https://gohugo.io/content/front-matter/).
````toml
+++
# If an option value is said to be not set, you can achieve the same behavior
# by given it an empty string value.
###############################################################################
# Hugo
# These options usually apply to other themes aswell.
# The social media image of your page.
# Default: not set
# This is used for generating social media meta information for the opengraph
# protocol and twitter cards.
# If not set, the set value of your site's hugo.toml is used.
images = [ "images/hero.png" ]
# The title of your page.
# Default: not set
# A page without a title is treated as a hidden page.
title = "Example Page"
# The description of your page.
# Default: not set
# This is used for generating HTML meta tags, social media meta information
# for the opengraph protocol and twitter cards.
# If not set, the set value of your site's hugo.toml is used for the html
# meta tag, social media meta information for the opengraph protocol and
# twitter cards.
description = ""
###############################################################################
# Relearn Theme
# These options are specific to the Relearn theme.
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Topbar
# These options modify the topbar appearance.
# Hide the table of contents button.
# Default: false
# If the TOC button is hidden, also the keyboard shortcut is disabled.
# If not set, the set value of your site's hugo.toml is used.
disableToc = false
# Hide the breadcrumbs.
# Default: false
# If the breadcrumbs are hidden, the title of the displayed page will still be
# shown in the topbar.
disableBreadcrumb = false
# Hide Next and Previous navigation buttons.
# Default: false
# If the navigation buttons are hidden, also the keyboard shortcuts are
# disabled.
disableNextPrev = false
# The URL prefix to edit a page.
# Default: not set
# If set, an edit button will be shown in the topbar. If the button is hidden,
# also the keyboard shortcuts are disabled. The value can contain the macro
# `${FilePath}` which will be replaced by the file path of your displayed page.
# If not set, the set value of your site's hugo.toml is used. If the global
# parameter is given but you want to hide the button for the displayed page,
# you can set the value to an empty string. If instead of hiding you want to have
# an disabled button, you can set the value to a string containing just spaces.
# This is useful if you want to give the opportunity for people to create merge
# request for your content.
editURL = ""
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Menu
# These options modify the menu apperance.
# Prefix for the title in main menu.
# Default: not set
# The title of the page in the menu will be prefixed by this HTML content.
menuPre = ""
# Suffix for the title in main menu.
# Default: not set
# The title of the page in the menu will be suffixed by this HTML content.
menuPost = ""
# The order of main menu submenus.
# Default: "weight"
# Submenus can be ordered by "weight", "title", "linktitle", "modifieddate",
# "expirydate", "publishdate", "date", "length" or "default" (adhering to
# Hugo's default sort order).
# If not set, the value of the parent menu entry is used.
ordersectionsby = "weight"
# The initial expand state of submenus.
# Default: not set
# This controls whether submenus will be expanded (true), or collapsed (false)
# in the menu. If not set, the first menu level is set to false, all others
# levels are set to true. If not set, the value of the parent menu entry is used.
# If the displayed page has submenus, they will always been displayed expanded
# regardless of this option.
alwaysopen = ""
# Shows expander for submenus.
# Default: false
# If set to true, a submenu in the sidebar will be displayed in a collapsible
# tree view and a clickable expander is set in front of the entry.
# If not set, the set value of your site's hugo.toml is used.
collapsibleMenu = true
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Hidden pages
# These options configure how hidden pages are treated.
# A page flagged as hidden, is only removed from the main menu if you are
# currently not on this page or the hidden page is not part of current page's
# ancestors. For all other functionality in Hugo a hidden page behaves like any
# other page if not otherwise configured.
# Hide a page's menu entry.
# Default: false
# If this value is true, the page is hidden from the menu.
hidden = false
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Content
# These options modify how your content is displayed.
# Prefix for the title in the content area.
# Default: not set
# The title of the page heading will be prefixed by this HTML content.
headingPre = ""
# Suffix for the title in the content area.
# Default: not set
# The title of the page heading will be suffixed by this HTML content.
headingPost = ""
# Display name of the page's last editor.
# Default: not set
# If set, it will be displayed in the default footer.
LastModifierDisplayName = ""
# Email address of the page's last editor.
# Default: not set
# If set together with LastModifierDisplayName, it will be displayed in the
# default footer.
LastModifierEmail = ""
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Highlight
# These options configure how code is displayed.
# Wrap for code blocks.
# Default: true
# By default lines of code blocks wrap around if the line is too long to be
# displayed on screen. If you dislike this behavior, you can reconfigure it
# here.
# Note that lines always wrap in print mode regardless of this option.
# If not set, the set value of your site's hugo.toml is used or given as a
# parameter to individual code blocks.
highlightWrap = true
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Images
# These options configure how images are displayed.
# Image effects.
# See the documentation for how you can even add your own arbitrary effects to
# the list.
# All effect values default to the values of your site's hugo.toml and can be
# overridden thru URL parameter given to the image. See the documentation for
# details.
# Default: false
imageEffects.border = true
# Default: true
imageEffects.lightbox = true
# Default: false
imageEffects.shadow = false
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# MathJax
# These options configure how math formulae are displayed.
# Initialization options for MathJax.
# Default: not set
# A JSON value. See the MathJaxdocumentation for possible parameter.
# If not set, the set value of your site's hugo.toml is used.
mathJaxInitialize = "{}"
# Only load MathJax if needed.
# Default: true
# If a Math shortcode is found, the option will be ignored and
# MathJax will be loaded regardlessly. The option is still useful in case you
# are using scripting to set up your graph. In this case no shortcode or
# codefence is involved and the library is not loaded by default. In this case
# you can set `disableMathJax=false` in your frontmatter to force the library to
# be loaded.
# If not set, the set value of your site's hugo.toml is used.
disableMathJax = true
# URL for external MathJax library.
# Default: not set
# Specifies the remote location of the MathJax library. By default the shipped
# version will be used.
# If not set, the set value of your site's hugo.toml is used.
customMathJaxURL = "" # "https://unpkg.com/mathjax/es5/tex-mml-chtml.js"
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Mermaid
# These options configure how Mermaid graphs are displayed.
# Make graphs panable and zoomable
# Default: false
# For huge graphs it can be helpful to make them zoomable. Zoomable graphs come
# with a reset button for the zoom.
# If not set, the set value of your site's hugo.toml is used or given as a
# parameter to individual graphs.
mermaidZoom = true
# Initialization options for Mermaid.
# Default: not set
# A JSON value. See the Mermaid documentation for possible parameter.
# If not set, the set value of your site's hugo.toml is used.
mermaidInitialize = "{ \"securityLevel\": \"loose\" }"
# Only load Mermaid if needed.
# Default: true
# If a Mermaid shortcode or codefence is found, the option will be ignored and
# Mermaid will be loaded regardlessly. The option is still useful in case you
# are using scripting to set up your graph. In this case no shortcode or
# codefence is involved and the library is not loaded by default. In this case
# you can set `disableMermaid=false` in your frontmatter to force the library to
# be loaded.
# If not set, the set value of your site's hugo.toml is used.
disableMermaid = true
# URL for external Mermaid library.
# Default: not set
# Specifies the remote location of the Mermaid library. By default the shipped
# version will be used.
# If not set, the set value of your site's hugo.toml is used.
customMermaidURL = "" # "https://unpkg.com/mermaid/dist/mermaid.min.js"
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# OpenApi
# These options configure how OpenAPI specifications are displayed.
# Only load OpenAPI if needed.
# Default: true
# If a OpenAPI shortcode is found, the option will be ignored and
# OpenAPI will be loaded regardlessly. The option is still useful in case you
# are using scripting to set up your graph. In this case no shortcode or
# codefence is involved and the library is not loaded by default. In this case
# you can set `disableOpenapi=false` in your frontmatter to force the library to
# be loaded.
# If not set, the set value of your site's hugo.toml is used.
disableOpenapi = true
# URL for external OpenAPI library.
# Default: not set
# Specifies the remote location of the OpenAPI library. By default the shipped
# version will be used.
# If not set, the set value of your site's hugo.toml is used.
customOpenapiURL = "" # "https://unpkg.com/swagger-ui-dist/swagger-ui-bundle.js"
## All Frontmatter Options
The values reflect example options. The defaults can be taken from the [annotated example](#annotated-frontmatter-options) below.
{{< multiconfig fm=true >}}
{{% include "cont/frontmatter/frontmatter.toml" %}}
{{< /multiconfig >}}
## Annotated Frontmatter Options
````toml {title="toml"}
+++
{{% include "cont/frontmatter/frontmatter.toml" %}}+++
````
## Some Detailed Examples
@ -276,12 +26,10 @@ customOpenapiURL = "" # "https://unpkg.com/swagger-ui-dist/swagger-ui-bundle.js"
In the page frontmatter, add a `menuPre` param to insert any HTML code before the menu label. The example below uses the GitHub icon.
````toml
+++
{{< multiconfig fm=true >}}
title = "GitHub repo"
menuPre = "<i class='fab fa-github'></i> "
+++
````
{{< /multiconfig >}}
![Title with icon](frontmatter-icon.png?width=18.75rem)
@ -291,12 +39,10 @@ Hugo provides a [flexible way](https://gohugo.io/content/ordering/) to handle or
The simplest way is to set `weight` parameter to a number.
````toml
+++
{{< multiconfig fm=true >}}
title = "My page"
weight = 5
+++
````
{{< /multiconfig >}}
### Using a Custom Title for Menu Entries
@ -306,12 +52,10 @@ But a page's title has to be descriptive on its own while the menu is a hierarch
For example (for a page named `content/install/linux.md`):
````toml
+++
{{< multiconfig fm=true >}}
title = "Install on Linux"
linkTitle = "Linux"
+++
````
{{< /multiconfig >}}
### Override Expand State Rules for Menu Entries
@ -336,10 +80,8 @@ To stay with the initial example: Suppose you want `level-one` appear in the sid
For this, open `content/level-one/_index.md` and add the following frontmatter
````toml
+++
collapsibleMenu = true # this adds the expander to the menu entry if not already set in your hugo.toml
{{< multiconfig fm=true >}}
collapsibleMenu = true
[_build]
render = "never" # no page will be generated so the page does not have a url
+++
````
render = "never"
{{< /multiconfig >}}

View file

@ -0,0 +1,260 @@
# If an option value is said to be not set, you can achieve the same behavior
# by given it an empty string value.
###############################################################################
# Hugo
# These options usually apply to other themes aswell.
# The social media image of your page.
# Default: not set
# This is used for generating social media meta information for the opengraph
# protocol and twitter cards.
# If not set, the set value of your site's hugo.toml is used.
images = [ "images/hero.png" ]
# The title of your page.
# Default: not set
# A page without a title is treated as a hidden page.
title = "Example Page"
# The description of your page.
# Default: not set
# This is used for generating HTML meta tags, social media meta information
# for the opengraph protocol and twitter cards.
# If not set, the set value of your site's hugo.toml is used for the html
# meta tag, social media meta information for the opengraph protocol and
# twitter cards.
description = ""
###############################################################################
# Relearn Theme
# These options are specific to the Relearn theme.
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Topbar
# These options modify the topbar appearance.
# Hide the table of contents button.
# Default: false
# If the TOC button is hidden, also the keyboard shortcut is disabled.
# If not set, the set value of your site's hugo.toml is used.
disableToc = false
# Hide the breadcrumbs.
# Default: false
# If the breadcrumbs are hidden, the title of the displayed page will still be
# shown in the topbar.
disableBreadcrumb = false
# Hide Next and Previous navigation buttons.
# Default: false
# If the navigation buttons are hidden, also the keyboard shortcuts are
# disabled.
disableNextPrev = false
# The URL prefix to edit a page.
# Default: not set
# If set, an edit button will be shown in the topbar. If the button is hidden,
# also the keyboard shortcuts are disabled. The value can contain the macro
# `${FilePath}` which will be replaced by the file path of your displayed page.
# If not set, the set value of your site's hugo.toml is used. If the global
# parameter is given but you want to hide the button for the displayed page,
# you can set the value to an empty string. If instead of hiding you want to have
# an disabled button, you can set the value to a string containing just spaces.
# This is useful if you want to give the opportunity for people to create merge
# request for your content.
editURL = ""
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Menu
# These options modify the menu apperance.
# Prefix for the title in main menu.
# Default: not set
# The title of the page in the menu will be prefixed by this HTML content.
menuPre = ""
# Suffix for the title in main menu.
# Default: not set
# The title of the page in the menu will be suffixed by this HTML content.
menuPost = ""
# The order of main menu submenus.
# Default: "weight"
# Submenus can be ordered by "weight", "title", "linktitle", "modifieddate",
# "expirydate", "publishdate", "date", "length" or "default" (adhering to
# Hugo's default sort order).
# If not set, the value of the parent menu entry is used.
ordersectionsby = "weight"
# The initial expand state of submenus.
# Default: not set
# This controls whether submenus will be expanded (true), or collapsed (false)
# in the menu. If not set, the first menu level is set to false, all others
# levels are set to true. If not set, the value of the parent menu entry is used.
# If the displayed page has submenus, they will always been displayed expanded
# regardless of this option.
alwaysopen = ""
# Shows expander for submenus.
# Default: false
# If set to true, a submenu in the sidebar will be displayed in a collapsible
# tree view and a clickable expander is set in front of the entry.
# If not set, the set value of your site's hugo.toml is used.
collapsibleMenu = true
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Hidden pages
# These options configure how hidden pages are treated.
# A page flagged as hidden, is only removed from the main menu if you are
# currently not on this page or the hidden page is not part of current page's
# ancestors. For all other functionality in Hugo a hidden page behaves like any
# other page if not otherwise configured.
# Hide a page's menu entry.
# Default: false
# If this value is true, the page is hidden from the menu.
hidden = false
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Content
# These options modify how your content is displayed.
# Prefix for the title in the content area.
# Default: not set
# The title of the page heading will be prefixed by this HTML content.
headingPre = ""
# Suffix for the title in the content area.
# Default: not set
# The title of the page heading will be suffixed by this HTML content.
headingPost = ""
# Display name of the page's last editor.
# Default: not set
# If set, it will be displayed in the default footer.
LastModifierDisplayName = ""
# Email address of the page's last editor.
# Default: not set
# If set together with LastModifierDisplayName, it will be displayed in the
# default footer.
LastModifierEmail = ""
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Highlight
# These options configure how code is displayed.
# Wrap for code blocks.
# Default: true
# By default lines of code blocks wrap around if the line is too long to be
# displayed on screen. If you dislike this behavior, you can reconfigure it
# here.
# Note that lines always wrap in print mode regardless of this option.
# If not set, the set value of your site's hugo.toml is used or given as a
# parameter to individual code blocks.
highlightWrap = true
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Images
# These options configure how images are displayed.
# Image effects.
# See the documentation for how you can even add your own arbitrary effects to
# the list.
# All effect values default to the values of your site's hugo.toml and can be
# overridden thru URL parameter given to the image. See the documentation for
# details.
# Default: false
imageEffects.border = true
# Default: true
imageEffects.lightbox = true
# Default: false
imageEffects.shadow = false
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# MathJax
# These options configure how math formulae are displayed.
# Initialization options for MathJax.
# Default: not set
# A JSON value. See the MathJaxdocumentation for possible parameter.
# If not set, the set value of your site's hugo.toml is used.
mathJaxInitialize = "{}"
# Only load MathJax if needed.
# Default: true
# If a Math shortcode is found, the option will be ignored and
# MathJax will be loaded regardlessly. The option is still useful in case you
# are using scripting to set up your graph. In this case no shortcode or
# codefence is involved and the library is not loaded by default. In this case
# you can set `disableMathJax=false` in your frontmatter to force the library to
# be loaded.
# If not set, the set value of your site's hugo.toml is used.
disableMathJax = true
# URL for external MathJax library.
# Default: not set
# Specifies the remote location of the MathJax library. By default the shipped
# version will be used.
# If not set, the set value of your site's hugo.toml is used.
customMathJaxURL = "" # "https://unpkg.com/mathjax/es5/tex-mml-chtml.js"
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# Mermaid
# These options configure how Mermaid graphs are displayed.
# Make graphs panable and zoomable
# Default: false
# For huge graphs it can be helpful to make them zoomable. Zoomable graphs come
# with a reset button for the zoom.
# If not set, the set value of your site's hugo.toml is used or given as a
# parameter to individual graphs.
mermaidZoom = true
# Initialization options for Mermaid.
# Default: not set
# A JSON value. See the Mermaid documentation for possible parameter.
# If not set, the set value of your site's hugo.toml is used.
mermaidInitialize = "{ \"securityLevel\": \"loose\" }"
# Only load Mermaid if needed.
# Default: true
# If a Mermaid shortcode or codefence is found, the option will be ignored and
# Mermaid will be loaded regardlessly. The option is still useful in case you
# are using scripting to set up your graph. In this case no shortcode or
# codefence is involved and the library is not loaded by default. In this case
# you can set `disableMermaid=false` in your frontmatter to force the library to
# be loaded.
# If not set, the set value of your site's hugo.toml is used.
disableMermaid = true
# URL for external Mermaid library.
# Default: not set
# Specifies the remote location of the Mermaid library. By default the shipped
# version will be used.
# If not set, the set value of your site's hugo.toml is used.
customMermaidURL = "" # "https://unpkg.com/mermaid/dist/mermaid.min.js"
#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
# OpenApi
# These options configure how OpenAPI specifications are displayed.
# Only load OpenAPI if needed.
# Default: true
# If a OpenAPI shortcode is found, the option will be ignored and
# OpenAPI will be loaded regardlessly. The option is still useful in case you
# are using scripting to set up your graph. In this case no shortcode or
# codefence is involved and the library is not loaded by default. In this case
# you can set `disableOpenapi=false` in your frontmatter to force the library to
# be loaded.
# If not set, the set value of your site's hugo.toml is used.
disableOpenapi = true
# URL for external OpenAPI library.
# Default: not set
# Specifies the remote location of the OpenAPI library. By default the shipped
# version will be used.
# If not set, the set value of your site's hugo.toml is used.
customOpenapiURL = "" # "https://unpkg.com/swagger-ui-dist/swagger-ui-bundle.js"

View file

@ -22,9 +22,7 @@ For example with current English and Piratized English website.
Make sure your default language is defined as the first one in the `[languages]` array, as the theme needs to make assumptions on it
{{% /notice %}}
```toml
# English is the default language
{{< multiconfig file=hugo >}}
defaultContentLanguage = "en"
[languages]
@ -37,7 +35,7 @@ languageName = "English"
title = "Cap'n Hugo Relearrrn Theme"
weight = 2
languageName = "Arrr! Pirrrates"
```
{{< /multiconfig >}}
Then, for each new page, append the _id_ of the language to the file.
@ -74,10 +72,10 @@ You'll see error reports in your browsers console log for each unsupported langu
In case your page's content contains text in multiple languages (e.g. you are writing a Russian documentation for your english API), you can add those languages to your `hugo.toml` to broaden search.
```toml
{{< multiconfig file=hugo >}}
[params]
additionalContentLanguage = [ "en" ]
````
{{< /multiconfig >}}
As this is an array, you can add multiple additional languages.
@ -97,8 +95,8 @@ Switching the language in the browser is a great feature, but for some reasons y
Just set `disableLanguageSwitchingButton=true` in your `hugo.toml`
```toml
{{< multiconfig file=hugo >}}
[params]
# When using multilingual website, disable the switch language button.
disableLanguageSwitchingButton = true
```
{{< /multiconfig >}}

View file

@ -13,37 +13,35 @@ Explicitly set URL query parameter will override the defaults in effect for a pa
Without any settings in your `hugo.toml` this defaults to
````toml {title="hugo.toml"}
{{< multiconfig file=hugo >}}
[params]
[params.imageEffects]
border = false
lightbox = true
shadow = false
````
{{< /multiconfig >}}
This can be overridden in a pages frontmatter by eg.
````toml {title="frontmatter"}
+++
{{< multiconfig fm=true >}}
[imageEffects]
border = true
+++
````
{{< /multiconfig >}}
Or by explicitly override settings by URL query parameter
````markdown {title="URL"}
````md {title="URL"}
![Minion](https://octodex.github.com/images/minion.png?lightbox=false&bg-white=true)
````
The settings applied to the above image would be
````toml {title="Result"}
{{< multiconfig >}}
border = true
lightbox = false
shadow = false
bg-white = true
````
{{< /multiconfig >}}
This ends up in the following HTML where the parameter are converted to CSS classes.

View file

@ -34,7 +34,7 @@ In Markdown your content usually spans the whole available document width. This
Any text not starting with a special sign is written as normal, plain text paragraph block and must be separated to its adjacent blocks by empty lines.
````markdown
````md
Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.
Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.
@ -52,7 +52,7 @@ A good idea is to structure your content using headings and subheadings. HTML-he
In Hugo you usually don't use `h1` as this is generated by your theme and you should only have one such element in a document.
````markdown
````md
# h1 Heading
## h2 Heading
@ -85,7 +85,7 @@ In Hugo you usually don't use `h1` as this is generated by your theme and you sh
To further structure your content you can add horizontal rules. They create a "thematic break" between paragraph blocks. In Markdown, you can create it with three consecutive dashes `---`.
````markdown
````md
Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.
---
@ -107,7 +107,7 @@ Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis in
You can show importance of a snippet of text with a heavier font-weight by enclosing it with two asterisks `**`.
````markdown
````md
I am rendered with **bold text**
````
@ -119,7 +119,7 @@ I am rendered with **bold text**
You can emphasize a snippet of text with italics by enclosing it with underscores `_`.
````markdown
````md
I am rendered with _italicized text_
````
@ -131,7 +131,7 @@ I am rendered with _italicized text_
In GFM (GitHub Flavored Markdown) you can do strikethroughs by enclosing text with two tildes `~~`.
````markdown
````md
~~Strike through this text~~
````
@ -143,7 +143,7 @@ In GFM (GitHub Flavored Markdown) you can do strikethroughs by enclosing text wi
This Markdown dialect supports an extension to combine multiple punctuation characters to single typographic entities. This will only be applied to text outside of code blocks or inline code.
````markdown
````md
Double quotes `"` and single quotes `'` of enclosed text are replaced by **"double curly quotes"** and **'single curly quotes'**.
Double dashes `--` and triple dashes `---` are replaced by en-dash **--** and em-dash **---** entities.
@ -173,7 +173,7 @@ It is possible to nest lists by indenting an item for the next sublevel.
You may use any of `-`, `*` or `+` to denote bullets for each list item but should not switch between those symbols inside one whole list.
````markdown
````md
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Vestibulum laoreet porttitor sem
@ -203,7 +203,7 @@ It is possible to nest lists by indenting an item for the next sublevel.
Markdown will automatically number each of your items consecutively. This means, the order number you are providing is irrelevant.
````markdown
````md
1. Lorem ipsum dolor sit amet
3. Consectetur adipiscing elit
1. Integer molestie lorem at massa
@ -229,7 +229,7 @@ Markdown will automatically number each of your items consecutively. This means,
In GFM (GitHub Flavored Markdown) you can add task lists resulting in checked or unchecked non-clickable items
````markdown
````md
- [x] Basic Test
- [ ] More Tests
- [x] View
@ -253,7 +253,7 @@ A definition list in Markdown Extra is made of a single-line term followed by a
If you add empty lines around the definition terms, additional vertical space will be generated. Also multiple paragraphs are possible
````markdown
````md
Apple
: Pomaceous fruit of plants of the genus Malus in the family Rosaceae.
: An American computer company.
@ -287,7 +287,7 @@ Orange
Inline snippets of code can be wrapped with backticks `` ` ``.
````markdown
````md
In this example, `<div></div>` is marked as code.
````
@ -299,7 +299,7 @@ In this example, `<div></div>` is marked as code.
A simple code block can be generated by indenting several lines of code by at least two spaces.
````markdown
````md
Be impressed by my advanced code:
// Some comments
@ -375,7 +375,7 @@ grunt.initConfig({
In GFM (GitHub Flavored Markdown) you can create tables by adding pipes as dividers between each cell, and by adding a line of dashes (also separated by bars) beneath the header. Note that the pipes do not need to be vertically aligned.
````markdown
````md
| Option | Description |
|--------|-------------|
| data | path to data files to supply the data that will be passed into templates. |
@ -395,7 +395,7 @@ In GFM (GitHub Flavored Markdown) you can create tables by adding pipes as divid
Adding a colon on the left and/or right side of the dashes below any heading will align the text for that column accordingly.
````markdown
````md
| Option | Number | Description |
|-------:|:------:|:------------|
| data | 1 | path to data files to supply the data that will be passed into templates. |
@ -417,7 +417,7 @@ For quoting blocks of content from another source within your document add `>` b
Blockquotes can also be nested.
````markdown
````md
> Donec massa lacus, ultricies a ullamcorper in, fermentum sed augue. Nunc augue augue, aliquam non hendrerit ac, commodo vel nisi.
>
> > Sed adipiscing elit vitae augue consectetur a gravida nunc vehicula. Donec auctor odio non est accumsan facilisis. Aliquam id turpis in dolor tincidunt mollis ac eu diam.
@ -439,7 +439,7 @@ Blockquotes can also be nested.
In GFM (GitHub Flavored Markdown) absolute URLs will automatically be converted into a link.
````markdown
````md
This is a link to https://example.com.
````
@ -452,7 +452,7 @@ This is a link to https://example.com.
You can explicitly define links in case you want to use non-absolute URLs or want to give different text.
````markdown
````md
[Assemble](http://assemble.io)
````
@ -464,7 +464,7 @@ You can explicitly define links in case you want to use non-absolute URLs or wan
For even further information, you can add an additional text, displayed in a tooltip on hovering over the link.
````markdown
````md
[Upstage](https://github.com/upstage/ "Visit Upstage!")
````
@ -476,7 +476,7 @@ For even further information, you can add an additional text, displayed in a too
Links can be simplyfied for recurring reuse by using a reference ID to later define the URL location. This simplyfies writing if you want to use a link more than once in a document.
````markdown
````md
[Example][somelinkID]
[somelinkID]: https://example.com "Go to example domain"
@ -496,7 +496,7 @@ Usually the list of footnotes will be shown at the end of your document. If we u
Footnotes can contain block elements, which means that you can put multiple paragraphs, lists, blockquotes and so on in a footnote. It works the same as for list items, just indent the following paragraphs by four spaces in the footnote definition.
````markdown
````md
That's some text with a footnote[^1]
[^1]: And that's the footnote.
@ -528,7 +528,7 @@ That's some more text with a footnote.[^someid]
Images have a similar syntax to links but include a preceding exclamation mark.
````markdown
````md
![Spock](https://octodex.github.com/images/spocktocat.png)
````
@ -540,7 +540,7 @@ Images have a similar syntax to links but include a preceding exclamation mark.
Like links, images can also be given a tooltip.
````markdown
````md
![Picard](https://octodex.github.com/images/jean-luc-picat.jpg "Jean Luc Picard")
````
@ -552,7 +552,7 @@ Like links, images can also be given a tooltip.
Images can also be linked by reference ID to later define the URL location. This simplyfies writing if you want to use an image more than once in a document.
````markdown
````md
![La Forge][laforge]
[laforge]: https://octodex.github.com/images/trekkie.jpg "Geordi La Forge"
@ -572,7 +572,7 @@ This theme allows additional non-standard formatting by setting query parameter
Add query parameter `width` and/or `height` to the link image to resize the image. Values are CSS values (default is `auto`).
````markdown
````md
![Minion](https://octodex.github.com/images/minion.png?width=20vw)
````
@ -580,7 +580,7 @@ Add query parameter `width` and/or `height` to the link image to resize the imag
![Minion](https://octodex.github.com/images/minion.png?width=20vw)
{{% /notice %}}
````markdown
````md
![Minion](https://octodex.github.com/images/minion.png?height=50px)
````
@ -588,7 +588,7 @@ Add query parameter `width` and/or `height` to the link image to resize the imag
![Minion](https://octodex.github.com/images/minion.png?height=50px)
{{% /notice %}}
````markdown
````md
![Minion](https://octodex.github.com/images/minion.png?height=50px&width=40vw)
````
@ -602,7 +602,7 @@ Add a query parameter `classes` to the link image to add CSS classes. Add some o
##### Shadow
````markdown
````md
![Spidertocat](https://octodex.github.com/images/spidertocat.png?classes=shadow)
````
@ -612,7 +612,7 @@ Add a query parameter `classes` to the link image to add CSS classes. Add some o
##### Border
````markdown
````md
![DrOctocat](https://octodex.github.com/images/droctocat.png?classes=border)
````
@ -622,7 +622,7 @@ Add a query parameter `classes` to the link image to add CSS classes. Add some o
##### Left
````markdown
````md
![Supertocat](https://octodex.github.com/images/okal-eltocat.jpg?classes=left)
````
@ -632,7 +632,7 @@ Add a query parameter `classes` to the link image to add CSS classes. Add some o
##### Right
````markdown
````md
![Riddlocat](https://octodex.github.com/images/riddlocat.jpg?classes=right)
````
@ -642,7 +642,7 @@ Add a query parameter `classes` to the link image to add CSS classes. Add some o
##### Inline
````markdown
````md
![Spidertocat](https://octodex.github.com/images/spidertocat.png?classes=inline)
![DrOctocat](https://octodex.github.com/images/droctocat.png?classes=inline)
![Supertocat](https://octodex.github.com/images/okal-eltocat.jpg?classes=inline)
@ -658,7 +658,7 @@ Add a query parameter `classes` to the link image to add CSS classes. Add some o
##### Combination
````markdown
````md
![X-tocat](https://octodex.github.com/images/xtocat.jpg?classes=shadow,border,left)
````
@ -670,7 +670,7 @@ Add a query parameter `classes` to the link image to add CSS classes. Add some o
Add the query parameter `lightbox=false` to the image link to disable the lightbox.
````markdown
````md
![Homercat](https://octodex.github.com/images/homercat.png?lightbox=false)
````
@ -681,7 +681,7 @@ Add the query parameter `lightbox=false` to the image link to disable the lightb
{{% notice note %}}
If you want to wrap an image in a link and `lightbox=true` is your default setting, you have to explicitly disable the lightbox to avoid it to hijacking your link like:
````markdown
````md
[![Homercat](https://octodex.github.com/images/homercat.png?lightbox=false)](https://octodex.github.com/#homercat)
````

View file

@ -11,7 +11,7 @@ Edit the website configuration `hugo.toml` and add a `[[menu.shortcuts]]` entry
Example from the current website:
````toml
{{< multiconfig file=hugo >}}
[[menu.shortcuts]]
name = "<i class='fab fa-fw fa-github'></i> GitHub repo"
identifier = "ds"
@ -38,14 +38,14 @@ weight = 30
name = "<i class='fas fa-fw fa-tags'></i> Tags"
url = "tags/"
weight = 40
````
{{< /multiconfig >}}
By default, shortcuts are preceded by a title. This title can be disabled by setting `disableShortcutsTitle=true`.
However, if you want to keep the title but change its value, it can be overridden by changing your local i18n translation string configuration.
For example, in your local `i18n/en.toml` file, add the following content
````toml
````toml {title="en.toml"}
[Shortcuts-Title]
other = "<Your value>"
````
@ -58,7 +58,7 @@ When using a multilingual website, you can set different menus for each language
Example from the current website:
````toml
{{< multiconfig file=hugo >}}
[languages]
[languages.en]
title = "Hugo Relearn Theme"
@ -127,7 +127,7 @@ Example from the current website:
name = "<i class='fas fa-fw fa-tags'></i> Arrr! Tags"
pageRef = "tags/"
weight = 40
````
{{< /multiconfig >}}
Read more about [hugo menu](https://gohugo.io/extras/menus/) and [hugo multilingual menus](https://gohugo.io/content-management/multilingual/#menus)
@ -137,26 +137,25 @@ If you have shortcuts to pages inside of your project and you don't want them to
1. Make the page file for the shortcut a [headless branch bundle](https://gohugo.io/content-management/page-bundles/#headless-bundle) (contained in its own subdirectory and called `_index.md`) and add the following frontmatter configuration to the file (see exampleSite's `content/showcase/_index.en.md`). This causes its content to **not** be ontained in the sitemap.
````toml
{{< multiconfig fm=true >}}
title = "Showcase"
[_build]
render = "always"
list = "never"
publishResources = true
````
{{< /multiconfig >}}
2. Store the page file for the shortcut below a parent headless branch bundle and add the following frontmatter to he **parent** (see exampleSite's `content/more/_index.en.md`).
2. Store the page file for the shortcut below a parent headless branch bundle and add the following frontmatter to he **parent** (see exampleSite's `content/more/_index.en.md`). _Don't give this page a `title` as this will cause it to be in the breadcrumbs - a thing you most likely don't want.
````toml
# title = "More" ### ATTENTION: Don't give this page a title as this will cause it to be in the breadcrumbs - a thing you most likely don't want
{{< multiconfig fm=true >}}
[_build]
render = "never"
list = "never"
publishResources = false
````
{{< /multiconfig >}}
In this case, the file itself can be a branch bundle, leaf bundle or simple page (see exampleSite's `content/more/credits.en.md`). This causes its content to be contained in the sitemap.
````toml
{{< multiconfig fm=true >}}
title = "Credits"
````
{{< /multiconfig >}}

View file

@ -45,8 +45,8 @@ The following steps are here to help you initialize your new website. If you don
Hugo provides a `new` command to create a new website.
```shell
````shell
hugo new site <new_project>
```
````
The Relearn theme provides [archetypes](cont/archetypes) to help you create this kind of pages.

View file

@ -11,13 +11,11 @@ The Relearn theme supports Hugo's default taxonomies _tag_ and _category_ out of
Just add tags and/or categories to any page. They can be given as a single string or an array of strings.
```toml
+++
{{< multiconfig fm=true >}}
categories = ["taxonomy", "content"]
tags = "tutorial"
title = "Taxonomy"
+++
```
{{< /multiconfig >}}
## Behavior
@ -31,7 +29,7 @@ Each item is a link to a taxonomy page displaying all the articles with the give
In the `hugo.toml` file you can add a shortcut to display all the tags and categories
```toml
{{< multiconfig file=hugo >}}
[[menu.shortcuts]]
name = "<i class='fas fa-tags'></i> Tags"
url = "/tags"
@ -39,13 +37,13 @@ url = "/tags"
[[menu.shortcuts]]
name = "<i class='fas fa-layer-group'></i> Categories"
url = "/categories"
```
{{< /multiconfig >}}
## Customization
If you define [custom taxonomies](https://gohugo.io/content-management/taxonomies/#configure-taxonomies) and want to display a list of them somewhere on your page (often in the `layouts/partials/content-footer.html`) you can call a partial that does the job for you:
````markdown
````md
{{- partial "term-list.html" (dict
"page" .
"taxonomy" "categories"

View file

@ -98,40 +98,25 @@ You can configure the color style used for code blocks in your [color variants s
#### Recommended Settings
````toml
{{< multiconfig file=hugo >}}
[markup]
[markup.highlight]
# line numbers in a table layout will shift if code is wrapping, so better
# use inline; besides that visually both layouts have the same look and behavior
lineNumbersInTable = false
# the shipped variants come with their own modified chroma syntax highlightning
# stylesheets which are linked in your generated HTML pages; you can use Hugo to generate
# own stylesheets to your liking and use them in your variant;
# if you want to use Hugo's internal styles instead of the shipped stylesheets:
# - remove `noClasses` or set `noClasses = true`
# - set `style` to a predefined style name
# note: with using the internal styles, the `--CODE-theme` setting in your variant
# stylesheet will be ignored and the internal style is used for all variants and
# even print
noClasses = false
# style = "tango"
````
{{< /multiconfig >}}
#### Optional Settings
````toml
{{< multiconfig file=hugo >}}
[params]
highlightWrap = true
````
{{< /multiconfig >}}
### Page's Frontmatter
````toml
+++
{{< multiconfig fm=true >}}
highlightWrap = true
+++
````
{{< /multiconfig >}}
## Examples
@ -160,7 +145,7 @@ print("!")
### Codefence with Title
````markdown
````md
```py { title="python" }
# a bit shorter
print("Hello World!")

View file

@ -69,18 +69,16 @@ See [MathJax documentation](https://docs.mathjax.org/en/latest/options/index.htm
### Global Configuration File
````toml
{{< multiconfig file=hugo >}}
[params]
mathJaxInitialize = "{ \"chtml\": { \"displayAlign\": \"left\" } }"
````
{{< /multiconfig >}}
### Page's Frontmatter
````toml
+++
{{< multiconfig fm=true >}}
mathJaxInitialize = "{ \"chtml\": { \"displayAlign\": \"left\" } }"
+++
````
{{< /multiconfig >}}
## Examples

View file

@ -81,20 +81,18 @@ The `theme` setting can also be set by your used color variant. This will be the
### Global Configuration File
````toml
{{< multiconfig file=hugo >}}
[params]
mermaidInitialize = "{ \"theme\": \"dark\" }"
mermaidZoom = true
````
{{< /multiconfig >}}
### Page's Frontmatter
````toml
+++
{{< multiconfig fm=true >}}
mermaidInitialize = "{ \"theme\": \"dark\" }"
mermaidZoom = true
+++
````
{{< /multiconfig >}}
## Examples

View file

@ -56,18 +56,18 @@ While the examples are using shortcodes with named parameter you are free to use
To use formatted parameter, add this in your `hugo.toml`:
````toml
{{< multiconfig file=hugo >}}
[markup.goldmark.renderer]
unsafe = true
````
{{< /multiconfig >}}
{{% tab title="hugo.toml" %}}
````toml
Now values containing Markdown will be formatted correctly.
{{< multiconfig file=hugo >}}
[params]
[params.siteparam.test]
text = "A **nested** parameter <b>with</b> formatting"
````
{{% /tab %}}
{{< /multiconfig >}}
```go
Formatted parameter: {{%/* siteparam name="siteparam.test.text" */%}}

View file

@ -0,0 +1,74 @@
{{- /*
Heavily modified from https://github.com/gohugoio/hugoDocs/blob/master/_vendor/github.com/gohugoio/gohugoioTheme/layouts/shortcodes/code-toggle.html
Renders syntax-highlighted configuration data in TOML, YAML and JSON formats.
@param {Page} [page] The page to render on.
@param {string} [content] Plain content to render.
@param {string} [config] The section of site.Data.docs.config to render.
@param {string} [dataKey] Only render specific section
@param {string} [file] The file name to display above the rendered code.
@param {bool} [fm=false] If true, render the code as front matter.
@param {bool} [skipHeader=false] If false, omit top level key(s) when rendering a section of site.Data.docs.config.
@returns {template.HTML}
*/}}
{{- /* Get parameters. */}}
{{- $page := .page }}
{{- $content := .content }}
{{- $config := .config }}
{{- $dataKey := .dataKey }}
{{- $file := .file }}
{{- $fm := false }}
{{- if in (slice "false" false 0) .fm }}
{{- $fm = false }}
{{- else if in (slice "true" true 1) .fm }}
{{- $fm = true }}
{{- end }}
{{- $skipHeader := false }}
{{- if in (slice "false" false 0) .skipHeader }}
{{- $skipHeader = false }}
{{- else if in (slice "true" true 1) .skipHeader }}
{{- $skipHeader = true }}
{{- end }}
{{- /* Define constants. */}}
{{- $delimiters := dict "toml" "+++" "yaml" "---" }}
{{- $langs := slice "toml" "yaml" "json" }}
{{- /* Render. */}}
{{- $code := "" }}
{{- if $config }}
{{- $file = $file | default "hugo" }}
{{- $sections := (split $config ".") }}
{{- $configSection := index $page.Site.Data.docs.config $sections }}
{{- $code = dict $sections $configSection }}
{{- if $skipHeader }}
{{- $code = $configSection }}
{{- end }}
{{- else if $dataKey }}
{{- $file = $file | default $dataKey }}
{{- $sections := (split $dataKey ".") }}
{{- $code = index $page.Site.Data.docs $sections }}
{{- else }}
{{- $code = $content }}
{{- end }}
{{- $params := dict "page" $page "groupid" "config-code" }}
{{- with $file }}
{{- $params = $params | merge (dict "title" (printf "%s%s" . (cond $fm "" "."))) }}
{{- end }}
{{- $contentparam := slice }}
{{- range $langs }}
{{- /* Remove toml comments. */}}
{{- $hCode := $code | replaceRE `#.*(\r\n|\r|\n)?` "" }}
{{- $hCode = $hCode | transform.Remarshal . }}
{{- if and $fm (in (slice "toml" "yaml") .) }}
{{- $placeHolder := (index $delimiters .) }}
{{- $hCode = printf "%s\n%s%s\n" $placeHolder $hCode $placeHolder }}
{{- end }}
{{- $contentparam = $contentparam | append (dict "title" . "content" (printf "````%s\n%s````" . $hCode | $page.RenderString)) }}
{{- end }}
{{- $params = $params | merge (dict "content" $contentparam) }}
{{- partial "shortcodes/tabs.html" $params }}

View file

@ -0,0 +1,10 @@
{{- $_hugo_config := `{ "version": 1 }` }}
{{- partial "shortcodes/multiconfig.html" (dict
"page" .Page
"content" .Inner
"config" (.Get "config")
"dataKey" (.Get "dataKey")
"file" (.Get "file")
"fm" (.Get "fm")
"skipHeader" (.Get "skipHeader")
) }}