hugo-theme-relearn/pir/configuration/index.print.html

6607 lines
511 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="art-x-pir" dir="rtl" itemscope itemtype="http://schema.org/Article">
<head>
<meta charset="utf-8">
<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, minimum-scale=1.0">
<meta name="generator" content="Hugo 0.135.0">
<meta name="generator" content="Relearn 7.0.0+79aeddcea3a22e8d8b2ce9cd162adaf36653fc5f">
<meta name="description" content="Find out how t&#39; configure an&#39; cust&#39;mize yer ship.
Ship ManagementGet yourself familiar wit&#39; th&#39; general structure o&#39; yer website">
<meta name="author" content="Sören Weber">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
<meta name="twitter:title" content="Configurrrat&#39;n :: Cap&#39;n Hugo Relearrrn Theme">
<meta name="twitter:description" content="Find out how t&#39; configure an&#39; cust&#39;mize yer ship.
Ship ManagementGet yourself familiar wit&#39; th&#39; general structure o&#39; yer website">
<meta property="og:url" content="https://mcshelby.github.io/hugo-theme-relearn/pir/configuration/index.html">
<meta property="og:site_name" content="Cap&#39;n Hugo Relearrrn Theme">
<meta property="og:title" content="Configurrrat&#39;n :: Cap&#39;n Hugo Relearrrn Theme">
<meta property="og:description" content="Find out how t&#39; configure an&#39; cust&#39;mize yer ship.
Ship ManagementGet yourself familiar wit&#39; th&#39; general structure o&#39; yer website">
<meta property="og:locale" content="art_x_pir">
<meta property="og:type" content="website">
<meta property="og:image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
<meta itemprop="name" content="Configurrrat&#39;n :: Cap&#39;n Hugo Relearrrn Theme">
<meta itemprop="description" content="Find out how t&#39; configure an&#39; cust&#39;mize yer ship.
Ship ManagementGet yourself familiar wit&#39; th&#39; general structure o&#39; yer website">
<meta itemprop="wordCount" content="51">
<meta itemprop="image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
<meta itemprop="keywords" content="Reference">
<title>Configurrrat&#39;n :: Cap&#39;n Hugo Relearrrn Theme</title>
<link href="https://mcshelby.github.io/hugo-theme-relearn/configuration/index.html" rel="alternate" hreflang="x-default">
<link href="https://mcshelby.github.io/hugo-theme-relearn/configuration/index.html" rel="alternate" hreflang="en">
<link href="https://mcshelby.github.io/hugo-theme-relearn/pir/configuration/index.html" rel="alternate" hreflang="art-x-pir">
<link href="https://mcshelby.github.io/hugo-theme-relearn/pir/configuration/index.html" rel="canonical" type="text/html" title="Configurrrat&#39;n :: Cap&#39;n Hugo Relearrrn Theme">
<link href="/hugo-theme-relearn/pir/configuration/index.xml" rel="alternate" type="application/rss+xml" title="Configurrrat&#39;n :: Cap&#39;n Hugo Relearrrn Theme">
<link href="/hugo-theme-relearn/images/logo.svg?1728929952" rel="icon" type="image/svg+xml">
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1728929952" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1728929952" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/nucleus.css?1728929952" rel="stylesheet">
<link href="/hugo-theme-relearn/css/auto-complete.css?1728929952" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1728929952" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1728929952" rel="stylesheet">
<link href="/hugo-theme-relearn/css/fonts.css?1728929952" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fonts.css?1728929952" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/theme.css?1728929952" rel="stylesheet">
<link href="/hugo-theme-relearn/css/theme-relearn-auto.css?1728929952" rel="stylesheet" id="R-variant-style">
<link href="/hugo-theme-relearn/css/chroma-relearn-auto.css?1728929952" rel="stylesheet" id="R-variant-chroma-style">
<link href="/hugo-theme-relearn/css/print.css?1728929952" rel="stylesheet" media="print">
<link href="/hugo-theme-relearn/css/format-print.css?1728929952" rel="stylesheet">
<script src="/hugo-theme-relearn/js/variant.js?1728929952"></script>
<script>
window.relearn = window.relearn || {};
window.relearn.relBasePath='..\/..';
window.relearn.relBaseUri='..\/..\/..';
window.relearn.absBaseUri='https:\/\/mcshelby.github.io\/hugo-theme-relearn';
window.relearn.disableAnchorCopy=false;
window.relearn.disableAnchorScrolling=false;
// variant stuff
window.variants && variants.init( [ 'relearn-auto', 'relearn-light', 'relearn-dark', 'relearn-bright', 'zen-auto', 'zen-light', 'zen-dark', 'retro-auto', 'neon', 'learn', 'blue', 'green', 'red' ] );
// translations
window.T_Copy_to_clipboard = `Copy t' clipboard`;
window.T_Copied_to_clipboard = `Copied t' clipboard!`;
window.T_Copy_link_to_clipboard = `Copy link t' clipboard`;
window.T_Link_copied_to_clipboard = `Copied link t' clipboard!`;
window.T_Reset_view = `Rrreset view`;
window.T_View_reset = `View rrreset!`;
window.T_No_results_found = `No rrresults found fer "{0}"`;
window.T_N_results_found = `{1} rrresults found fer "{0}"`;
</script>
<style>
#R-body img.bg-white {
background-color: white;
}
</style>
</head>
<body class="mobile-support print disableInlineCopyToClipboard" data-url="/hugo-theme-relearn/pir/configuration/index.html">
<div id="R-body" class="default-animation">
<div id="R-body-overlay"></div>
<nav id="R-topbar">
<div class="topbar-wrapper">
<div class="topbar-sidebar-divider"></div>
<div class="topbar-area topbar-area-start" data-area="start">
<div class="topbar-button topbar-button-sidebar" data-content-empty="disable" data-width-s="show" data-width-m="hide" data-width-l="hide"><button class="topbar-control" onclick="toggleNav()" type="button" title="Menu (CTRL&#43;ALT&#43;n)"><i class="fa-fw fas fa-bars"></i></button>
</div>
<div class="topbar-button topbar-button-toc" data-content-empty="hide" data-width-s="show" data-width-m="show" data-width-l="show"><button class="topbar-control" onclick="toggleTopbarFlyout(this)" type="button" title="Table o&#39; Contents (CTRL&#43;ALT&#43;t)"><i class="fa-fw fas fa-list-alt"></i></button>
<div class="topbar-content">
<div class="topbar-content-wrapper">
</div>
</div>
</div>
</div>
<ol class="topbar-breadcrumbs breadcrumbs highlightable" itemscope itemtype="http://schema.org/BreadcrumbList"><li
itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement"><span itemprop="name">Configurrrat&#39;n</span><meta itemprop="position" content="1"></li>
</ol>
<div class="topbar-area topbar-area-end" data-area="end">
<div class="topbar-button topbar-button-edit" data-content-empty="disable" data-width-s="area-more" data-width-m="show" data-width-l="show"><a class="topbar-control" href="https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/configuration/_index.pir.md" target="_self" title="Edit (CTRL&#43;ALT&#43;w)"><i class="fa-fw fas fa-pen"></i></a>
</div>
<div class="topbar-button topbar-button-print" data-content-empty="disable" data-width-s="area-more" data-width-m="show" data-width-l="show"><a class="topbar-control" href="/hugo-theme-relearn/pir/configuration/index.print.html" title="Prrrint whole chapterrr (CTRL&#43;ALT&#43;p)"><i class="fa-fw fas fa-print"></i></a>
</div>
<div class="topbar-button topbar-button-prev" data-content-empty="disable" data-width-s="show" data-width-m="show" data-width-l="show"><a class="topbar-control" href="/hugo-theme-relearn/pir/introduction/changelog/1/index.html" title="Version 1 (🡒)"><i class="fa-fw fas fa-chevron-left"></i></a>
</div>
<div class="topbar-button topbar-button-next" data-content-empty="disable" data-width-s="show" data-width-m="show" data-width-l="show"><a class="topbar-control" href="/hugo-theme-relearn/pir/configuration/sitemanagement/index.html" title="Site Management (🡐)"><i class="fa-fw fas fa-chevron-right"></i></a>
</div>
<div class="topbar-button topbar-button-more" data-content-empty="hide" data-width-s="show" data-width-m="show" data-width-l="show"><button class="topbar-control" onclick="toggleTopbarFlyout(this)" type="button" title="Morrre"><i class="fa-fw fas fa-ellipsis-v"></i></button>
<div class="topbar-content">
<div class="topbar-content-wrapper">
<div class="topbar-area topbar-area-more" data-area="more">
</div>
</div>
</div>
</div>
</div>
</div>
</nav>
<div id="R-main-overlay"></div>
<main id="R-body-inner" class="highlightable chapter" tabindex="-1">
<div class="flex-block-wrapper">
<article class="chapter narrow">
<header class="headline">
</header>
<div class="article-subheading">T&#39; chapterrr 2</div>
<h1 id="configurrratn">Configurrrat&#39;n</h1>
<p>Find out how t' configure an' cust'mize yer ship.</p>
<div class="children children-h2 children-sort-">
<h2><a href="/hugo-theme-relearn/pir/configuration/sitemanagement/index.html">Ship Management</a></h2><p>Get yourself familiar wit' th' general structure o' yer website</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/branding/index.html">Brand'n</a></h2><p>Change colors an' logos o' yer ship</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sidebar/index.html">Sidebar</a></h2><p>Configure all th'ns sidebar</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/content/index.html">Rrrambl'n</a></h2><p>Configure th' rrrambl'n area o' yer ship</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/customization/index.html">Customizat'n</a></h2><p>Cust'mize files fer advanced usage</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/reference/index.html">Opt'ns Reference</a></h2><p>All configurat'n opt'ns fer th' Relearrrn theme</p>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
<section>
<h1 class="a11y-only">Subsct&#39;ns o&#39; Configurrrat&#39;n</h1>
<article class="default">
<header class="headline">
</header>
<h1 id="site-management">Site Management</h1>
<div class="children children-h2 children-sort-">
<h2><a href="/hugo-theme-relearn/pir/configuration/sitemanagement/structure/index.html">Directory Structure</a></h2><p>Yer site&#39;s directory structure</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sitemanagement/multilingual/index.html">Multilingual</a></h2><p>How t' set up a multilingual ship</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sitemanagement/meta/index.html">Meta Informat'n</a></h2><p>What site-wide meta informat'n can be set</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sitemanagement/deployment/index.html">Deployment Scenarios</a></h2><p>Opt'ns fer specific deployment needs</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sitemanagement/outputformats/index.html">Avail'ble Output Formats</a></h2><p>What other formats can a plank be displayed 'n</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sitemanagement/stableoutput/index.html">St'ble Output</a></h2><p>How t' make yer generated HTML output st'ble</p>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
<section>
<h1 class="a11y-only">Subsct&#39;ns o&#39; Site Management</h1>
<article class="default">
<header class="headline">
</header>
<h1 id="directory-structure">Directory Structure</h1>
<p>If you&rsquo;ve followed th' <a href="/hugo-theme-relearn/pir/introduction/quickstart/index.html">Gett'n Started</a> guide, yer directory layout will look similar t' this:</p>
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-plaintext" data-lang="plaintext"><span class="line"><span class="cl">├── rrrambl'n
</span></span><span class="line"><span class="cl">│ ├── first-chapter
</span></span><span class="line"><span class="cl">│ │ ├── first-page
</span></span><span class="line"><span class="cl">| | | └── _index.md
</span></span><span class="line"><span class="cl">│ │ ├── second-page
</span></span><span class="line"><span class="cl">| | | └── index.md
</span></span><span class="line"><span class="cl">│ │ └── third-page.md
</span></span><span class="line"><span class="cl">│ └── _index.md
</span></span><span class="line"><span class="cl">├── themes
</span></span><span class="line"><span class="cl">│ └── hugo-theme-relearn
</span></span><span class="line"><span class="cl">│ └── ...
</span></span><span class="line"><span class="cl">└── hugo.toml</span></span></code></pre></div>
<p>Cap'n Hugo uses a <a href="https://gohugo.io/getting-started/directory-structure/#union-file-system" rel="external" target="_self">union file system</a>, which lets ye combine multiple directories.</p>
<p>By default, it puts yer root directory on top o' th' Relearrrn theme directory. Files 'n yer root directory will replace theme files 'n th' same locat'n.</p>
<p>For example, if ye create a file at <code>layouts/partials/head'n.html</code>, it will override th' theme&rsquo;s <code>themes/hugo-theme-relearn/layouts/partials/head'n.html</code>.</p>
<p><a href="/hugo-theme-relearn/pir/configuration/customization/partials/index.html">See this list</a>, t' learn which files be allowed t' be modified by ye.</p>
<p>This makes it easy t' cust'mize th' theme without chang'n files 'n th' <code>themes</code> directory, mak'n future theme updates simpler.</p>
<div class="box notices cstyle warning">
<div class="box-label">
<i class="fa-fw fas fa-exclamation-triangle"></i> Arrr
</div>
<div class="box-content">
<p>Don&rsquo;t edit files inside th' <code>themes/hugo-theme-relearn</code> directory. That&rsquo;s not th' recommended way t' cust'mize! Refer t' th' explanat'n above.</p>
<p>Don&rsquo;t clone th' theme repository an' edit files there fer yer ship. That&rsquo;s not th' recommended way t' cust'mize! Instead, follow th' <a href="/hugo-theme-relearn/pir/introduction/quickstart/index.html">Gett'n Started</a> guide.</p>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="multilingual">Multilingual</h1>
<p>Th' Relearrrn theme works wit' <a href="https://gohugo.io/content-management/multilingual/" rel="external" target="_self">Hugo&rsquo;s multilingual mode</a>.</p>
<p>It supports many languages, includ'n right-to-left languages.</p>
<div class="expand">
<input type="checkbox" id="R-expand-39709d22a7a8fa6462a6e1376193a82c" aria-controls="R-expandcontent-39709d22a7a8fa6462a6e1376193a82c">
<label class="expand-label" for="R-expand-39709d22a7a8fa6462a6e1376193a82c">
<i class="expander-icon fa-fw fas fa-chevron-down"></i>
<i class="expander-icon fa-fw fas fa-chevron-right"></i> Supported languages
</label>
<div id="R-expandcontent-39709d22a7a8fa6462a6e1376193a82c" class="expand-content">
<ul>
<li>Arabic</li>
<li>Simplified Chinese</li>
<li>Traditional Chinese</li>
<li>Czech</li>
<li>Dutch</li>
<li>English</li>
<li>Finnish</li>
<li>French</li>
<li>German</li>
<li>Hindi</li>
<li>Hungarian</li>
<li>Indonesian</li>
<li>Italian</li>
<li>Japanese</li>
<li>Korean</li>
<li>Polish</li>
<li>Portuguese</li>
<li>Romanian</li>
<li>Russian</li>
<li>Spanish</li>
<li>Swahili</li>
<li>Turkish</li>
<li>Vietnamese</li>
</ul>
</div>
</div>
<h2 id="translation-by-file-name">Translat'n by File Name</h2>
<p>Here&rsquo;s how t' make yer ship multilingual us'n <a href="https://gohugo.io/content-management/multilingual/#translation-by-file-name" rel="external" target="_self">translat'ns by file name</a>:</p>
<ol>
<li>
<p>Set up languages 'n yer <code>hugo.toml</code> file:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="nx">defaultContentLanguage</span> <span class="p">=</span> <span class="s1">&#39;en&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">[</span><span class="nx">languages</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">languageCode</span> <span class="p">=</span> <span class="s1">&#39;en&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">languageName</span> <span class="p">=</span> <span class="s1">&#39;English&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;My Website&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">1</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">languageCode</span> <span class="p">=</span> <span class="s1">&#39;art-x-pir&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">languageDirect'n</span> <span class="p">=</span> <span class="s1">&#39;rtl&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">languageName</span> <span class="p">=</span> <span class="s1">&#39;Pirrratish&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;Arrr, my Website&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">2</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">defaultContentLanguage</span><span class="p">:</span><span class="w"> </span><span class="l">en</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nt">languages</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">en</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">languageCode</span><span class="p">:</span><span class="w"> </span><span class="l">en</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">languageName</span><span class="p">:</span><span class="w"> </span><span class="l">English</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">title</span><span class="p">:</span><span class="w"> </span><span class="l">My Website</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">1</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pir</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">languageCode</span><span class="p">:</span><span class="w"> </span><span class="l">art-x-pir</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">languageDirect'n</span><span class="p">:</span><span class="w"> </span><span class="l">rtl</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">languageName</span><span class="p">:</span><span class="w"> </span><span class="l">Pirrratish</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">title</span><span class="p">:</span><span class="w"> </span><span class="l">Arrr, my Website</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">2</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;defaultContentLanguage&#34;</span><span class="p">:</span> <span class="s2">&#34;en&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languages&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;en&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languageCode&#34;</span><span class="p">:</span> <span class="s2">&#34;en&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languageName&#34;</span><span class="p">:</span> <span class="s2">&#34;English&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;title&#34;</span><span class="p">:</span> <span class="s2">&#34;My Website&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">1</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pir&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languageCode&#34;</span><span class="p">:</span> <span class="s2">&#34;art-x-pir&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languageDirection&#34;</span><span class="p">:</span> <span class="s2">&#34;rtl&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languageName&#34;</span><span class="p">:</span> <span class="s2">&#34;Pirrratish&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;title&#34;</span><span class="p">:</span> <span class="s2">&#34;Arrr, my Website&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">2</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
</li>
<li>
<p>Duplicate yer rrrambl'n files an' add language codes t' their file names:</p>
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-plaintext" data-lang="plaintext"><span class="line"><span class="cl">├── rrrambl'n
</span></span><span class="line"><span class="cl">│ ├── first-chapter
</span></span><span class="line"><span class="cl">│ │ ├── first-page
</span></span><span class="line"><span class="cl">| | | ├── _index.en.md
</span></span><span class="line"><span class="cl">| | | └── _index.pir.md
</span></span><span class="line"><span class="cl">│ │ ├── second-page
</span></span><span class="line"><span class="cl">| | | ├── index.en.md
</span></span><span class="line"><span class="cl">| | | └── index.pir.md
</span></span><span class="line"><span class="cl">│ │ ├── third-page.en.md
</span></span><span class="line"><span class="cl">│ │ └── third-page.pir.md
</span></span><span class="line"><span class="cl">│ ├── _index.en.md
</span></span><span class="line"><span class="cl">│ └── _index.pir.md
</span></span><span class="line"><span class="cl">├── themes
</span></span><span class="line"><span class="cl">│ └── hugo-theme-relearn
</span></span><span class="line"><span class="cl">│ └── ...
</span></span><span class="line"><span class="cl">└── hugo.toml</span></span></code></pre></div>
</li>
</ol>
<h2 id="translation-by-content-directory">Translat'n by Rrrambl'n Directory</h2>
<p>Th' theme also support <a href="https://gohugo.io/content-management/multilingual/#translation-by-content-directory" rel="external" target="_self">translat'ns by rrrambl'n directory</a> which can be configured 'n a similar way. This be not used 'n further examples o' this documentat'n.</p>
<h2 id="search-settings">Search Sett'ns</h2>
<p>Check th' <a href="/hugo-theme-relearn/pir/configuration/sidebar/search/index.html#mixed-language-support">search configurat'n</a> fer multilingual opt'ns.</p>
<h2 id="turn-off-language-switching">Turn Off Language Switch'n</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> By default th' theme shows a language switcher 'n th' lower part o' th' menu.</p>
<p>T' dis'ble th' language switcher set <code>disableLanguageSwitchingButton=true</code></p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableLanguageSwitchingButton</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableLanguageSwitchingButton</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableLanguageSwitchingButton&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="meta-information">Meta Information</h1>
<h2 id="site-author-information">Ship Author Informat'n</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Th' theme uses author details 'n various parts o' yer ship, like RSS feeds an' meta tags.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">author</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">email</span> <span class="p">=</span> <span class="s1">&#39;santa@example.com&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Santa Claus&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">author</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">email</span><span class="p">:</span><span class="w"> </span><span class="l">santa@example.com</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">Santa Claus</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;author&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;email&#34;</span><span class="p">:</span> <span class="s2">&#34;santa@example.com&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;Santa Claus&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="site-title">Ship Title</h2>
<p>Th' <code>title</code> will be used 'n meta informat'n o' yer HTML.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;Hugo Relearrrn Theme&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">title</span><span class="p">:</span><span class="w"> </span><span class="l">Cap'n Hugo Relearrrn Theme</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;title&#34;</span><span class="p">:</span> <span class="s2">&#34;Hugo Relearrrn Theme&#34;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="site-description">Ship Descript'n</h2>
<p><span class="badge cstyle green badge-with-title"><span class="badge-title"><i class="fa-fw fab fa-markdown"></i></span><span class="badge-content">Front Matter</span></span> Th' theme shows a ship descript'n 'n various places, such as RSS feeds an' meta tags. For this, it uses th' <code>descript'n</code> field from yer home page&rsquo;s front matter.</p>
<h2 id="social-media-images">Social Media Images</h2>
<p>When yer plank be shared on social media, ye can set a site-wide image t' display wit' th' link</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="nx">images</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;images/hero.png&#39;</span><span class="p">]</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">images</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span>- <span class="l">images/hero.png</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;images&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;images/hero.png&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="more-social-media-options">More Social Media Opt'ns</h2>
<p>Th' theme adheres t' Hugo&rsquo;s official documentat'n fer <a href="https://gohugo.io/templates/embedded/#configure-open-graph" rel="external" target="_self">Open Graph</a> an' <a href="https://gohugo.io/templates/embedded/#configure-x-twitter-cards" rel="external" target="_self">Twitter Cards</a> configurat'n.</p>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="deployment-scenarios">Deployment Scenarios</h1>
<h2 id="offline-usage">Offline Usage</h2>
<p>Th' theme be us'ble offline. No internet connect'n be required t' board yer plank. This be achieved by stor'n all dependencies within th' theme.</p>
<p>No calls t' 3rd party servers, no call'n home, no track'n. Privacy friendly.</p>
<h2 id="server-deployment">Server Deployment</h2>
<p>If yer server deployment has no special requirements, ye can skip this section an' use th' <a href="https://gohugo.io/content-management/urls/" rel="external" target="_self">standard Cap'n Hugo opt'ns</a>.</p>
<p>For special requirements, th' theme be cap'ble o' different scenarios, requir'n th' follow'n mandatory sett'ns 'n yer <code>hugo.toml</code>. All sett'ns not mentioned 'n th' examples below can be set t' yer lik'n.</p>
<h3 id="public-web-server-from-root">Public Web Server from Root</h3>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="nx">baseURL</span> <span class="p">=</span> <span class="s1">&#39;https://example.com/&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">baseURL</span><span class="p">:</span><span class="w"> </span><span class="l">https://example.com/</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;baseURL&#34;</span><span class="p">:</span> <span class="s2">&#34;https://example.com/&#34;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h3 id="public-web-server-from-subdirectory">Public Web Server from Subdirectory</h3>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="nx">baseURL</span> <span class="p">=</span> <span class="s1">&#39;https://example.com/mysite/&#39;</span>
</span></span><span class="line"><span class="cl"><span class="nx">relativeURLs</span> <span class="p">=</span> <span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">baseURL</span><span class="p">:</span><span class="w"> </span><span class="l">https://example.com/mysite/</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nt">relativeURLs</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;baseURL&#34;</span><span class="p">:</span> <span class="s2">&#34;https://example.com/mysite/&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;relativeURLs&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>If ye be still us'n Hugo&rsquo;s <code>relref</code> shortcode (which ye shouldn&rsquo;t), ye will need <a href="/hugo-theme-relearn/pir/configuration/content/linking/index.html#patching-the-relref-shortcode">further configurat'n</a>.</p>
<div class="box notices cstyle warning">
<div class="box-label">
<i class="fa-fw fas fa-exclamation-triangle"></i> Arrr
</div>
<div class="box-content">
<p>Don&rsquo;t use a <code>baseURL</code> wit' a subdirectory an' <code>relativeURLs=true</code> together. <a href="https://github.com/gohugoio/hugo/issues/12130" rel="external" target="_self">Cap'n Hugo doesn&rsquo;t apply th' <code>baseURL</code> correctly</a> 'n this case. If ye need both, generate yer ship twice wit' different sett'ns into separate directories.</p>
</div>
</div>
<h3 id="private-web-server-lan">Private Web Server (LAN)</h3>
<p>Th' same sett'ns as wit' any o' th' public web server scenarios or</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="nx">baseURL</span> <span class="p">=</span> <span class="s1">&#39;/&#39;</span>
</span></span><span class="line"><span class="cl"><span class="nx">relativeURLs</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">baseURL</span><span class="p">:</span><span class="w"> </span><span class="l">/</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nt">relativeURLs</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;baseURL&#34;</span><span class="p">:</span> <span class="s2">&#34;/&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;relativeURLs&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h3 id="file-system">File System</h3>
<p>Yer generated ship can be used headless without a HTTP server.</p>
<p>This can be achieved by us'n th' <code>file://</code> protocol 'n yer browser&rsquo;s address bar or by do'ble click on a generated <code>*.html</code> file 'n yer file navigat'n tool.</p>
<p>Use th' follow'n sett'ns</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="nx">baseURL</span> <span class="p">=</span> <span class="s1">&#39;/&#39;</span>
</span></span><span class="line"><span class="cl"><span class="nx">relativeURLs</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">baseURL</span><span class="p">:</span><span class="w"> </span><span class="l">/</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nt">relativeURLs</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;baseURL&#34;</span><span class="p">:</span> <span class="s2">&#34;/&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;relativeURLs&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<div class="box notices cstyle note">
<div class="box-label">
<i class="fa-fw fas fa-exclamation-circle"></i> Avast
</div>
<div class="box-content">
<p>Planks like <code>sitemap.xml</code> an' <code>rss.xml</code>, an' social media links will always use absolute URLs. They won&rsquo;t work wit' <code>relativeURLs=true</code>.</p>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="available-output-formats">Available Output Formats</h1>
<h2 id="print-support">Print Support</h2>
<p>En'ble print support t' print entire chapters or th' whole ship. Add th' <code>print</code> output format t' yer home, section, an' plank 'n <code>hugo.toml</code>:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">outputs</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">home</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;html&#39;</span><span class="p">,</span> <span class="s1">&#39;rss&#39;</span><span class="p">,</span> <span class="s1">&#39;print&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">plank</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;html&#39;</span><span class="p">,</span> <span class="s1">&#39;rss&#39;</span><span class="p">,</span> <span class="s1">&#39;print&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">section</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;html&#39;</span><span class="p">,</span> <span class="s1">&#39;rss&#39;</span><span class="p">,</span> <span class="s1">&#39;print&#39;</span><span class="p">]</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">outputs</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">home</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">html</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">rss</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">print</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">plank</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">html</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">rss</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">print</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">section</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">html</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">rss</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">print</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;outputs&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;home&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;html&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;rss&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;print&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;page&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;html&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;rss&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;print&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;section&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;html&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;rss&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;print&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>This adds a printer ay'con 'n th' topbar. Click'n it switches t' print preview, show'n th' plank an' its <a href="/hugo-theme-relearn/pir/configuration/content/hidden/index.html">vis'ble subpages</a> 'n a printer-friendly format. Use yer browser&rsquo;s print funct'n t' print or save as PDF.</p>
<p>Th' URL won&rsquo;t be <a href="https://gohugo.io/templates/output-formats/#configure-output-formats" rel="external" target="_self">configured ugly</a> fer <a href="https://gohugo.io/content-management/urls/#ugly-urls" rel="external" target="_self">Hugo&rsquo;s URL handl'n</a>, even wit' <code>uglyURLs=true</code> 'n <code>hugo.toml</code>. This be because each mime type can only have one suffix.</p>
<p>If ye don&rsquo;t like th' URLs, ye can reconfigure <code>outputFormats.print</code> 'n yer <code>hugo.toml</code> t' someth'n other than th' default o':</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">outputFormats</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">outputFormats</span><span class="p">.</span><span class="nx">print</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">baseName</span> <span class="p">=</span> <span class="s1">&#39;index.print&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">isHTML</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">mediaType</span> <span class="p">=</span> <span class="s1">&#39;text/html&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;print&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">noUgly</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">permalink'ble</span> <span class="p">=</span> <span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">outputFormats</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">print</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">baseName</span><span class="p">:</span><span class="w"> </span><span class="l">index.print</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">isHTML</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">mediaType</span><span class="p">:</span><span class="w"> </span><span class="l">text/html</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">print</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">noUgly</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">permalink'ble</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;outputFormats&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;print&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;baseName&#34;</span><span class="p">:</span> <span class="s2">&#34;index.print&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;isHTML&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;mediaType&#34;</span><span class="p">:</span> <span class="s2">&#34;text/html&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;print&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;noUgly&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;permalinkable&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="stable-output">Stable Output</h1>
<h2 id="disabling-the-generator-meta">Disabl'n th' Generator Meta</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Th' theme adds a meta tag wit' its version number t' each plank.</p>
<p>This isn&rsquo;t a security risk an' helps us support ye better.</p>
<p>T' turn this off, set <code>disableGeneratorVersion=true</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableGeneratorVersion</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableGeneratorVersion</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableGeneratorVersion&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>If ye also want t' turn off <a href="https://gohugo.io/getting-started/configuration/#disablehugogeneratorinject" rel="external" target="_self">Hugo&rsquo;s version meta tag</a>, use <code>disableHugoGeneratorInject=true</code>.</p>
<h2 id="disabling-ids-for-referenced-assets">Disabl'n IDs fer Referenced Assets</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Th' theme creates a unique ID fer each build an' adds it t' each referenced asset&rsquo;s URL t' make browsers not keep outdated cached assets.</p>
<p>This be bloody fer product'n sites but can be problematic dur'n development. It makes compar'n outputs difficult as each build has new IDs.</p>
<p>T' dis'ble this, set <code>disableAssetsBusting=true</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableAssetsBust'n</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableAssetsBust'n</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableAssetsBusting&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="disabling-ids-for-interactive-html-elements">Disabl'n IDs fer Interactive HTML Elements</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Features like expanders, callouts, an' tabs use unique IDs t' work. These IDs change wit' each build.</p>
<p>This be necessary fer th' theme t' work properly, but it can make compar'n outputs between builds difficult.</p>
<p>T' turn this off, set <code>disableRandomIds=true</code>. Avast, that this will result 'n a non-functional ship!.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableRandomIds</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableRandomIds</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableRandomIds&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
</section>
<article class="default">
<header class="headline">
</header>
<h1 id="brrrandn">Brrrand&#39;n</h1>
<div class="children children-h2 children-sort-">
<h2><a href="/hugo-theme-relearn/pir/configuration/branding/logo/index.html">Logo</a></h2><p>Provide yer own logo an' favicon</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html">Colors</a></h2><p>Learrrn how t' cust'mize yer site&#39;s colors</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/branding/modules/index.html">Module Them'n</a></h2><p>Colors o' rules highlight'n an' 3rd-party modules</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/branding/generator/index.html">Stylesheet Generator</a></h2><p>An interactive tool t' generate color variant stylesheets</p>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
<section>
<h1 class="a11y-only">Subsct&#39;ns o&#39; Brrrand&#39;n</h1>
<article class="default">
<header class="headline">
</header>
<h1 id="logo">Logo</h1>
<h2 id="change-the-favicon">Change th' Favicon</h2>
<p>If yer favicon be an SVG, PNG, or ICO, just drop yer image 'n yer site&rsquo;s <code>static/images/</code> directory an' name it <code>favicon.svg</code>, <code>favicon.png</code>, or <code>favicon.ico</code> respectively.</p>
<p>If ye want t' adjust yer favicon accord'n t' yer OS sett'ns fer light/dark mode, add th' image files <code>static/images/favicon-light.svg</code> an' <code>static/images/favicon-dark.svg</code> t' yer site&rsquo;s directory, respectively, correspond'n t' yer file format. In case some o' th' files be miss'n, th' theme falls back t' <code>favicon.svg</code> fer each miss'n file. All supplied favicons must be o' th' same file format.</p>
<p>If no favicon file be found, th' theme will look up th' alternative filename <code>logo</code> 'n th' same locat'n an' will repeat th' search fer th' list o' supported file types.</p>
<p>If ye need t' change this default behavior, create a new file <code>layouts/partials/favicon.html</code> 'n yer site&rsquo;s directory an' write someth'n like this:</p>
<div class="tab-panel" data-tab-group="49ff790d72016eeaeaec438d5596bcf6">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialsfaviconhtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('49ff790d72016eeaeaec438d5596bcf6','layoutspartialsfaviconhtml')"
>
<span class="tab-nav-text">layouts/partials/favicon.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialsfaviconhtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">link</span> <span class="na">rel</span><span class="o">=</span><span class="s">&#34;icon&#34;</span> <span class="na">href</span><span class="o">=</span><span class="s">&#34;/images/favicon.bmp&#34;</span> <span class="na">type</span><span class="o">=</span><span class="s">&#34;image/bmp&#34;</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><h2 id="change-the-logo">Change th' Logo</h2>
<p>By default, only yer ship title will be shown at th' top o' th' menu. Ye can <a href="/hugo-theme-relearn/pir/configuration/sidebar/headerfooter/index.html#title">configure this</a>, or override th' logo partial.</p>
<p>Create a new file 'n <code>layouts/partials/logo.html</code> o' yer ship. Then write any HTML ye want. Ye could use an <code>img</code> HTML tag an' reference an image, or ye could paste an SVG definit'n!</p>
<p>Th' size o' th' logo will adapt automatically.</p>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="brrrandn">Brrrand&#39;n</h1>
<p>Th' Relearrrn theme offers color variants t' change yer site&rsquo;s appearance. Each color variant contains o' a CSS file an' optional sett'ns 'n yer <code>hugo.toml</code>.</p>
<p>Ye can use th' <a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html#shipped-variants">shipped variants</a>, <a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html#modifying-variants">cust'mize them</a>, or create yer own. Th' <a href="/hugo-theme-relearn/pir/configuration/branding/generator/index.html">interactive variant generator</a> can help ye wit' this.</p>
<p>Once set up 'n <code>hugo.toml</code>, ye can switch variants us'n th' selector at th' bottom o' th' menu.</p>
<h2 id="shipped-variants">Shipped Variants</h2>
<p>Th' theme ships wit' th' follow'n set o' variants</p>
<ul>
<li>Relearrrn
<ul>
<li>Light: th' classic Relearrrn default, com'n wit' signature green, dark sidebar an' light rrrambl'n area</li>
<li>Dark: dark variant o' Light, com'n wit' signature green, dark sidebar an' dark rrrambl'n area</li>
<li>Bright: alternative o' Light, com'n wit' signature green, green sidebar an' light rrrambl'n area</li>
</ul>
</li>
<li>Zen
<ul>
<li>Light: a more relaxed white/grey variant, com'n wit' blue accents, light sidebar an' light rrrambl'n area</li>
<li>Dark: dark variant o' Light, com'n wit' blue accents, dark sidebar an' dark rrrambl'n area</li>
</ul>
</li>
<li>Experimental
<ul>
<li>Neon: a variant that glows 'n th' dark, gradient sidebar an' dark rrrambl'n area</li>
</ul>
</li>
<li>Retro
<ul>
<li>Learrrn: th' default o' th' old Learrrn theme, com'n wit' signature light purple, dark sidebar an' light rrrambl'n area</li>
<li>Blue: a blue variant o' th' old Learrrn theme, com'n tinted 'n blue, dark sidebar an' light rrrambl'n area</li>
<li>Green: a green variant o' th' old Learrrn theme, com'n tinted 'n green, dark sidebar an' light rrrambl'n area</li>
<li>Red: a red variant o' th' old Learrrn theme, com'n tinted 'n red, dark sidebar an' light rrrambl'n area</li>
</ul>
</li>
</ul>
<h2 id="changing-the-variant">Chang'n th' Variant</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Set th' <code>themeVariant</code> opt'n t' change th' variant.</p>
<p>Th' theme offers th' recommended <a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html#theme-variant-advanced">advanced configurat'n mode</a> that combines th' functionality fer <a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html#multiple-variants">multiple variants</a>, <a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html#adjust-to-os-settings">OS sett'n adjustments</a>, an' more.</p>
<h3 id="theme-variant">Simple Setup</h3>
<h4 id="single-variant">Single Variant</h4>
<p>Set <code>themeVariant</code> t' yer theme CSS file name:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">themeVariant</span> <span class="p">=</span> <span class="s1">&#39;relearn-light&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariant</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-light</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariant&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-light&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>Place yer theme file 'n <code>assets/css</code> or <code>themes/hugo-theme-relearn/assets/css</code>. Name it <code>theme-*.css</code>.</p>
<p>In th' above example, th' path o' yer theme file must be <code>assets/css/theme-relearn-light.css</code> or <code>themes/hugo-theme-relearn/assets/css/theme-relearn-light.css</code>.</p>
<h4 id="multiple-variants">Multiple Variants</h4>
<p>T' let th' reader choose between multiple variants, set <code>themeVariant</code> like this:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">themeVariant</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;relearn-light&#39;</span><span class="p">,</span> <span class="s1">&#39;relearn-dark&#39;</span><span class="p">]</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariant</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">relearn-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">relearn-dark</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariant&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;relearn-light&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;relearn-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>Th' first variant be th' default, an' a selector will appear if there&rsquo;s more than one.</p>
<h4 id="adjust-to-os-settings">Adjust t' OS Sett'ns</h4>
<p>Use th' <code>auto</code> value t' match OS light/dark sett'ns. Usually it makes sense t' set it 'n th' first posit'n an' make it th' default.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">themeVariant</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;auto&#39;</span><span class="p">,</span> <span class="s1">&#39;red&#39;</span><span class="p">]</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariant</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">auto</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">red</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariant&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;auto&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;red&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>If ye don&rsquo;t configure anyth'n else, th' theme will default t' use <code>relearn-light</code> fer light mode an' <code>relearn-dark</code> fer dark mode.</p>
<p>Default be <code>relearn-light</code> fer light an' <code>relearn-dark</code> fer dark mode. These defaults be overwritten by th' first two non-auto opt'ns o' yer <code>themeVariant</code> array.</p>
<p>Ye can override th' default wit' <code>themeVariantAuto</code>:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">themeVariantAuto</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;learn&#39;</span><span class="p">,</span> <span class="s1">&#39;neon&#39;</span><span class="p">]</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariantAuto</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">learn</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">neon</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariantAuto&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;learn&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;neon&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h3 id="theme-variant-advanced">Advanced</h3>
<p>Th' theme offers an advanced way t' configure theme variants an' all o' th' aspects above inside o' a single configurat'n item. This comes wit' some features previously unsupported.</p>
<p>Like wit' th' <a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html#multiple-variants">multiple variants</a> opt'n, ye be defin'n yer theme variants 'n an array but now 'n a t'ble wit' subopt'ns.</p>
<p>Again, 'n this case, th' first variant be th' default chosen on first view an' a variant selector will be shown 'n th' menu footer if th' array contains more than one entry.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">themeVariant</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;relearn-light&#39;</span><span class="p">,</span> <span class="s1">&#39;relearn-dark&#39;</span><span class="p">]</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariant</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">relearn-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">relearn-dark</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariant&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;relearn-light&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;relearn-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>ye now write it that way:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-light&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-dark&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariant</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-dark</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariant&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-light&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>Th' <code>identifier</code> opt'n be mandatory an' equivalent t' th' str'n 'n th' first example. Further opt'ns can be configured, see th' t'ble below.</p>
<h4 id="parameter">Parameter</h4>
<table>
<thead>
<tr>
<th style="text-align: left">Name</th>
<th style="text-align: left">Default</th>
<th style="text-align: left">Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left">identifier</td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Must correspond t' th' name o' a color variant either 'n yer site&rsquo;s or th' theme&rsquo;s directory 'n th' form <code>assets/css/theme-&lt;IDENTIFIER&gt;.css</code>.</td>
</tr>
<tr>
<td style="text-align: left">name</td>
<td style="text-align: left">see notes</td>
<td style="text-align: left">Th' name t' be displayed 'n th' variant selector. If not set, th' identifier be used 'n a human read'ble form.</td>
</tr>
<tr>
<td style="text-align: left">auto</td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">If set, th' variant be treated as an <a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html#adjust-to-os-settings">auto mode variant</a>. It has th' same behavior as th' <code>themeVariantAuto</code> opt'n. Th' first entry 'n th' array be th' color variant fer light mode, th' second fer dark mode. Defin'n auto mode variants wit' th' advanced opt'ns has th' benefit that ye can now have multiple auto mode variants instead o' just one wit' th' simple opt'ns.</td>
</tr>
</tbody>
</table>
<h4 id="example-configuration">Example Configurat'n</h4>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-auto&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Relearn Light/Dark&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-light&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-dark&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-bright&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;zen-light&#39;</span><span class="p">,</span> <span class="s1">&#39;zen-dark&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-auto&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Zen Light/Dark&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-light&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-dark&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;learn&#39;</span><span class="p">,</span> <span class="s1">&#39;neon&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;retro-auto&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Retro Learn/Neon&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;neon&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;learn&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariant</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">auto</span><span class="p">:</span><span class="w"> </span><span class="p">[]</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-auto</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">Relearrrn Light/Dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-bright</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">auto</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">zen-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">zen-dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">zen-auto</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">Zen Light/Dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">zen-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">zen-dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">auto</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">learn</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">neon</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">retro-auto</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">Retro Learn/Neon</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">neon</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">learn</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariant&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;auto&#34;</span><span class="p">:</span> <span class="p">[],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-auto&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;Relearn Light/Dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-light&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-bright&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;auto&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;zen-light&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;zen-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;zen-auto&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;Zen Light/Dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;zen-light&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;zen-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;auto&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;learn&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;neon&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;retro-auto&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;Retro Learn/Neon&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;neon&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;learn&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="advanced-topics">Advanced Topics</h2>
<h3 id="modifying-variants">Modify'n Variants</h3>
<p>In case ye like a shipped variant but only want t' tweak some aspects, ye have some choices. <strong>Don&rsquo;t edit th' file 'n th' theme&rsquo;s directory!</strong> Ye will lose th' ability t' later easily upgrade yer theme t' a newer version.</p>
<ol>
<li>
<p>Copy an' change</p>
<p>Ye can copy th' shipped variant file from th' theme&rsquo;s <code>themes/hugo-theme-relearn/assets/css</code> directory t' th' site&rsquo;s <code>assets/css</code> directory an' either store it wit' th' same name or give it a new name. Edit th' sett'ns an' save th' new file. Afterwards, ye can use it 'n yer <code>hugo.toml</code> by th' chosen name.</p>
</li>
<li>
<p>Create an' import</p>
<p>Ye can create a new variant file 'n th' site&rsquo;s <code>assets/css</code> directory an' give it a new name. Import th' shipped variant, add th' sett'ns ye want t' change an' save th' new file. Afterwards, ye can use it 'n yer <code>hugo.toml</code> by th' chosen name.</p>
<p>For example, ye want t' use th' <code>relearn-light</code> variant but want t' change th' rules highlight'n schema t' th' one used 'n th' <code>neon</code> variant. For that, create a new <code>assets/css/theme-my-brand'n.css</code> 'n yer site&rsquo;s directory an' add th' follow'n lines:</p>
<div class="tab-panel" data-tab-group="0660887c74f2a9d92393590a2ff5375c">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="assetscsstheme-my-brandingcss"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('0660887c74f2a9d92393590a2ff5375c','assetscsstheme-my-brandingcss')"
>
<span class="tab-nav-text">assets/css/theme-my-brand'n.css</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="assetscsstheme-my-brandingcss"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-css" data-lang="css"><span class="line"><span class="cl"><span class="p">@</span><span class="k">import</span> <span class="s2">&#34;theme-relearn-light.css&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">:</span><span class="nd">root</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nv">--CODE-theme</span><span class="p">:</span> <span class="n">neon</span><span class="p">;</span> <span class="c">/* name o' th' chroma stylesheet file */</span>
</span></span><span class="line"><span class="cl"> <span class="nv">--CODE-BLOCK-color</span><span class="p">:</span> <span class="nb">rgba</span><span class="p">(</span> <span class="mi">226</span><span class="p">,</span> <span class="mi">228</span><span class="p">,</span> <span class="mi">229</span><span class="p">,</span> <span class="mi">1</span> <span class="p">);</span> <span class="c">/* fallback color fer code text */</span>
</span></span><span class="line"><span class="cl"> <span class="nv">--CODE-BLOCK-BG-color</span><span class="p">:</span> <span class="nb">rgba</span><span class="p">(</span> <span class="mi">40</span><span class="p">,</span> <span class="mi">42</span><span class="p">,</span> <span class="mi">54</span><span class="p">,</span> <span class="mi">1</span> <span class="p">);</span> <span class="c">/* fallback color fer code background */</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><p>Afterwards, put this 'n yer <code>hugo.toml</code> t' use yer new variant:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">themeVariant</span> <span class="p">=</span> <span class="s1">&#39;my-branding&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariant</span><span class="p">:</span><span class="w"> </span><span class="l">my-brand'n</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariant&#34;</span><span class="p">:</span> <span class="s2">&#34;my-branding&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>In comparison t' <em>copy an' change</em>, this has th' advantage that ye profit from any adjustments t' th' <code>relearn-light</code> variant while keep'n yer modificat'ns.</p>
</li>
</ol>
<h3 id="react-to-variant-switches-in-javascript">React t' Variant Switches 'n JavaScript</h3>
<p>Once a color variant be fully boarded, either initially or by switch'n th' color variant manually wit' th' variant selector, th' custom event <code>themeVariantLoaded</code> on th' <code>document</code> will be dispatched. Ye can add an event listener an' react t' changes.</p>
<div class="tab-panel" data-tab-group="18ed0761b2de0b0d12af42e80ee37d9e">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="javascript"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('18ed0761b2de0b0d12af42e80ee37d9e','javascript')"
>
<span class="tab-nav-text">JavaScript</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="javascript"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-javascript" data-lang="javascript"><span class="line"><span class="cl"><span class="nb">document</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span> <span class="s1">&#39;themeVariantLoaded&#39;</span><span class="p">,</span> <span class="kd">funct'n</span><span class="p">(</span> <span class="nx">e</span> <span class="p">){</span>
</span></span><span class="line"><span class="cl"> <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span> <span class="nx">e</span><span class="p">.</span><span class="nx">detail</span><span class="p">.</span><span class="nx">variant</span> <span class="p">);</span> <span class="c1">// `relearn-light`
</span></span></span><span class="line"><span class="cl"><span class="c1"></span><span class="p">});</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="module-theming">Module Theming</h1>
<h2 id="change-syntax-highlighting">Change Rules Highlight'n</h2>
<p>If ye want t' switch th' rules highlight'n theme together wit' yer color variant, first ye need t' configure yer installat'n <a href="https://gohugo.io/content-management/syntax-highlighting/#generate-syntax-highlighter-css" rel="external" target="_self">accord'n t' Hugo&rsquo;s documentat'n</a> t' provide a rules highlight'n stylesheet file.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">marrrkup</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">marrrkup</span><span class="p">.</span><span class="nx">highlight</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">noClasses</span> <span class="p">=</span> <span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">marrrkup</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">highlight</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">noClasses</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;markup&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;highlight&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;noClasses&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>Ye can use one o' th' shipped stylesheet files or use Cap'n Hugo t' generate a file fer ye.</p>
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-shell" data-lang="shell"><span class="line"><span class="cl">hugo gen chromastyles --style<span class="o">=</span>monokai &gt; chroma-mycode.css</span></span></code></pre></div>
<p>Th' file must be written t' <code>assets/css/chroma-&lt;NAME&gt;.css</code>. T' use it wit' yer color variant, ye have t' modify <code>--CODE-theme: &lt;NAME&gt;</code> 'n th' color variant stylesheet file.</p>
<div class="tab-panel" data-tab-group="5210c23ed6de94ee162183faeb215b3d">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="assetscsstheme-my-brandingcss"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('5210c23ed6de94ee162183faeb215b3d','assetscsstheme-my-brandingcss')"
>
<span class="tab-nav-text">assets/css/theme-my-brand'n.css</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="assetscsstheme-my-brandingcss"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-css" data-lang="css"><span class="line"><span class="cl"><span class="p">@</span><span class="k">import</span> <span class="s2">&#34;theme-relearn-light.css&#34;</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">:</span><span class="nd">root</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nv">--CODE-theme</span><span class="p">:</span> <span class="n">mycode</span><span class="p">;</span> <span class="c">/* name o' th' chroma stylesheet file */</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><h2 id="change-3rd-party-libraries-theming">Change 3rd-Party Libraries Them'n</h2>
<p>Some o' th' shipped shorrrtcodes be us'n 3rd-party libraries. See th' individual shortcode documentat'n on how t' change their them'n.</p>
<ul>
<li><a href="/hugo-theme-relearn/pir/shortcodes/mermaid/index.html#setting-a-specific-mermaid-theme"><code>mermaid</code> shortcode</a></li>
<li><a href="/hugo-theme-relearn/pir/shortcodes/openapi/index.html#setting-a-specific-swagger-ui-theme"><code>openapi</code> shortcode</a></li>
</ul>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="stylesheet-generrratr">Stylesheet Generrrat&#39;r</h1>
<p>This interactive tool may help ye t' generate yer own color variant stylesheet.</p>
<div class="expand">
<input type="checkbox" id="R-expand-faa784066e3cf2b74e1c015b9097a96e" aria-controls="R-expandcontent-faa784066e3cf2b74e1c015b9097a96e">
<label class="expand-label" for="R-expand-faa784066e3cf2b74e1c015b9097a96e">
<i class="expander-icon fa-fw fas fa-chevron-down"></i>
<i class="expander-icon fa-fw fas fa-chevron-right"></i> Show usage instruct'ns
</label>
<div id="R-expandcontent-faa784066e3cf2b74e1c015b9097a96e" class="expand-content">
<p>T' get started, first select a color variant from th' variant selector 'n th' lower left sidebar that fits ye best as a start'n point.</p>
<p>Th' graph be interactive an' reflects th' current colors. Ye can click on any o' th' colored boxes t' adjust th' respective color. Th' graph <strong>an' th' plank</strong> will update accordingly.</p>
<p>Th' arrowed lines reflect how colors be inherited through different parts o' th' theme if th' descendant isn&rsquo;t overwritten. If ye want t' delete a color an' let it inherit from its parent, just delete th' value from th' input field.</p>
<p>T' better understand this, select th' <code>neon</code> variant an' modify th' different head'n colors. There, colors fer th' head'ns <code>h2</code>, <code>h3</code> an' <code>h4</code> be explicitly set. <code>h5</code> be not set an' inherits its value from <code>h4</code>. <code>h6</code> be also not set an' inherits its value from <code>h5</code>.</p>
<p>Once you&rsquo;ve changed a color, th' variant selector will show a &ldquo;My custom variant&rdquo; entry an' yer changes be stored 'n th' browser. Ye can <strong>browse t' other planks</strong> an' even close th' browser <strong>without los'n yer changes</strong>.</p>
<p>Once ye be satisfied, ye can download th' new variants file an' copy it into yer site&rsquo;s <code>assets/css</code> directory.</p>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Afterwards, ye have t' adjust th' <code>themeVariant</code> opt'n 'n yer <code>hugo.toml</code> t' yer chosen file name. For example, if yer new variants file be named <code>theme-my-custom-variant.css</code>, ye have t' set <code>themeVariant='my-custom-variant'</code> t' use it.</p>
<p>See th' docs fer <a href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html">further configurat'n opt'ns</a>.</p>
</div>
</div>
<p><span class="btn cstyle interactive secondary"><button onclick="window.variants&amp;&amp;variants.getStylesheet();this.blur();" type="button"><i class="fa-fw fas fa-download"></i> <span class="title">Download variant</span></button></span>
<span class="btn cstyle interactive warning"><button onclick="window.variants&amp;&amp;variants.resetVariant();this.blur();" type="button"><i class="fa-fw fas fa-trash"></i> <span class="title">Reset variant</span></button></span></p>
<div id="R-vargenerator" class="mermaid zoomable" style="background-color: var(--INTERNAL-MAIN-TEXT-color);">Graph</div>
<p><span class="btn cstyle interactive secondary"><button onclick="window.variants&amp;&amp;variants.getStylesheet();this.blur();" type="button"><i class="fa-fw fas fa-download"></i> <span class="title">Download variant</span></button></span>
<span class="btn cstyle interactive warning"><button onclick="window.variants&amp;&amp;variants.resetVariant();this.blur();" type="button"><i class="fa-fw fas fa-trash"></i> <span class="title">Reset variant</span></button></span></p>
<script>
window.variants && variants.generator( '#R-vargenerator' );
</script>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/tutorial/index.html">Tutorial</a></li>
</ul>
</div>
</footer>
</article>
</section>
<article class="default">
<header class="headline">
</header>
<h1 id="sidebar">Sidebar</h1>
<div class="children children-h2 children-sort-">
<h2><a href="/hugo-theme-relearn/pir/configuration/sidebar/width/index.html">Width</a></h2><p>Chang'n th' width o' th' sidebar</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sidebar/headerfooter/index.html">Header &amp; Footer</a></h2><p>Configure th' header an' footer</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sidebar/search/index.html">Search</a></h2><p>Configure search an' th' search form</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/sidebar/shortcutmenu/index.html">Shortcut Menu</a></h2><p>Add additional shortcut links t' th' sidebar</p>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
<section>
<h1 class="a11y-only">Subsct&#39;ns o&#39; Sidebar</h1>
<article class="default">
<header class="headline">
</header>
<h1 id="width">Width</h1>
<p>Th' theme adjusts th' menu width based on browser size.</p>
<p>If ye want t' change th' chosen default width, ye can add CSS variables t' <code>layouts/partials/custom-header.html</code>.</p>
<h2 id="changing-menu-width">Chang'n Menu Width</h2>
<p>Th' menu width changes fer different screen sizes:</p>
<table>
<thead>
<tr>
<th style="text-align: left">Screen Size</th>
<th style="text-align: left">Screen Width</th>
<th style="text-align: left">Menu Width</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left">Small</td>
<td style="text-align: left">&lt; 48rem</td>
<td style="text-align: left">14.375rem</td>
</tr>
<tr>
<td style="text-align: left">Medium</td>
<td style="text-align: left">48rem - 60rem</td>
<td style="text-align: left">14.375rem</td>
</tr>
<tr>
<td style="text-align: left">Large</td>
<td style="text-align: left">&gt;= 60rem</td>
<td style="text-align: left">18.75rem</td>
</tr>
</tbody>
</table>
<p>Ye can change th' menu width but not th' screen width breakpoints.</p>
<p>T' adjust th' menu width, use these CSS variables. Avast that <code>--MENU-WIDTH-S</code> be fer th' mobile menu flyout on small screens.</p>
<div class="tab-panel" data-tab-group="0b5697419f15ad285d2fc4d35316a1b8">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialscustom-headerhtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('0b5697419f15ad285d2fc4d35316a1b8','layoutspartialscustom-headerhtml')"
>
<span class="tab-nav-text">layouts/partials/custom-header.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialscustom-headerhtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">:</span><span class="nd">root</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nv">--MENU-WIDTH-S</span><span class="p">:</span> <span class="mf">14.375</span><span class="kt">rem</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"> <span class="nv">--MENU-WIDTH-M</span><span class="p">:</span> <span class="mf">14.375</span><span class="kt">rem</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"> <span class="nv">--MENU-WIDTH-L</span><span class="p">:</span> <span class="mf">18.75</span><span class="kt">rem</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="header--footer">Header &amp; Footer</h1>
<h2 id="title">Title</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Wit' th' <a href="/hugo-theme-relearn/pir/configuration/branding/logo/index.html#change-the-logo">default partials</a> fer th' logo, Th' ship title will also be used fer th' text at th' top o' th' sidebar. If ye want t' show a different text 'n th' sidebar, ye can overwrite <code>linkTitle</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">linkTitle</span> <span class="p">=</span> <span class="s1">&#39;Relearn&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">linkTitle</span><span class="p">:</span><span class="w"> </span><span class="l">Relearrrn</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;linkTitle&#34;</span><span class="p">:</span> <span class="s2">&#34;Relearn&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="home-button-configuration">Home Button Configurat'n</h2>
<p>By default, th' theme displays a home button between search form an' navigat'n menu. Th' Home button serves as an alternative t' click'n th' logo.</p>
<p><a href="#R-image-4a0f3a66eebfbc25f0d16344262760bc" class="lightbox-link"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/configuration/sidebar/headerfooter/home_button_defaults.png?width=18.75rem" style=" height: auto; width: 18.75rem;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-4a0f3a66eebfbc25f0d16344262760bc"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/configuration/sidebar/headerfooter/home_button_defaults.png?width=18.75rem"></a></p>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> T' hide th' Home button on th' left menu, set <code>disableLandingPageButton=true</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableLandingPageButton</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableLandingPageButton</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableLandingPageButton&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> T' change its ay'con or text, configure th' <code>landingPageName</code> fer yer defined languages.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">languages</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">landingPageName</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-home&#34;&gt;&lt;/i&gt; Home&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">.</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">landingPageName</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-home&#34;&gt;&lt;/i&gt; Arrr! Homme&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">languages</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">en</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">landingPageName</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-home&#34;&gt;&lt;/i&gt; Home</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pir</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">landingPageName</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-home&#34;&gt;&lt;/i&gt; Arrr! Homme</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languages&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;en&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;landingPageName&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-home\&#34;\u003e\u003c/i\u003e Home&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pir&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;landingPageName&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-home\&#34;\u003e\u003c/i\u003e Arrr! Homme&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>If this opt'n isn&rsquo;t set fer a specific language, it will use these default values</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">landingPageName</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-home&#34;&gt;&lt;/i&gt; Home&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">landingPageName</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-home&#34;&gt;&lt;/i&gt; Home</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;landingPageName&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-home\&#34;\u003e\u003c/i\u003e Home&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="history">History</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Turn on <code>showVisitedLinks=true</code> t' see checkmarks next t' visited planks 'n th' main menu. This also adds a <code>Clear History</code> opt'n at th' bottom o' th' menu t' remove all checkmarks. Avast that checkmarks will disappear if ye rebuild yer ship, as th' plank IDs may change.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">showVisitedLinks</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">showVisitedLinks</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;showVisitedLinks&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="footer">Footer</h2>
<p>T' change th' menu footer, edit th' <code>layouts/partials/menu-footer.html</code> file. Check out th' <a href="/hugo-theme-relearn/pir/configuration/customization/partials/index.html">Partials section</a> fer more ways t' cust'mize yer ship.</p>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="search">Search</h1>
<h2 id="configure-search">Configure Search</h2>
<p>Th' theme offers three levels o' search through th' menu&rsquo;s search form:</p>
<ol>
<li>In-page search: Highlights search terms on th' current plank</li>
<li>Search popup: Opens a popup wit' results from other planks</li>
<li>Dedicated search plank: Access'ble by click'n th' magnifier glass or press'n <kbd>ENTER</kbd></li>
</ol>
<p>Each level requires th' previous one t' be enabled. If no search be configured, th' search form won&rsquo;t appear.</p>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> All levels be enabled by default. Dis'ble them 'n <code>hugo.toml</code>:</p>
<ul>
<li>In-page search: <code>disableSearch=true</code></li>
<li>Search popup: <code>disableSearchIndex=true</code></li>
<li>Dedicated search plank: <code>disableSearchPage=true</code></li>
</ul>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSearch</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSearchIndex</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSearchPage</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSearch</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSearchIndex</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSearchPage</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSearch&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSearchIndex&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSearchPage&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Default URLs can be changed wit' th' follow'n parameter</p>
<ul>
<li>Search popup: <code>searchindex.js</code> set by <code>searchIndexURL</code></li>
<li>Dedicated search plank: <code>search/index.html</code> set by <code>searchPageURL</code></li>
</ul>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">searchIndexURL</span> <span class="p">=</span> <span class="s1">&#39;omnisearchindex.js&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">searchPageURL</span> <span class="p">=</span> <span class="s1">&#39;omnisearch&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">searchIndexURL</span><span class="p">:</span><span class="w"> </span><span class="l">omnisearchindex.js</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">searchPageURL</span><span class="p">:</span><span class="w"> </span><span class="l">omnisearch</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;searchIndexURL&#34;</span><span class="p">:</span> <span class="s2">&#34;omnisearchindex.js&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;searchPageURL&#34;</span><span class="p">:</span> <span class="s2">&#34;omnisearch&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<div class="box notices cstyle note">
<div class="box-label">
<i class="fa-fw fas fa-exclamation-circle"></i> Avast
</div>
<div class="box-content">
<p>Only change these if ye have rrrambl'n at those URLs. This can happen wit' <code>uglyURLs=true</code> 'n <code>hugo.toml</code> an' hav'n a rrrambl'n file at <code>content/search.md</code>.</p>
<p>Check fer duplicate URLs by runn'n <code>hugo --printPathWarn'ns</code>.</p>
</div>
</div>
<h2 id="supported-languages">Supported Languages</h2>
<p>Th' <a href="https://lunrjs.com" rel="external" target="_self">Lunr</a> search library doesn&rsquo;t support all languages o' th' theme. Unsupported languages will show errors 'n th' browser console. Currently unsupported be</p>
<ul>
<li>Czech</li>
<li>Indonesian</li>
<li>Polish</li>
<li>Swahili</li>
</ul>
<h2 id="mixed-language-support">Mixed Language Support</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> In case yer page&rsquo;s rrrambl'n contains text 'n multiple languages (for example, ye be writ'n a Piratish documentat'n fer yer English API), ye can set those languages 'n <code>additionalContentLanguage</code> t' broaden th' search.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">additionalContentLanguage</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;en&#39;</span><span class="p">]</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">additionalContentLanguage</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">en</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;additionalContentLanguage&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;en&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>Ye can add multiple languages t' this array.</p>
<div class="box notices cstyle note">
<div class="box-label">
<i class="fa-fw fas fa-exclamation-circle"></i> Avast
</div>
<div class="box-content">
<p>Use th' base language code. For example, if yer plank be us'n <code>zh-CN</code>, add <code>zh</code> t' this parameter.</p>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="shortcut-menu">Shortcut Menu</h1>
<p>Th' sidebar contains yer content&rsquo;s navigat'n menu, but ye can also add extra menu entries or shortcuts 'n a separate section.</p>
<p>For internal links, use th' <code>pageRef</code> property instead o' <code>url</code>. Learrrn more about <a href="https://gohugo.io/content-management/menus/#define-in-site-configuration" rel="external" target="_self">Hugo&rsquo;s menu configurat'n</a>.</p>
<h2 id="title">Title</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> By default, th' shortcut menu has a title (&quot;<em>More</em>&quot; 'n English).</p>
<p>Ye can dis'ble this title wit' <code>disableShortcutsTitle=true</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableShortcutsTitle</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableShortcutsTitle</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableShortcutsTitle&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>T' change th' title, update yer local i18n translat'n file.</p>
<div class="tab-panel" data-tab-group="a51f010cae4185f4f3a445790b358454">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="i18nentoml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('a51f010cae4185f4f3a445790b358454','i18nentoml')"
>
<span class="tab-nav-text">i18n/en.toml</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="i18nentoml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">Shortcuts-Title</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"><span class="nx">other</span> <span class="p">=</span> <span class="s2">&#34;Other Great Stuff&#34;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><h2 id="single-language-example">Single Language Example</h2>
<p>Edit <code>hugo.toml</code> an' add <code>[[menu.shortcuts]]</code> entries fer each link:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">menu</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;ds&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fab fa-github&#34;&gt;&lt;/i&gt; GitHub Repo&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">&#39;https://github.com/McShelby/hugo-theme-relearn&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">10</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-camera&#34;&gt;&lt;/i&gt; Showcases&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/showcase&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">11</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;hugodoc&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-bookmark&#34;&gt;&lt;/i&gt; Cap'n Hugo Documentation&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">&#39;https://gohugo.io/&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">20</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-bullhorn&#34;&gt;&lt;/i&gt; Credits&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/more/credits&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">30</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-tags&#34;&gt;&lt;/i&gt; Tags&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/tags&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">40</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">menu</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">shortcuts</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">ds</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fab fa-github&#34;&gt;&lt;/i&gt; GitHub Repo</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">url</span><span class="p">:</span><span class="w"> </span><span class="l">https://github.com/McShelby/hugo-theme-relearn</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">10</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-camera&#34;&gt;&lt;/i&gt; Showcases</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/showcase</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">11</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">hugodoc</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-bookmark&#34;&gt;&lt;/i&gt; Cap'n Hugo Documentat'n</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">url</span><span class="p">:</span><span class="w"> </span><span class="l">https://gohugo.io/</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">20</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-bullhorn&#34;&gt;&lt;/i&gt; Credits</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/more/credits</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">30</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-tags&#34;&gt;&lt;/i&gt; Tags</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/tags</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">40</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;menu&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;shortcuts&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;ds&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fab fa-github\&#34;\u003e\u003c/i\u003e GitHub Repo&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;url&#34;</span><span class="p">:</span> <span class="s2">&#34;https://github.com/McShelby/hugo-theme-relearn&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">10</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-camera\&#34;\u003e\u003c/i\u003e Showcases&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/showcase&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">11</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;hugodoc&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-bookmark\&#34;\u003e\u003c/i\u003e Cap'n Hugo Documentation&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;url&#34;</span><span class="p">:</span> <span class="s2">&#34;https://gohugo.io/&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">20</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-bullhorn\&#34;\u003e\u003c/i\u003e Credits&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/more/credits&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">30</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-tags\&#34;\u003e\u003c/i\u003e Tags&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/tags&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">40</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="multilingual-example">Multilingual Example</h2>
<p>For multilingual sites, set different menus fer each language 'n <code>hugo.toml</code>:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">languages</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">languageName</span> <span class="p">=</span> <span class="s1">&#39;English&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;Hugo Relearrrn Theme&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">1</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;ds&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fab fa-github&#34;&gt;&lt;/i&gt; GitHub Repo&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">&#39;https://github.com/McShelby/hugo-theme-relearn&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">10</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-camera&#34;&gt;&lt;/i&gt; Showcases&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/showcase&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">11</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;hugodoc&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-bookmark&#34;&gt;&lt;/i&gt; Cap'n Hugo Documentation&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">&#39;https://gohugo.io/&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">20</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-bullhorn&#34;&gt;&lt;/i&gt; Credits&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/more/credits&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">30</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">en</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-tags&#34;&gt;&lt;/i&gt; Tags&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/tags&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">40</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">languageName</span> <span class="p">=</span> <span class="s1">&#39;Arrr! Pirrratish&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;Captain Hugo Relearrrn Theme&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">2</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">.</span><span class="nx">menu</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;ds&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fab fa-github&#34;&gt;&lt;/i&gt; GitHub Repo&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">&#39;https://github.com/McShelby/hugo-theme-relearn&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">10</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-camera&#34;&gt;&lt;/i&gt; Showcases&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/showcase&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">11</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;hugodoc&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-bookmark&#34;&gt;&lt;/i&gt; Captain Hugo Documentation&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">&#39;https://gohugo.io/&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">20</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-bullhorn&#34;&gt;&lt;/i&gt; Crrredits&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/more/credits&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">30</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">languages</span><span class="p">.</span><span class="nx">pir</span><span class="p">.</span><span class="nx">menu</span><span class="p">.</span><span class="nx">shortcuts</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;&lt;i class=&#34;fa-fw fas fa-tags&#34;&gt;&lt;/i&gt; Arrr! Tags&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">&#39;/tags&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">weight</span> <span class="p">=</span> <span class="mi">40</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">languages</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">en</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">languageName</span><span class="p">:</span><span class="w"> </span><span class="l">English</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">menu</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">shortcuts</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">ds</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fab fa-github&#34;&gt;&lt;/i&gt; GitHub Repo</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">url</span><span class="p">:</span><span class="w"> </span><span class="l">https://github.com/McShelby/hugo-theme-relearn</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">10</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-camera&#34;&gt;&lt;/i&gt; Showcases</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/showcase</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">11</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">hugodoc</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-bookmark&#34;&gt;&lt;/i&gt; Cap'n Hugo Documentat'n</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">url</span><span class="p">:</span><span class="w"> </span><span class="l">https://gohugo.io/</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">20</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-bullhorn&#34;&gt;&lt;/i&gt; Credits</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/more/credits</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">30</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-tags&#34;&gt;&lt;/i&gt; Tags</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/tags</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">40</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">title</span><span class="p">:</span><span class="w"> </span><span class="l">Cap'n Hugo Relearrrn Theme</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">1</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pir</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">languageName</span><span class="p">:</span><span class="w"> </span><span class="l">Arrr! Pirrratish</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">menu</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">shortcuts</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">ds</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fab fa-github&#34;&gt;&lt;/i&gt; GitHub Repo</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">url</span><span class="p">:</span><span class="w"> </span><span class="l">https://github.com/McShelby/hugo-theme-relearn</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">10</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-camera&#34;&gt;&lt;/i&gt; Showcases</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/showcase</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">11</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">hugodoc</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-bookmark&#34;&gt;&lt;/i&gt; Captain Hugo Documentat'n</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">url</span><span class="p">:</span><span class="w"> </span><span class="l">https://gohugo.io/</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">20</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-bullhorn&#34;&gt;&lt;/i&gt; Crrredits</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/more/credits</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">30</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">&lt;i class=&#34;fa-fw fas fa-tags&#34;&gt;&lt;/i&gt; Arrr! Tags</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">pageRef</span><span class="p">:</span><span class="w"> </span><span class="l">/tags</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">40</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">title</span><span class="p">:</span><span class="w"> </span><span class="l">Captain Hugo Relearrrn Theme</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">weight</span><span class="p">:</span><span class="w"> </span><span class="m">2</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languages&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;en&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languageName&#34;</span><span class="p">:</span> <span class="s2">&#34;English&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;menu&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;shortcuts&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;ds&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fab fa-github\&#34;\u003e\u003c/i\u003e GitHub Repo&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;url&#34;</span><span class="p">:</span> <span class="s2">&#34;https://github.com/McShelby/hugo-theme-relearn&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">10</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-camera\&#34;\u003e\u003c/i\u003e Showcases&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/showcase&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">11</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;hugodoc&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-bookmark\&#34;\u003e\u003c/i\u003e Cap'n Hugo Documentation&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;url&#34;</span><span class="p">:</span> <span class="s2">&#34;https://gohugo.io/&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">20</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-bullhorn\&#34;\u003e\u003c/i\u003e Credits&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/more/credits&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">30</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-tags\&#34;\u003e\u003c/i\u003e Tags&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/tags&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">40</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;title&#34;</span><span class="p">:</span> <span class="s2">&#34;Hugo Relearrrn Theme&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">1</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pir&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;languageName&#34;</span><span class="p">:</span> <span class="s2">&#34;Arrr! Pirrratish&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;menu&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;shortcuts&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;ds&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fab fa-github\&#34;\u003e\u003c/i\u003e GitHub Repo&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;url&#34;</span><span class="p">:</span> <span class="s2">&#34;https://github.com/McShelby/hugo-theme-relearn&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">10</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-camera\&#34;\u003e\u003c/i\u003e Showcases&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/showcase&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">11</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;hugodoc&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-bookmark\&#34;\u003e\u003c/i\u003e Captain Hugo Documentation&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;url&#34;</span><span class="p">:</span> <span class="s2">&#34;https://gohugo.io/&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">20</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-bullhorn\&#34;\u003e\u003c/i\u003e Crrredits&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/more/credits&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">30</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003ci class=\&#34;fa-fw fas fa-tags\&#34;\u003e\u003c/i\u003e Arrr! Tags&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;pageRef&#34;</span><span class="p">:</span> <span class="s2">&#34;/tags&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">40</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;title&#34;</span><span class="p">:</span> <span class="s2">&#34;Captain Hugo Relearrrn Theme&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;weight&#34;</span><span class="p">:</span> <span class="mi">2</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="displaying-pages-only-in-the-shortcuts-menu">Display'n Planks Only 'n th' Shortcuts Menu</h2>
<p>T' show planks only 'n th' shortcuts menu ye have two choices</p>
<ol>
<li>
<p>Create a <a href="https://gohugo.io/content-management/page-bundles/#headless-bundle" rel="external" target="_self">headless branch bundle</a>, <code>_index.md</code> 'n its own folder wit' th' below front matter. Th' branch bundle will <strong>not</strong> be contained 'n th' sitemap.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">content/showcase/_index.en.md</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="err">+++</span>
</span></span><span class="line"><span class="cl"><span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;Showcase&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">[</span><span class="nx">_build</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">list</span> <span class="p">=</span> <span class="s1">&#39;never&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">publishResources</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">render</span> <span class="p">=</span> <span class="s1">&#39;always&#39;</span>
</span></span><span class="line"><span class="cl"><span class="err">+++</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nn">---</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nt">_build</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">list</span><span class="p">:</span><span class="w"> </span><span class="l">never</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">publishResources</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">render</span><span class="p">:</span><span class="w"> </span><span class="l">always</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nt">title</span><span class="p">:</span><span class="w"> </span><span class="l">Showcase</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nn">---</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;_build&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;list&#34;</span><span class="p">:</span> <span class="s2">&#34;never&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;publishResources&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;render&#34;</span><span class="p">:</span> <span class="s2">&#34;always&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;title&#34;</span><span class="p">:</span> <span class="s2">&#34;Showcase&#34;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
</li>
<li>
<p>Or, put a child plank inside a headless branch bundle wit' th' follow'n front matter 'n th' bundle. This causes th' child but not th' branch bundle t' be contained 'n th' sitemap.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">content/more/_index.en.md</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="err">+++</span>
</span></span><span class="line"><span class="cl"><span class="p">[</span><span class="nx">_build</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">list</span> <span class="p">=</span> <span class="s1">&#39;never&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">publishResources</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">render</span> <span class="p">=</span> <span class="s1">&#39;never&#39;</span>
</span></span><span class="line"><span class="cl"><span class="err">+++</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nn">---</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nt">_build</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">list</span><span class="p">:</span><span class="w"> </span><span class="l">never</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">publishResources</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">render</span><span class="p">:</span><span class="w"> </span><span class="l">never</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nn">---</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;_build&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;list&#34;</span><span class="p">:</span> <span class="s2">&#34;never&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;publishResources&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;render&#34;</span><span class="p">:</span> <span class="s2">&#34;never&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>Th' child plank can be any type o' rrrambl'n.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">content/more/credits_index.en.md</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="err">+++</span>
</span></span><span class="line"><span class="cl"><span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;Credits&#39;</span>
</span></span><span class="line"><span class="cl"><span class="err">+++</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nn">---</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nt">title</span><span class="p">:</span><span class="w"> </span><span class="l">Credits</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><span class="nn">---</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;title&#34;</span><span class="p">:</span> <span class="s2">&#34;Credits&#34;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
</li>
</ol>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
</section>
<article class="default">
<header class="headline">
</header>
<h1 id="content">Content</h1>
<div class="children children-h2 children-sort-">
<h2><a href="/hugo-theme-relearn/pir/configuration/content/width/index.html">Width</a></h2><p>Chang'n th' rrrambl'n area width</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/content/titles/index.html">Titles &amp; Breadcrumbs</a></h2><p>Configur'n titles an' breadcrumbs t' yer needs</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/content/headings/index.html">Head'ns</a></h2><p>Configur'n head'n anchors</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/content/linking/index.html">Link'n</a></h2><p>What opt'ns be avail'ble fer links an' images</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/content/hidden/index.html">Hidden Planks</a></h2><p>Learrrn about th' hidden planks feature</p>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
<section>
<h1 class="a11y-only">Subsct&#39;ns o&#39; Content</h1>
<article class="default">
<header class="headline">
</header>
<h1 id="width">Width</h1>
<p>Th' theme adjusts th' rrrambl'n width when ye resize yer browser.</p>
<p>If ye want t' change th' chosen default width, ye can add CSS variables t' <code>layouts/partials/custom-header.html</code>.</p>
<h2 id="changing-the-main-areas-maximum-width">Chang'n th' Main Area&rsquo;s Maximum Width</h2>
<p>Th' main area has a default maximum width o' <code>80.25rem</code> fer better readability. If ye want t' change this, ye can set a CSS vari'ble</p>
<p>For full width, use a large value like <code>1000rem</code>.</p>
<div class="tab-panel" data-tab-group="09eb959b16fd344741851552e6ee8fb4">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialscustom-headerhtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('09eb959b16fd344741851552e6ee8fb4','layoutspartialscustom-headerhtml')"
>
<span class="tab-nav-text">layouts/partials/custom-header.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialscustom-headerhtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">:</span><span class="nd">root</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nv">--MAIN-WIDTH-MAX</span><span class="p">:</span> <span class="mi">1000</span><span class="kt">rem</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="titles--breadcrumbs">Titles &amp; Breadcrumbs</h1>
<h2 id="breadcrumbs">Breadcrumbs</h2>
<p>Learrrn how t' turn off th' breadcrumbs completely an' further <a href="/hugo-theme-relearn/pir/authoring/frontmatter/topbar/index.html">configure th' topbar</a>.</p>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Set <code>disableRootBreadcrumb=true</code> t' remove th' root breadcrumb which often feels redundant. This will also apply t' th' breadcrumbs o' th' search results an' taxonomy planks.</p>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Ye can override th' default breadcrumb separator by us'n <code>breadcrumbSeparator='/'</code>. This separator will also be used 'n th' breadcrumbs o' th' search results an' taxonomy planks.</p>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> By default th' term planks o' a taxonomy will display th' breadcrumb fer each plank. Set <code>disableTermBreadcrumbs=true</code> t' remove th' breadcrumb if th' term planks look t' cluttered.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">breadcrumbSeparator</span> <span class="p">=</span> <span class="s1">&#39;/&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableRootBreadcrumb</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableTermBreadcrumbs</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">breadcrumbSeparator</span><span class="p">:</span><span class="w"> </span><span class="l">/</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableRootBreadcrumb</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableTermBreadcrumbs</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;breadcrumbSeparator&#34;</span><span class="p">:</span> <span class="s2">&#34;/&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableRootBreadcrumb&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableTermBreadcrumbs&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="titles">Titles</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Ye can override th' default title separator by us'n <code>titleSeparator='|'</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">titleSeparator</span> <span class="p">=</span> <span class="s1">&#39;|&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">titleSeparator</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;|&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;titleSeparator&#34;</span><span class="p">:</span> <span class="s2">&#34;|&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="headings">Headings</h1>
<p>Head'ns can have anchor links that appear when ye hover over them.</p>
<p>Ye can change what happens when ye click th' anchor ay'con 'n yer <code>hugo.toml</code> file. By default, all opt'ns be turned on. If ye turn off all opt'ns, no anchor ay'con will show up when ye hover.</p>
<h2 id="copy-anchor-links">Copy Anchor Links</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Set <code>disableAnchorCopy=true</code> t' prevent copy'n th' anchor link when ye click th' ay'con.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableAnchorCopy</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableAnchorCopy</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableAnchorCopy&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="scroll-to-heading">Scroll t' Head'n</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Set <code>disableAnchorScrolling=true</code> t' stop th' plank from scroll'n t' th' head'n when ye click th' anchor ay'con.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableAnchorScroll'n</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableAnchorScroll'n</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableAnchorScrolling&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="linking">Linking</h1>
<p>Further <a href="/hugo-theme-relearn/pir/authoring/frontmatter/linking/index.html">sett'ns be avail'ble</a> t' be used 'n yer configurat'n or front matter.</p>
<h2 id="url-management">URL Management</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> By default, th' theme adds <code>index.html</code> t' plank links when <code>uglyURLs=false</code> (Hugo&rsquo;s default).</p>
<p>If you&rsquo;re only us'n a web server scenario an' dislike this, ye can reset t' Hugo&rsquo;s default behavior by sett'ns <code>disableExplicitIndexURLs=true</code>.</p>
<p>For th' file system scenario, ye be not allowed t' change this value.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableExplicitIndexURLs</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableExplicitIndexURLs</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableExplicitIndexURLs&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="patching-the-relref-shortcode">Patch'n th' <code>relref</code> Shortcode</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> While th' usage o' <code>relref</code> be obsolete an' discouraged by Cap'n Hugo fer a while, exist'n installat'ns may still use it.</p>
<p>In configurat'ns us'n a <strong>baseURL</strong> wit' a <strong>subdirectory</strong> an' hav'n <strong>relativeURLs=false</strong> (the default), Hugos standard <code>relref</code> implementat'n be fail'n.</p>
<p>T' work around this, ye can activate a patched version o' th' shortcode by sett'n <code>disableDefaultRelref=true</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableDefaultRelref</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableDefaultRelref</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableDefaultRelref&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="hidden-pages">Hidden Pages</h1>
<p>This theme allows ye t' <a href="/hugo-theme-relearn/pir/authoring/meta/index.html#hidden">create hidden planks</a>.</p>
<p>Hidden planks be created but not shown 'n th' navigat'n. This be useful fer planks ye only want t' access via a direct link.</p>
<p>When ye visit a hidden page&rsquo;s URL, it will appear 'n th' navigat'n menu.</p>
<p>Hidden planks can also have hidden subpages, creat'n multiple levels o' hid'n.</p>
<p>By default, hidden planks be only hidden from human visitors. Search engines can still find them by crawl'n yer ship an' th' planks be linked 'n yer taxonomies an' ship search. Ye can prevent this wit' these opt'ns.</p>
<h2 id="hide-from-search">Hide from Search</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> T' remove hidden planks from search results, use <code>disableSearchHiddenPages=true</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSearchHiddenPages</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSearchHiddenPages</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSearchHiddenPages&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="hide-from-search-engines">Hide from Search Engines</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> T' hide planks from search engines by remov'n them from th' sitemap, RSS feed an' <a href="https://developers.google.com/search/docs/crawling-indexing/robots-meta-tag#directives" rel="external" target="_self">make them <code>nofollow</code></a>, use <code>disableSeoHiddenPages=true</code>.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSeoHiddenPages</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSeoHiddenPages</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSeoHiddenPages&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="hide-from-taxonomies">Hide from Taxonomies</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> T' prevent hidden planks from appear'n on taxonomy an' term planks, use <code>disableTagHiddenPages=true</code>. If this makes a term&rsquo;s count zero, an empty term plank will still be created but not linked.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableTagHiddenPages</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableTagHiddenPages</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableTagHiddenPages&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
</section>
<article class="default">
<header class="headline">
</header>
<h1 id="customization">Customization</h1>
<div class="children children-h2 children-sort-">
<h2><a href="/hugo-theme-relearn/pir/configuration/customization/partials/index.html">Partials</a></h2><p>Modify'n partials t' yer needs</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/customization/dependencies/index.html">Extend'n Scripts</a></h2><p>Add further code t' yer ship</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/customization/imageeffects/index.html">Image Effects</a></h2><p>How t' extend image effects</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/customization/topbar/index.html">Topbar</a></h2><p>How t' extend th' topbar</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/customization/designs/index.html">Plank Designs</a></h2><p>Extend'n plank designs</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/customization/outputformats/index.html">Output Formats</a></h2><p>Add'n Custom Output Formats</p>
<h2><a href="/hugo-theme-relearn/pir/configuration/customization/taxonomy/index.html">Taxonomies</a></h2><p>How t' display custom taxonomies on yer planks</p>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
<section>
<h1 class="a11y-only">Subsct&#39;ns o&#39; Customization</h1>
<article class="default">
<header class="headline">
</header>
<h1 id="partials">Partials</h1>
<h2 id="usable-partials">Us'ble Partials</h2>
<p>Ye can call other partials from <code>themes/hugo-relearn-themes/</code> besides those 'n <code>themes/hugo-relearn-themes/layouts/partials/_relearn</code>. However, us'n partials not mentioned as customiz'ble below might make future updates more challeng'n.</p>
<h2 id="customizable-partials">Customiz'ble Partials</h2>
<p>Th' Relearrrn theme allows ye t' cust'mize various parts o' th' theme by overrid'n partials. This makes th' theme highly configur'ble.</p>
<p>A bloody rule t' follow: Th' less code a partial contains, th' easier it will be t' update th' theme 'n th' future.</p>
<p>Here&rsquo;s a list o' partials ye can safely override:</p>
<ul>
<li>
<p><code>layouts/partials/content.html</code>: Th' main rrrambl'n o' a plank. Override this t' display additonal plank metadata.</p>
</li>
<li>
<p><code>layouts/partials/content-header.html</code>: Th' header above th' title. By default, it shows tags, but ye can change this.</p>
</li>
<li>
<p><code>layouts/partials/content-footer.html</code>: Th' footer below th' rrrambl'n. By default, it shows author info, modificat'n dates, an' categories. Ye can cust'mize this.</p>
</li>
<li>
<p><code>layouts/partials/custom-header.html</code>: For add'n custom CSS. Remember t' include th' <code>style</code> HTML tag.</p>
</li>
<li>
<p><code>layouts/partials/custom-footer.html</code>: For add'n custom JavaScript. Remember t' include th' <code>script</code> HTML tag.</p>
</li>
<li>
<p><code>layouts/partials/favicon.html</code>: Th' favicon. Ye should definitely cust'mize this.</p>
</li>
<li>
<p><code>layouts/partials/head'n.html</code>: th' page&rsquo;s title head'ns</p>
</li>
<li>
<p><code>layouts/partials/heading-pre.html</code>: Add rrrambl'n before th' page&rsquo;s title head'ns. Remember t' consider th' <code>headingPre</code> front matter.</p>
</li>
<li>
<p><code>layouts/partials/heading-post.html</code>: Add rrrambl'n after th' page&rsquo;s title head'ns. Remember t' consider th' <code>headingPost</code> front matter.</p>
</li>
<li>
<p><code>layouts/partials/logo.html</code>: Th' logo 'n th' top left corner. Ye should cust'mize this.</p>
</li>
<li>
<p><code>layouts/partials/menu-pre.html</code>: Add rrrambl'n before menu items. Remember t' consider th' <code>menuPre</code> front matter.</p>
</li>
<li>
<p><code>layouts/partials/menu-post.html</code>: Add rrrambl'n after menu items. Remember t' consider th' <code>menuPost</code> front matter.</p>
</li>
<li>
<p><code>layouts/partials/menu-footer.html</code>: Th' footer o' th' left menu.</p>
</li>
</ul>
<p>Ye can override other partials from <code>themes/hugo-relearn-themes/</code>, but be careful as this might make future updates more difficult.</p>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="extending-scripts">Extending Scripts</h1>
<p>A common quest'n be how t' add extra CSS styles or JavaScript t' yer ship. This depends on what ye need.</p>
<h2 id="adding-javascript-or-stylesheets-to-all-pages">Add'n JavaScript or Stylesheets t' All Planks</h2>
<p>T' add JavaScript files or CSS stylesheets t' every plank, ye can include them 'n <code>layouts/partials/custom-header.html</code> or <code>layouts/partials/custom-footer.html</code>.</p>
<p>However, this can make yer ship larger than necessary if these files be only needed on a few planks. Th' next section explains how t' add dependencies only when needed.</p>
<h2 id="custom-shortcodes-with-dependencies">Custom Shorrrtcodes wit' Dependencies</h2>
<p>Some shorrrtcodes need extra JavaScript an' CSS files. Th' theme only loads these when th' shortcode be used. Ye can use this fer yer own shorrrtcodes too.</p>
<p>For example, t' create a shortcode called <code>myshortcode</code> that needs th' <code>jquery</code> library:</p>
<ol>
<li>
<p>Create th' shortcode file <code>layouts/shortcodes/myshortcode.html</code> an' add th' follog'n line somewhere:</p>
<div class="tab-panel" data-tab-group="371520f2c2a714f13ab62a0bc7088a86">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutsshortcodesmyshortcodehtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('371520f2c2a714f13ab62a0bc7088a86','layoutsshortcodesmyshortcodehtml')"
>
<span class="tab-nav-text">layouts/shortcodes/myshortcode.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutsshortcodesmyshortcodehtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="o">...</span>
</span></span><span class="line"><span class="cl"><span class="p">{{</span><span class="o">-</span> <span class="p">.</span><span class="nx">Plank</span><span class="p">.</span><span class="nx">Store</span><span class="p">.</span><span class="nx">Set</span> <span class="s">&#34;hasMyShortcode&#34;</span> <span class="kc">true</span> <span class="p">}}</span>
</span></span><span class="line"><span class="cl"><span class="o">...</span></span></span></code></pre></div>
</div>
</div>
</div>
</div></li>
<li>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Add this t' yer <code>hugo.toml</code>:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">relearn</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">relearn</span><span class="p">.</span><span class="nx">dependencies</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">relearn</span><span class="p">.</span><span class="nx">dependencies</span><span class="p">.</span><span class="nx">myshortcode</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;MyShortcode&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">relearn</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">dependencies</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">myshortcode</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">MyShortcode</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;relearn&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;dependencies&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;myshortcode&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;MyShortcode&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
</li>
<li>
<p>Create loader file <code>layouts/partials/dependencies/myshortcode.html</code>:</p>
<div class="tab-panel" data-tab-group="8899e782dbc5cd78cbc5d6bd687713cb">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialsdependenciesmyshortcodehtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('8899e782dbc5cd78cbc5d6bd687713cb','layoutspartialsdependenciesmyshortcodehtml')"
>
<span class="tab-nav-text">layouts/partials/dependencies/myshortcode.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialsdependenciesmyshortcodehtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span><span class="o">-</span> <span class="k">if</span> <span class="nx">eq</span> <span class="p">.</span><span class="nx">locat'n</span> <span class="s">&#34;footer&#34;</span> <span class="p">}}</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nx">script</span> <span class="nx">src</span><span class="p">=</span><span class="s">&#34;https://www.unpkg.com/jquery/dist/jquery.js&#34;</span><span class="p">&gt;&lt;</span><span class="o">/</span><span class="nx">script</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">{{</span><span class="o">-</span> <span class="nx">end</span> <span class="p">}}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div></li>
</ol>
<p>Important notes:</p>
<ul>
<li>Character cas'n be relevant!</li>
<li>Th' <code>name</code> 'n <code>hugo.toml</code> must match th' <code>Store</code> key used 'n th' shortcode file, prefixed wit' a <code>has</code>.</li>
<li>Th' key o' <code>relearn.dependencies</code> must match th' loader file name.</li>
</ul>
<p>See th' <code>math</code>, <code>mermaid</code>, an' <code>openapi</code> shorrrtcodes fer examples.</p>
<div class="box notices cstyle note">
<div class="box-label">
<i class="fa-fw fas fa-exclamation-circle"></i> Avast
</div>
<div class="box-content">
<p>For advanced customizat'n, ye can use th' dependency loader 'n yer own partials:</p>
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span><span class="o">-</span> <span class="nx">partial</span> <span class="s">&#34;dependencies.gotmpl&#34;</span> <span class="p">(</span><span class="nx">dict</span> <span class="s">&#34;page&#34;</span> <span class="p">.</span> <span class="s">&#34;location&#34;</span> <span class="s">&#34;mylocation&#34;</span><span class="p">)</span> <span class="p">}}</span></span></span></code></pre></div>
</div>
</div>
<p>Give a unique name fer th' <code>locat'n</code> parameter when ye call it, so ye can distinguish yer loaders behavior depend'n on th' locat'n it was called from.</p>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="image-effects">Image Effects</h1>
<p>This plank shows ye, how t' configure custom <a href="/hugo-theme-relearn/pir/authoring/markdown/index.html#image-effects">image effects</a> on top o' exist'n ones.</p>
<p>This sett'n can also <a href="/hugo-theme-relearn/pir/authoring/imageeffects/index.html">be overridden by yer front matter</a>.</p>
<p>If ye don&rsquo;t configure anyth'n 'n yer <code>hugo.toml</code>, th' image effects default t'</p>
<h2 id="default-values">Default Values</h2>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">imageEffects</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">border</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">lazy</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">lightbox</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">shadow</span> <span class="p">=</span> <span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">imageEffects</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">border</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">lazy</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">lightbox</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">shadow</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;imageEffects&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;border&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;lazy&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;lightbox&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;shadow&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="configuration">Configurat'n</h2>
<p><span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> Ye can change these sett'ns 'n yer <code>hugo.toml</code> an' add arbitrary custom effects as boolean values (like <code>bg-white</code> 'n th' below snippet).</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">imageEffects</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">bg-white</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">border</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">lazy</span> <span class="p">=</span> <span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">imageEffects</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">bg-white</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">border</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">lazy</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;imageEffects&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;bg-white&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;border&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;lazy&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<p>This would result 'n</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">imageEffects</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">bg-white</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">border</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">lazy</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">lightbox</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">shadow</span> <span class="p">=</span> <span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">imageEffects</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">bg-white</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">border</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">lazy</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">lightbox</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">shadow</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;imageEffects&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;bg-white&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;border&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;lazy&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;lightbox&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;shadow&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h3 id="example">Example</h3>
<p>Wit' this configurat'n 'n effect, th' follow'n URL</p>
<div class="tab-panel" data-tab-group="8ac02f00f234e657eabc4cbbba839e0c">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="markdown"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('8ac02f00f234e657eabc4cbbba839e0c','markdown')"
>
<span class="tab-nav-text">Marrrkdown</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="markdown"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-markdown" data-lang="markdown"><span class="line"><span class="cl">![<span class="nt">Minion</span>](<span class="na">https://octodex.github.com/images/minion.png</span>)</span></span></code></pre></div>
</div>
</div>
</div>
</div><p>would result 'n</p>
<div class="tab-panel" data-tab-group="520c2d95aaa2afc1bfa356c293ae2082">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="html"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('520c2d95aaa2afc1bfa356c293ae2082','html')"
>
<span class="tab-nav-text">HTML</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="html"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">img</span> <span class="na">src</span><span class="o">=</span><span class="s">&#34;https://octodex.github.com/images/minion.png&#34;</span> <span class="na">load'n</span><span class="o">=</span><span class="s">&#34;lazy&#34;</span> <span class="na">alt</span><span class="o">=</span><span class="s">&#34;Minion&#34;</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;bg-white border nolazy lightbox noshadow&#34;</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><h2 id="styling-effects">Styl'n Effects</h2>
<p>If th' result'n effect value be</p>
<ul>
<li><code>true</code>: add a class wit' th' effect&rsquo;s name</li>
<li><code>false</code>: add a class wit' th' effect&rsquo;s name an' a &ldquo;no&rdquo; prefix</li>
</ul>
<p>Styles fer default effects be contained 'n th' theme. Add styles fer yer custom effects t' <code>layouts/partials/content-header.html</code>.</p>
<p>For th' above example ye could add styles fer both boolean cases:</p>
<div class="tab-panel" data-tab-group="62b9ef3d8d1ceb2743b2c64b05595112">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialscontent-headerhtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('62b9ef3d8d1ceb2743b2c64b05595112','layoutspartialscontent-headerhtml')"
>
<span class="tab-nav-text">layouts/partials/content-header.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialscontent-headerhtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="nt">img</span><span class="p">.</span><span class="nc">bg-white</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="k">background-color</span><span class="p">:</span> <span class="kc">white</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="nt">img</span><span class="p">.</span><span class="nc">nobg-white</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="k">background-color</span><span class="p">:</span> <span class="kc">transparent</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="topbarrr">Topbarrr</h1>
<p>Th' theme comes wit' a reasonably configured topbar. Ye can learn how t' <a href="/hugo-theme-relearn/pir/authoring/frontmatter/topbar/index.html">configure th' defaults 'n this section</a>.</p>
<p><a href="#R-image-499734f97dc01a7effe31728588f6d0c" class="lightbox-link"><img alt="topbar on mobile devices" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/configuration/customization/topbar/topbar-closed.png" style=" height: auto; width: auto;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-499734f97dc01a7effe31728588f6d0c"><img alt="topbar on mobile devices" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/configuration/customization/topbar/topbar-closed.png"></a></p>
<p>Nevertheless, yer requirements may differ from this configurat'n. Luckily, th' theme has ye covered as th' topbar, its buttons, an' th' functionality behind these buttons be fully configur'ble by ye.</p>
<div class="box notices cstyle tip">
<div class="box-label">
<i class="fa-fw fas fa-lightbulb"></i> Smarrrt Arrrse
</div>
<div class="box-content">
<p>All mentioned file names below can be clicked an' show ye th' implementat'n fer a better understand'n.</p>
</div>
</div>
<h2 id="areas">Areas</h2>
<p>Th' default configurat'n comes wit' three predefined areas that may contain an arbitrary set o' buttons.</p>
<p><a href="#R-image-6c03ce592267370d21b9241f8622e307" class="lightbox-link"><img alt="topbar wit' default areas marked" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/configuration/customization/topbar/topbar-areas.png" style=" height: auto; width: auto;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-6c03ce592267370d21b9241f8622e307"><img alt="topbar wit' default areas marked" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/configuration/customization/topbar/topbar-areas.png"></a></p>
<ul>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/area/start.html" rel="external" target="_self"><strong>start</strong></a>: shown between menu an' breadcrumb</li>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/area/end.html" rel="external" target="_self"><strong>end</strong></a>: shown on th' opposite breadcrumb side 'n comparison t' th' <em>start</em> area</li>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/area/more.html" rel="external" target="_self"><strong>more</strong></a>: shown when press'n th' <span class="btn cstyle transparent"><span><i class="fa-fw fas fa-ellipsis-v"></i></span></span> <em>more</em> button 'n th' topbar</li>
</ul>
<p>While ye cannot add additional areas 'n th' topbar, ye be free t' configure additional buttons that behave like th' <em>more</em> button, provid'n further user-defined areas.</p>
<h2 id="buttons">Buttons</h2>
<p>Th' theme ships wit' th' follow'n predefined buttons (from left t' right 'n th' screenshot):</p>
<ul>
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-bars"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/sidebar.html" rel="external" target="_self"><strong>sidebar</strong></a>: opens th' sidebar flyout if 'n mobile layout</li>
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-list-alt"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/toc.html" rel="external" target="_self"><strong>toc</strong></a>: <a href="/hugo-theme-relearn/pir/authoring/frontmatter/topbar/index.html#table-of-contents">opens th' t'ble o' contents 'n an overlay</a></li>
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-pen"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/edit.html" rel="external" target="_self"><strong>edit</strong></a>: browses t' th' edit'ble plank if th' <code>editURL</code> <a href="/hugo-theme-relearn/pir/authoring/frontmatter/topbar/index.html#edit-button">parameter be set</a></li>
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-print"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/print.html" rel="external" target="_self"><strong>print</strong></a>: browses t' th' chapter&rsquo;s print'ble plank if <a href="/hugo-theme-relearn/pir/configuration/sitemanagement/outputformats/index.html#print-support">print support</a> was activated</li>
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-chevron-left"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/prev.html" rel="external" target="_self"><strong>prev</strong></a>: browses t' th' <a href="/hugo-theme-relearn/pir/authoring/frontmatter/topbar/index.html#arrow-navigation">previous plank</a> if there be one</li>
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-chevron-right"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/next.html" rel="external" target="_self"><strong>next</strong></a>: browses t' th' [next page]authoring/frontmatter/topbar(#arrow-navigation) if there be one</li>
<li><span class="btn cstyle transparent"><span><i class="fa-fw fas fa-ellipsis-v"></i></span></span> <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/more.html" rel="external" target="_self"><strong>more</strong></a>: opens th' overlay fer th' <em>more</em> area</li>
</ul>
<p>Not all buttons be displayed at every given time. This be configur'ble (see below if interested).</p>
<h2 id="redefining-areas">Redefin'n Areas</h2>
<p>Each predefined area an' button comes 'n its own file. By that, it be easy fer ye t' overwrite an area file 'n yer installat'n, reus'n only th' buttons ye like.</p>
<p>E.g., ye can redefine th' predefined <em>end</em> area by add'n th' file <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/area/end.html" rel="external" target="_self"><code>layouts/partials/topbar/area/end.html</code></a> 'n yer installat'n (not 'n th' theme itself) t' remove all but th' <em>more</em> button.</p>
<p>Th' below example sets an explicit value fer th' <code>onempty</code> parameter, overrid'n th' specific default value fer this button (these defaults vary depend'n on th' button). Th' parameter causes th' <em>more</em> button t' always be displayed instead o' hid'n once its rrrambl'n be empty.</p>
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span> <span class="nx">partial</span> <span class="s">&#34;topbar/button/more.html&#34;</span> <span class="p">(</span><span class="nx">dict</span>
</span></span><span class="line"><span class="cl"> <span class="s">&#34;page&#34;</span> <span class="p">.</span>
</span></span><span class="line"><span class="cl"> <span class="s">&#34;onempty&#34;</span> <span class="s">&#34;disable&#34;</span>
</span></span><span class="line"><span class="cl"><span class="p">)}}</span></span></span></code></pre></div>
<h2 id="defining-own-buttons">Defin'n Own Buttons</h2>
<h3 id="button-types">Button Types</h3>
<p>Th' theme distinguishes between two types o' buttons:</p>
<ul>
<li><a href="/hugo-theme-relearn/pir/configuration/customization/topbar/index.html#button"><strong>button</strong></a>: a click'ble button that either browses t' another ship, triggers a user-defined script or opens an overlay contain'n user-defined rrrambl'n</li>
<li><a href="/hugo-theme-relearn/pir/configuration/customization/topbar/index.html#area-button"><strong>area-button</strong></a>: th' template fer th' <span class="btn cstyle transparent"><span><i class="fa-fw fas fa-ellipsis-v"></i></span></span> <em>more</em> button, t' define yer own area overlay buttons</li>
</ul>
<h3 id="button-parameter">Button Parameter</h3>
<h4 id="screen-widths-and-actions">Screen Widths an' Act'ns</h4>
<p>Depend'n on th' screen width, ye can configure how th' button should behave. Screen width be divided into three classes:</p>
<ul>
<li><strong>s</strong>: (controlled by th' <code>onwidths</code> parameter) mobile layout whar' th' menu sidebar be hidden</li>
<li><strong>m</strong>: (controlled by th' <code>onwidthm</code> parameter) desktop layout wit' vis'ble sidebar while th' rrrambl'n area width still resizes</li>
<li><strong>l</strong>: (controlled by th' <code>onwidthl</code> parameter) desktop layout wit' vis'ble sidebar once th' rrrambl'n area reached its maximum width</li>
</ul>
<p>For each width class, ye can configure one o' th' follow'n act'ns:</p>
<ul>
<li><code>show</code>: th' button be displayed 'n its given area</li>
<li><code>hide</code>: th' button be removed</li>
<li><code>area-XXX</code>: th' button be moved from its given area into th' area <code>XXX</code>; fer example, this be used t' move buttons t' th' <em>more</em> area overlay 'n th' mobile layout</li>
</ul>
<h4 id="hiding-and-disabling-stuff">Hid'n an' Disabl'n Stuff</h4>
<p>While hid'n a button depend'n on th' screen size can be configured wit' th' above-described <em>hide</em> act'n, ye may want t' hide th' button on certain other condit'ns as well.</p>
<p>For example, th' <em>print</em> button 'n its default configurat'n should only be displayed if print support was configured. This be done 'n yer button template by check'n th' condit'ns first before display'n th' button (see <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/print.html" rel="external" target="_self"><code>layouts/partials/topbar/button/print.html</code></a>).</p>
<p>Another preferred condit'n fer hid'n a button be if th' displayed overlay be empty. This be th' case fer th' <em>toc</em> (see <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/toc.html" rel="external" target="_self"><code>layouts/partials/topbar/button/toc.html</code></a>) as well as th' <em>more</em> button (see <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/more.html" rel="external" target="_self"><code>layouts/partials/topbar/button/more.html</code></a>) an' controlled by th' parameter <code>onempty</code>.</p>
<p>This parameter can have one o' th' follow'n values:</p>
<ul>
<li><code>dis'ble</code>: th' button be displayed 'n a disabled state if th' overlay be empty</li>
<li><code>hide</code>: th' button be removed if th' overlay be empty</li>
</ul>
<p>If ye want t' dis'ble a button contain'n <em>no overlay</em>, this can be achieved by an empty <code>href</code> parameter. An example can be seen 'n th' <em>prev</em> button (see <code>layouts/partials/topbar/button/prev.html</code>) whar' th' URL fer th' previous ship may be empty.</p>
<h2 id="reference">Reference</h2>
<h3 id="button">Button</h3>
<p>Contains th' basic button functionality an' be used as a base implementat'n fer all other buttons (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/func/button.html" rel="external" target="_self"><code>layouts/partials/topbar/func/button.html</code></a>).</p>
<p>Call this from yer own button templates if ye want t' implement a button without an overlay like th' <em>print</em> button (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/print.html" rel="external" target="_self"><code>layouts/partials/topbar/button/print.html</code></a>) or wit' an overlay contain'n arbitrary rrrambl'n like th' <em>toc</em> button (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/toc.html" rel="external" target="_self"><code>layouts/partials/topbar/button/toc.html</code></a>).</p>
<p>For display'n an area 'n th' button&rsquo;s overlay, see <a href="/hugo-theme-relearn/pir/configuration/customization/topbar/index.html#area-button">Area-Button</a>.</p>
<h4 id="parameter">Parameter</h4>
<table>
<thead>
<tr>
<th style="text-align: left">Name</th>
<th style="text-align: left">Default</th>
<th style="text-align: left">Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left"><strong>plank</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Mandatory reference t' th' plank.</td>
</tr>
<tr>
<td style="text-align: left"><strong>class</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Mandatory unique class name fer this button. Display'n two buttons wit' th' same value fer <strong>class</strong> be undefined.</td>
</tr>
<tr>
<td style="text-align: left"><strong>href</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Either th' destinat'n URL fer th' button or JavaScript code t' be executed on click.<br><br>- If start'n wit' <code>javascript:</code> all follow'n text will be executed 'n yer browser<br>- Every other str'n will be interpreted as URL<br>- If empty, th' button will be displayed 'n a disabled state regardless o' its <strong>rrrambl'n</strong></td>
</tr>
<tr>
<td style="text-align: left"><strong>ay'con</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left"><a href="/hugo-theme-relearn/pir/shortcodes/icon/index.html#finding-an-icon">Font Awesome ay'con name</a>.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onempty</strong></td>
<td style="text-align: left"><code>dis'ble</code></td>
<td style="text-align: left">Defines what t' do wit' th' button if th' rrrambl'n parameter was set but ends up empty:<br><br>- <code>dis'ble</code>: Th' button be displayed 'n a disabled state.<br>- <code>hide</code>: Th' button be removed.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidths</strong></td>
<td style="text-align: left"><code>show</code></td>
<td style="text-align: left">Th' act'n that should be executed if th' ship be displayed 'n th' given width:<br><br>- <code>show</code>: Th' button be displayed 'n its given area<br>- <code>hide</code>: Th' button be removed.<br>- <code>area-XXX</code>: Th' button be moved from its given area into th' area <code>XXX</code>.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidthm</strong></td>
<td style="text-align: left"><code>show</code></td>
<td style="text-align: left">See above.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidthl</strong></td>
<td style="text-align: left"><code>show</code></td>
<td style="text-align: left">See above.</td>
</tr>
<tr>
<td style="text-align: left"><strong>hint</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Arbitrary text displayed 'n th' tooltip.</td>
</tr>
<tr>
<td style="text-align: left"><strong>title</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Arbitrary text fer th' button.</td>
</tr>
<tr>
<td style="text-align: left"><strong>rrrambl'n</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Arbitrary HTML t' put into th' rrrambl'n overlay. This parameter may be empty. In this case, no overlay will be generated.</td>
</tr>
</tbody>
</table>
<h3 id="area-button">Area-Button</h3>
<p>Contains th' basic functionality t' display area overlay buttons (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/func/area-button.html" rel="external" target="_self"><code>layouts/partials/topbar/func/area-button.html</code></a>).</p>
<p>Call this from yer own button templates if ye want t' implement a button wit' an area overlay like th' <em>more</em> button (<a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button/more.html" rel="external" target="_self"><code>layouts/partials/topbar/button/more.html</code></a>).</p>
<h4 id="parameter-1">Parameter</h4>
<table>
<thead>
<tr>
<th style="text-align: left">Name</th>
<th style="text-align: left">Default</th>
<th style="text-align: left">Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left"><strong>plank</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Mandatory reference t' th' plank.</td>
</tr>
<tr>
<td style="text-align: left"><strong>area</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Mandatory unique area name fer this area. Display'n two areas wit' th' same value fer <strong>area</strong> be undefined.</td>
</tr>
<tr>
<td style="text-align: left"><strong>ay'con</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left"><a href="/hugo-theme-relearn/pir/shortcodes/icon/index.html#finding-an-icon">Font Awesome ay'con name</a>.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onempty</strong></td>
<td style="text-align: left"><code>dis'ble</code></td>
<td style="text-align: left">Defines what t' do wit' th' button if th' rrrambl'n overlay be empty:<br><br>- <code>dis'ble</code>: Th' button be displayed 'n a disabled state.<br>- <code>hide</code>: Th' button be removed.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidths</strong></td>
<td style="text-align: left"><code>show</code></td>
<td style="text-align: left">Th' act'n that should be executed if th' ship be displayed 'n th' given width:<br><br>- <code>show</code>: Th' button be displayed 'n its given area<br>- <code>hide</code>: Th' button be removed.<br>- <code>area-XXX</code>: Th' button be moved from its given area into th' area <code>XXX</code>.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidthm</strong></td>
<td style="text-align: left"><code>show</code></td>
<td style="text-align: left">See above.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidthl</strong></td>
<td style="text-align: left"><code>show</code></td>
<td style="text-align: left">See above.</td>
</tr>
<tr>
<td style="text-align: left"><strong>hint</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Arbitrary text displayed 'n th' tooltip.</td>
</tr>
<tr>
<td style="text-align: left"><strong>title</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Arbitrary text fer th' button.</td>
</tr>
</tbody>
</table>
<h3 id="predefined-buttons">Predefined Buttons</h3>
<p>Th' predefined buttons by th' theme (all other buttons besides th' <em>more</em> an' <em>toc</em> button 'n <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button" rel="external" target="_self"><code>layouts/partials/topbar/button</code></a>).</p>
<p>Call these from yer own redefined area templates if ye want t' use default button behavior.</p>
<p>Th' <em>&lt;varying&gt;</em> parameter values be different fer each button an' configured fer standard behavior as seen on this plank.</p>
<h4 id="parameter-2">Parameter</h4>
<table>
<thead>
<tr>
<th style="text-align: left">Name</th>
<th style="text-align: left">Default</th>
<th style="text-align: left">Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left"><strong>plank</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Mandatory reference t' th' plank.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidths</strong></td>
<td style="text-align: left"><em>&lt;varying&gt;</em></td>
<td style="text-align: left">Th' act'n that should be executed if th' ship be displayed 'n th' given width:<br><br>- <code>show</code>: Th' button be displayed 'n its given area<br>- <code>hide</code>: Th' button be removed.<br>- <code>area-XXX</code>: Th' button be moved from its given area into th' area <code>XXX</code>.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidthm</strong></td>
<td style="text-align: left"><em>&lt;varying&gt;</em></td>
<td style="text-align: left">See above.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidthl</strong></td>
<td style="text-align: left"><em>&lt;varying&gt;</em></td>
<td style="text-align: left">See above.</td>
</tr>
</tbody>
</table>
<h3 id="predefined-overlay-buttons">Predefined Overlay-Buttons</h3>
<p>Th' predefined buttons by th' theme that open an overlay (the <em>more</em> an' <em>toc</em> button 'n <a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/partials/topbar/button" rel="external" target="_self"><code>layouts/partials/topbar/button</code></a>).</p>
<p>Call these from yer own redefined area templates if ye want t' use default button behavior utiliz'n overlay functionality.</p>
<p>Th' <em>&lt;varying&gt;</em> parameter values be different fer each button an' configured fer standard behavior as seen on this plank.</p>
<h4 id="parameter-3">Parameter</h4>
<table>
<thead>
<tr>
<th style="text-align: left">Name</th>
<th style="text-align: left">Default</th>
<th style="text-align: left">Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left"><strong>plank</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Mandatory reference t' th' plank.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onempty</strong></td>
<td style="text-align: left"><code>dis'ble</code></td>
<td style="text-align: left">Defines what t' do wit' th' button if th' rrrambl'n overlay be empty:<br><br>- <code>dis'ble</code>: Th' button be displayed 'n a disabled state.<br>- <code>hide</code>: Th' button be removed.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidths</strong></td>
<td style="text-align: left"><em>&lt;varying&gt;</em></td>
<td style="text-align: left">Th' act'n that should be executed if th' ship be displayed 'n th' given width:<br><br>- <code>show</code>: Th' button be displayed 'n its given area<br>- <code>hide</code>: Th' button be removed.<br>- <code>area-XXX</code>: Th' button be moved from its given area into th' area <code>XXX</code>.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidthm</strong></td>
<td style="text-align: left"><em>&lt;varying&gt;</em></td>
<td style="text-align: left">See above.</td>
</tr>
<tr>
<td style="text-align: left"><strong>onwidthl</strong></td>
<td style="text-align: left"><em>&lt;varying&gt;</em></td>
<td style="text-align: left">See above.</td>
</tr>
</tbody>
</table>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="page-designs">Page Designs</h1>
<p>A plank be displayed by exactly one plank design. Th' Relearrrn theme offers th' plank designs <code>home</code>, <code>chapter</code>, an' <code>default</code>.</p>
<p>A plank design usually consists o'</p>
<ul>
<li><a href="https://gohugo.io/content-management/archetypes/" rel="external" target="_self">an archetype file</a>: a template fer creat'n new Marrrkdown files wit' this design</li>
<li><a href="https://gohugo.io/templates/types/#content-view" rel="external" target="_self">rrrambl'n view files</a>: represented by <a href="https://gohugo.io/content-management/front-matter/#type" rel="external" target="_self">Hugo&rsquo;s reserved <code>type</code> front matter</a> an' backed by match'n partials</li>
<li>CSS styles</li>
</ul>
<p>If no <code>type</code> be set 'n yer front matter, th' plank be treated as if <code>type='default'</code> was set.</p>
<div class="box notices cstyle warning">
<div class="box-label">
<i class="fa-fw fas fa-exclamation-triangle"></i> Arrr
</div>
<div class="box-content">
<p>Don&rsquo;t use th' <code>type</code> opt'n 'n yer modificat'ns fer other functionality!</p>
</div>
</div>
<p>All shipped designs use th' theme&rsquo;s framework from <code>themes/hugo-theme-learn/layouts/_default/baseof.html</code>, contain'n o' th' same topbar an' sidebar but can change how rrrambl'n appears 'n th' center o' th' plank.</p>
<h2 id="using-a-page-design">Us'n a Plank Design</h2>
<p>Regardless o' shipped or custom plank design, ye be <a href="/hugo-theme-relearn/pir/authoring/frontmatter/designs/index.html">us'n them</a> 'n th' same way.</p>
<h2 id="creating-a-page-designs">Creat'n a Plank Designs</h2>
<p>T' make a custom plank design:</p>
<ol>
<li>
<p>Choose a name (for example, <code>mydesign</code>)</p>
</li>
<li>
<p>Create a rrrambl'n view file at <code>layouts/mydesign/views/article.html</code></p>
<div class="tab-panel" data-tab-group="522fc3a71ccc7b5d121bd4b22ea33903">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutsmydesignviewsarticlehtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('522fc3a71ccc7b5d121bd4b22ea33903','layoutsmydesignviewsarticlehtml')"
>
<span class="tab-nav-text">layouts/mydesign/views/article.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutsmydesignviewsarticlehtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">article</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;mydesign&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">header</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;headline&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl">{{ partial &#34;content-header.html&#34; . }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">header</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">div</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;article-subheading&#34;</span><span class="p">&gt;</span>AWESOME<span class="p">&lt;/</span><span class="nt">div</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl">{{ partial &#34;heading-pre.html&#34; . }}{{ partial &#34;head'n.html&#34; . }}{{ partial &#34;heading-post.html&#34; . }}
</span></span><span class="line"><span class="cl">{{ partial &#34;article-content.html&#34; . }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">footer</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;footline&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl">{{ partial &#34;content-footer.html&#34; . }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">footer</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">article</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><p>In this file, ye can cust'mize th' plank design as needed. Typically, you&rsquo;ll want t':</p>
<ul>
<li>Set a <code>class</code> at th' <code>article</code> element fer custom CSS styles</li>
<li>Use <code>{{ partial &quot;article-content.html&quot; . }}</code> t' show yer plank rrrambl'n</li>
</ul>
</li>
<li>
<p>Create an archetype file at <code>archetypes/mydesign.md</code> (optional)</p>
<div class="tab-panel" data-tab-group="6c49c9650f70453a9b9c68a8a454c307">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="archetypesmydesignmd"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('6c49c9650f70453a9b9c68a8a454c307','archetypesmydesignmd')"
>
<span class="tab-nav-text">archetypes/mydesign.md</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="archetypesmydesignmd"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl">+++
</span></span><span class="line"><span class="cl">title = &#34;{{ replace .Name &#34;-&#34; &#34; &#34; | title }}&#34;
</span></span><span class="line"><span class="cl">type = &#34;mydesign&#34;
</span></span><span class="line"><span class="cl">+++
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl">This be my new design.</span></span></code></pre></div>
</div>
</div>
</div>
</div></li>
<li>
<p>Add CSS 'n file <code>layouts/partials/custom-header.html</code> (optional)</p>
<div class="tab-panel" data-tab-group="51707173bd464a2fb7ced601b540224a">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialscustom-headerhtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('51707173bd464a2fb7ced601b540224a','layoutspartialscustom-headerhtml')"
>
<span class="tab-nav-text">layouts/partials/custom-header.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialscustom-headerhtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">mydesign</span> <span class="p">.</span><span class="nc">article-subhead'n</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="k">font-size</span><span class="p">:</span> <span class="mi">72</span><span class="kt">rem</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">.</span><span class="nc">mydesign</span> <span class="nt">a</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="k">background-color</span><span class="p">:</span> <span class="kc">pink</span><span class="p">;</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div></li>
</ol>
<h3 id="partials">Partials</h3>
<p>Th' above example uses <code>layouts/mydesign/views/article.html</code> but ye have some others</p>
<ul>
<li><code>layouts/mydesign/baseof.html</code>: Completely redefine th' whole HTML structure, none o' th' other listed partials will be used</li>
<li><code>layouts/mydesign/views/menu.html</code>: Defines th' sidebar menu layout</li>
<li><code>layouts/mydesign/views/body.html</code>: Determines what t' contain 'n th' rrrambl'n area (for example a single plank, a list o' planks, a tree o' sub pages)</li>
<li><code>layouts/mydesign/views/article.html</code>: Controls how one page&rsquo;s rrrambl'n an' title be displayed</li>
</ul>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
</header>
<h1 id="output-formats">Output Formats</h1>
<p>In addit'n t' th' <a href="/hugo-theme-relearn/pir/configuration/sitemanagement/outputformats/index.html">output formats com'n wit' th' theme</a>, ye can create yer own <a href="https://gohugo.io/templates/output-formats/" rel="external" target="_self">output formats</a>.</p>
<h2 id="starting-from-scratch">Start'n from Scratch</h2>
<p>If ye want t' add a new output format called <code>myformat</code> that outputs HTML an' ye want t' build everyth'n yourself without us'n th' theme&rsquo;s components:</p>
<ol>
<li>Create a file <code>layouts/_default/baseof.myformat.html</code></li>
<li>Implement all th' necessary code 'n this file</li>
</ol>
<h2 id="using-the-themes-structure">Us'n th' Theme&rsquo;s Structure</h2>
<p>If ye want t' keep th' general framework an' only change specific parts, ye can override these files:</p>
<ul>
<li><code>layouts/_default/views/article.html</code>: Controls how a page&rsquo;s rrrambl'n an' title be displayed</li>
<li><code>layouts/_default/views/body.html</code>: Determines th' plank body structure</li>
<li><code>layouts/_default/views/menu.html</code>: Defines th' sidebar menu layout</li>
<li><code>layouts/_default/views/storeOutputFormat.html</code>: Stores th' output format name fer use 'n th' framework</li>
</ul>
<p>For a real-world example, check out th' <code>print</code> output format implementat'ns</p>
<ul>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/views/body.print.html" rel="external" target="_self"><code>layouts/_default/views/body.print.html</code></a></li>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/views/menu.print.html" rel="external" target="_self"><code>layouts/_default/views/menu.print.html</code></a></li>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/views/storeOutputFormat.print.html" rel="external" target="_self"><code>layouts/_default/views/storeOutputFormat.print.html</code></a></li>
</ul>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
<article class="default">
<header class="headline">
<div class="R-taxonomy taxonomy-tags cstyle tags" title="Tag-a-taggs" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/tags/taxonomy/index.html">Taxonomy</a></li>
</ul>
</div>
</header>
<h1 id="taxonomies">Taxonomies</h1>
<p>This plank explains how t' show custom taxonomies on yer planks.</p>
<p>For more details, check th' official docs on <a href="https://gohugo.io/content-management/taxonomies/#configure-taxonomies" rel="external" target="_self">sett'n up custom taxonomies</a> an' <a href="https://gohugo.io/content-management/taxonomies/#assign-terms-to-content" rel="external" target="_self">us'n them 'n yer rrrambl'n</a>.</p>
<h2 id="default-behavior">Default Behavior</h2>
<p>Th' Relearrrn theme automatically shows Hugo&rsquo;s <a href="https://gohugo.io/content-management/taxonomies/#default-taxonomies" rel="external" target="_self">default taxonomies</a> <em>tags</em> an' <em>categories</em> out o' th' box.</p>
<ul>
<li>Tags appear at th' top o' th' plank 'n alphabetical order 'n form o' baggage tags.</li>
<li>Categories appear at th' bottom o' th' plank 'n alphabetical order as a list prefixed wit' an ay'con.</li>
</ul>
<p>Each item links t' a plank show'n all articles wit' that term.</p>
<h2 id="setting-up-custom-taxonomies">Sett'n Up Custom Taxonomies</h2>
<p>T' add custom taxonomies, update yer <code>hugo.toml</code> file. Ye also have t' add th' default taxonomies if ye want t' use them.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">taxonomies</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">category</span> <span class="p">=</span> <span class="s1">&#39;categories&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">mycustomtag</span> <span class="p">=</span> <span class="s1">&#39;mycustomtags&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">tag</span> <span class="p">=</span> <span class="s1">&#39;tags&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">taxonomies</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">category</span><span class="p">:</span><span class="w"> </span><span class="l">categories</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">mycustomtag</span><span class="p">:</span><span class="w"> </span><span class="l">mycustomtags</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">tag</span><span class="p">:</span><span class="w"> </span><span class="l">tags</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;taxonomies&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;category&#34;</span><span class="p">:</span> <span class="s2">&#34;categories&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;mycustomtag&#34;</span><span class="p">:</span> <span class="s2">&#34;mycustomtags&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;tag&#34;</span><span class="p">:</span> <span class="s2">&#34;tags&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="showing-custom-taxonomies">Show'n Custom Taxonomies</h2>
<p>T' display yer custom taxonomy terms, add this t' yer plank (usually 'n <code>layouts/partials/content-footer.html</code>):</p>
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span> <span class="nx">partial</span> <span class="s">&#34;term-list.html&#34;</span> <span class="p">(</span><span class="nx">dict</span>
</span></span><span class="line"><span class="cl"> <span class="s">&#34;page&#34;</span> <span class="p">.</span>
</span></span><span class="line"><span class="cl"> <span class="s">&#34;taxonomy&#34;</span> <span class="s">&#34;mycustomtags&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="s">&#34;icon&#34;</span> <span class="s">&#34;layer-group&#34;</span>
</span></span><span class="line"><span class="cl"><span class="p">)</span> <span class="p">}}</span></span></span></code></pre></div>
<h3 id="parameter">Parameter</h3>
<table>
<thead>
<tr>
<th style="text-align: left">Name</th>
<th style="text-align: left">Default</th>
<th style="text-align: left">Notes</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left"><strong>plank</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Mandatory reference t' th' plank.</td>
</tr>
<tr>
<td style="text-align: left"><strong>taxonomy</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Th' plural name o' th' taxonomy t' display as used 'n yer front matter.</td>
</tr>
<tr>
<td style="text-align: left"><strong>class</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">Additional CSS classes set on th' outermost generated HTML element.<br><br>If set t' <code>tags</code> ye will get th' visuals fer display'n th' <em>tags</em> taxonomy, otherwise it will be a simple list o' links as fer th' <em>categories</em> taxonomy.</td>
</tr>
<tr>
<td style="text-align: left"><strong>style</strong></td>
<td style="text-align: left"><code>primary</code></td>
<td style="text-align: left">Th' style scheme used if <strong>class</strong> be <code>tags</code>.<br><br>- by severity: <code>caut'n</code>, <code>important</code>, <code>info</code>, <code>note</code>, <code>tip</code>, <code>warning</code><br>- by brand color: <code>primary</code>, <code>secondary</code>, <code>accent</code><br>- by color: <code>blue</code>, <code>cyan</code>, <code>green</code>, <code>grey</code>, <code>magenta</code>, <code>orange</code>, <code>red</code><br>- by special color: <code>default</code>, <code>transparent</code>, <code>code</code></td>
</tr>
<tr>
<td style="text-align: left"><strong>color</strong></td>
<td style="text-align: left">see notes</td>
<td style="text-align: left">Th' <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color_value" rel="external" target="_self">CSS color value</a> t' be used if <strong>class</strong> be <code>tags</code>. If not set, th' chosen color depends on th' <strong>style</strong>. Any given value will overwrite th' default.<br><br>- fer severity styles: a nice match'n color fer th' severity<br>- fer all other styles: th' correspond'n color</td>
</tr>
<tr>
<td style="text-align: left"><strong>ay'con</strong></td>
<td style="text-align: left"><em>&lt;empty&gt;</em></td>
<td style="text-align: left">An optional <a href="/hugo-theme-relearn/pir/shortcodes/icon/index.html#finding-an-icon">Font Awesome ay'con name</a> set t' th' left o' th' list.</td>
</tr>
</tbody>
</table>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
</section>
<article class="default">
<header class="headline">
</header>
<h1 id="options-reference">Options Reference</h1>
<p>This plank explains how t' configure th' Relearrrn theme 'n yer <code>hugo.toml</code> file.</p>
<p>In addit'n t' <a href="https://gohugo.io/getting-started/configuration/#all-configuration-settings" rel="external" target="_self">Hugo&rsquo;s standard opt'ns</a>, th' Relearrrn theme offers extra sett'ns listed here.</p>
<p>Throughout th' documentat'n, theme-specific opt'ns be marked wit' a <span class="badge cstyle cyan badge-with-title"><span class="badge-title"><i class="fa-fw fas fa-gears"></i></span><span class="badge-content">Opt'n</span></span> badge.</p>
<p>Add theme opt'ns t' th' <code>params</code> section o' yer <code>hugo.toml</code>. For example:</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">math</span> <span class="p">=</span> <span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">math</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;math&#34;</span><span class="p">:</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="index">Index</h2>
<h3 id="a">A</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/additionalcontentlanguage/index.html">AdditionalContentLanguage</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/alwaysopen/index.html">Alwaysopen</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/author.email/index.html">Author.email</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/author.name/index.html">Author.name</a> (1)</li>
</ul>
<h3 id="b">B</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/boxstyle/index.html">BoxStyle</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/breadcrumbseparator/index.html">BreadcrumbSeparator</a> (1)</li>
</ul>
<h3 id="c">C</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/collapsiblemenu/index.html">CollapsibleMenu</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/custommathjaxurl/index.html">CustomMathJaxURL</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/custommermaidurl/index.html">CustomMermaidURL</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/customopenapiurl/index.html">CustomOpenapiURL</a> (1)</li>
</ul>
<h3 id="d">D</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/disableanchorcopy/index.html">DisableAnchorCopy</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disableanchorscrolling/index.html">DisableAnchorScroll'n</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disableassetsbusting/index.html">DisableAssetsBust'n</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablebreadcrumb/index.html">DisableBreadcrumb</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disabledefaultrelref/index.html">DisableDefaultRelref</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disableexplicitindexurls/index.html">DisableExplicitIndexURLs</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablegeneratorversion/index.html">DisableGeneratorVersion</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablehoverblockcopytoclipboard/index.html">DisableHoverBlockCopyToClipBoard</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disableinlinecopytoclipboard/index.html">DisableInlineCopyToClipBoard</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablelandingpagebutton/index.html">DisableLandingPageButton</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablelanguageswitchingbutton/index.html">DisableLanguageSwitchingButton</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablenextprev/index.html">DisableNextPrev</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablerandomids/index.html">DisableRandomIds</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablerootbreadcrumb/index.html">DisableRootBreadcrumb</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablesearch/index.html">DisableSearch</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablesearchhiddenpages/index.html">DisableSearchHiddenPages</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablesearchindex/index.html">DisableSearchIndex</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disablesearchpage/index.html">DisableSearchPage</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disableseohiddenpages/index.html">DisableSeoHiddenPages</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disableshortcutstitle/index.html">DisableShortcutsTitle</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disabletaghiddenpages/index.html">DisableTagHiddenPages</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disabletermbreadcrumbs/index.html">DisableTermBreadcrumbs</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/disabletoc/index.html">DisableToc</a> (1)</li>
</ul>
<h3 id="e">E</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/editurl/index.html">EditURL</a> (2)</li>
<li><a href="/hugo-theme-relearn/pir/options/externallinktarget/index.html">ExternalLinkTarget</a> (1)</li>
</ul>
<h3 id="h">H</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/highlightwrap/index.html">HighlightWrap</a> (1)</li>
</ul>
<h3 id="i">I</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/image.errorlevel/index.html">Image.errorlevel</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/imageeffects/index.html">ImageEffects</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/include.errorlevel/index.html">Include.errorlevel</a> (1)</li>
</ul>
<h3 id="l">L</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/landingpagename/index.html">LandingPageName</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/link.errorlevel/index.html">Link.errorlevel</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/linktitle/index.html">LinkTitle</a> (1)</li>
</ul>
<h3 id="m">M</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/math/index.html">Math</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/math.force/index.html">Math.force</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/mathjaxinitialize/index.html">MathJaxInitialize</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/mermaid.force/index.html">Merrrmaid.force</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/mermaidinitialize/index.html">MermaidInitialize</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/mermaidzoom/index.html">MermaidZoom</a> (1)</li>
</ul>
<h3 id="o">O</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/openapi.errorlevel/index.html">Openapi.errorlevel</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/openapi.force/index.html">Openapi.force</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/ordersectionsby/index.html">Ordersectionsby</a> (2)</li>
</ul>
<h3 id="r">R</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/relearn.dependencies/index.html">Relearrrn.dependencies</a> (1)</li>
</ul>
<h3 id="s">S</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/searchindexurl/index.html">SearchIndexURL</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/searchpageurl/index.html">SearchPageURL</a> (1)</li>
<li><a href="/hugo-theme-relearn/pir/options/showvisitedlinks/index.html">ShowVisitedLinks</a> (1)</li>
</ul>
<h3 id="t">T</h3>
<ul class="columnize">
<li><a href="/hugo-theme-relearn/pir/options/themevariant/index.html">ThemeVariant</a> (2)</li>
<li><a href="/hugo-theme-relearn/pir/options/titleseparator/index.html">TitleSeparator</a> (1)</li>
</ul>
<h2 id="all-configuration-options">All Configurat'n Opt'ns</h2>
<p>Here&rsquo;s a list o' all avail'ble opt'ns wit' example values. Default values be described 'n th' <a href="/hugo-theme-relearn/pir/configuration/reference/index.html#annotated-configuration-options">annotated example</a> below 'n each option&rsquo;s documentat'n.</p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">additionalContentLanguage</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;en&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">alwaysopen</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">breadcrumbSeparator</span> <span class="p">=</span> <span class="s1">&#39;&gt;&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">collapsibleMenu</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">customMathJaxURL</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">customMermaidURL</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">customOpenapiURL</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableAnchorCopy</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableAnchorScroll'n</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableAssetsBust'n</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableBreadcrumb</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableDefaultRelref</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableExplicitIndexURLs</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableGeneratorVersion</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableHoverBlockCopyToClipBoard</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableInlineCopyToClipBoard</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableLandingPageButton</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableLanguageSwitchingButton</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableNextPrev</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableRandomIds</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableRootBreadcrumb</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSearch</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSearchHiddenPages</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSearchIndex</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSearchPage</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableSeoHiddenPages</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableShortcutsTitle</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableTagHiddenPages</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableTermBreadcrumbs</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">disableToc</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">editURL</span> <span class="p">=</span> <span class="s1">&#39;https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">externalLinkTarget</span> <span class="p">=</span> <span class="s1">&#39;_self&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">highlightWrap</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">images</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;images/hero.png&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">linkTitle</span> <span class="p">=</span> <span class="s1">&#39;Relearn&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">math</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="nx">mathJaxInitialize</span> <span class="p">=</span> <span class="s1">&#39;{}&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">mermaidInitialize</span> <span class="p">=</span> <span class="s1">&#39;{ &#34;securityLevel&#34;: &#34;loose&#34; }&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">mermaidZoom</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">ordersectionsby</span> <span class="p">=</span> <span class="s1">&#39;weight&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">searchIndexURL</span> <span class="p">=</span> <span class="s1">&#39;searchindex.js&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">searchPageURL</span> <span class="p">=</span> <span class="s1">&#39;search&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">showVisitedLinks</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">titleSeparator</span> <span class="p">=</span> <span class="s1">&#39;::&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">author</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Sören Weber&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">boxStyle</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">color</span> <span class="p">=</span> <span class="s1">&#39;gold&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">i18n</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">ay'con</span> <span class="p">=</span> <span class="s1">&#39;rainbow&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;magic&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;Magic&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">image</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">errorlevel</span> <span class="p">=</span> <span class="s1">&#39;error&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">imageEffects</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">border</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">lazy</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">lightbox</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">shadow</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">include</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">errorlevel</span> <span class="p">=</span> <span class="s1">&#39;error&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">link</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">errorlevel</span> <span class="p">=</span> <span class="s1">&#39;error&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">mermaid</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">force</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">openapi</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">errorlevel</span> <span class="p">=</span> <span class="s1">&#39;error&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">oppenapi</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">force</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">params</span><span class="p">.</span><span class="nx">social</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">facebook_admin</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">twitter</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-auto&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Relearn Light/Dark&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-light&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-dark&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-bright&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;zen-light&#39;</span><span class="p">,</span> <span class="s1">&#39;zen-dark&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-auto&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Zen Light/Dark&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-light&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-dark&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;learn&#39;</span><span class="p">,</span> <span class="s1">&#39;neon&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;retro-auto&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Retro Learn/Neon&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;neon&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;learn&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;blue&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;green&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">[[</span><span class="nx">params</span><span class="p">.</span><span class="nx">themeVariant</span><span class="p">]]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;red&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">params</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">additionalContentLanguage</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">en</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">alwaysopen</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">author</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">Sören Weber</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">boxStyle</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">color</span><span class="p">:</span><span class="w"> </span><span class="l">gold</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">i18n</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">ay'con</span><span class="p">:</span><span class="w"> </span><span class="l">rainbow</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">magic</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">title</span><span class="p">:</span><span class="w"> </span><span class="l">Magic</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">breadcrumbSeparator</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;&gt;&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">collapsibleMenu</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">customMathJaxURL</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">customMermaidURL</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">customOpenapiURL</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableAnchorCopy</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableAnchorScroll'n</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableAssetsBust'n</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableBreadcrumb</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableDefaultRelref</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableExplicitIndexURLs</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableGeneratorVersion</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableHoverBlockCopyToClipBoard</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableInlineCopyToClipBoard</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableLandingPageButton</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableLanguageSwitchingButton</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableNextPrev</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableRandomIds</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableRootBreadcrumb</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSearch</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSearchHiddenPages</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSearchIndex</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSearchPage</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableSeoHiddenPages</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableShortcutsTitle</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableTagHiddenPages</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableTermBreadcrumbs</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">disableToc</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">editURL</span><span class="p">:</span><span class="w"> </span><span class="l">https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">externalLinkTarget</span><span class="p">:</span><span class="w"> </span><span class="l">_self</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">highlightWrap</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">image</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">errorlevel</span><span class="p">:</span><span class="w"> </span><span class="l">error</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">imageEffects</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">border</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">lazy</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">lightbox</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">shadow</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">images</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">images/hero.png</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">include</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">errorlevel</span><span class="p">:</span><span class="w"> </span><span class="l">error</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">link</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">errorlevel</span><span class="p">:</span><span class="w"> </span><span class="l">error</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">linkTitle</span><span class="p">:</span><span class="w"> </span><span class="l">Relearrrn</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">math</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">mathJaxInitialize</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;{}&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">mermaid</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">force</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">mermaidInitialize</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;{ &#34;securityLevel&#34;: &#34;loose&#34; }&#39;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">mermaidZoom</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">openapi</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">errorlevel</span><span class="p">:</span><span class="w"> </span><span class="l">error</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">oppenapi</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">force</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">ordersectionsby</span><span class="p">:</span><span class="w"> </span><span class="l">weight</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">searchIndexURL</span><span class="p">:</span><span class="w"> </span><span class="l">searchindex.js</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">searchPageURL</span><span class="p">:</span><span class="w"> </span><span class="l">search</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">showVisitedLinks</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">social</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">facebook_admin</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">twitter</span><span class="p">:</span><span class="w"> </span><span class="s2">&#34;&#34;</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">themeVariant</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">auto</span><span class="p">:</span><span class="w"> </span><span class="p">[]</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-auto</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">Relearrrn Light/Dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">relearn-bright</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">auto</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">zen-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">zen-dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">zen-auto</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">Zen Light/Dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">zen-light</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">zen-dark</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">auto</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">learn</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">neon</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">retro-auto</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">name</span><span class="p">:</span><span class="w"> </span><span class="l">Retro Learn/Neon</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">neon</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">learn</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">blue</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">green</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="nt">identifier</span><span class="p">:</span><span class="w"> </span><span class="l">red</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">titleSeparator</span><span class="p">:</span><span class="w"> </span><span class="s1">&#39;::&#39;</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;params&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;additionalContentLanguage&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;en&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;alwaysopen&#34;</span><span class="p">:</span> <span class="s2">&#34;&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;author&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;Sören Weber&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;boxStyle&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;color&#34;</span><span class="p">:</span> <span class="s2">&#34;gold&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;i18n&#34;</span><span class="p">:</span> <span class="s2">&#34;&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;icon&#34;</span><span class="p">:</span> <span class="s2">&#34;rainbow&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;magic&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;title&#34;</span><span class="p">:</span> <span class="s2">&#34;Magic&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;breadcrumbSeparator&#34;</span><span class="p">:</span> <span class="s2">&#34;\u003e&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;collapsibleMenu&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;customMathJaxURL&#34;</span><span class="p">:</span> <span class="s2">&#34;&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;customMermaidURL&#34;</span><span class="p">:</span> <span class="s2">&#34;&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;customOpenapiURL&#34;</span><span class="p">:</span> <span class="s2">&#34;&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableAnchorCopy&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableAnchorScrolling&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableAssetsBusting&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableBreadcrumb&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableDefaultRelref&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableExplicitIndexURLs&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableGeneratorVersion&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableHoverBlockCopyToClipBoard&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableInlineCopyToClipBoard&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableLandingPageButton&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableLanguageSwitchingButton&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableNextPrev&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableRandomIds&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableRootBreadcrumb&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSearch&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSearchHiddenPages&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSearchIndex&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSearchPage&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableSeoHiddenPages&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableShortcutsTitle&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableTagHiddenPages&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableTermBreadcrumbs&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;disableToc&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;editURL&#34;</span><span class="p">:</span> <span class="s2">&#34;https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;externalLinkTarget&#34;</span><span class="p">:</span> <span class="s2">&#34;_self&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;highlightWrap&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;image&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;errorlevel&#34;</span><span class="p">:</span> <span class="s2">&#34;error&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;imageEffects&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;border&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;lazy&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;lightbox&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;shadow&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;images&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;images/hero.png&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;include&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;errorlevel&#34;</span><span class="p">:</span> <span class="s2">&#34;error&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;link&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;errorlevel&#34;</span><span class="p">:</span> <span class="s2">&#34;error&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;linkTitle&#34;</span><span class="p">:</span> <span class="s2">&#34;Relearn&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;math&#34;</span><span class="p">:</span> <span class="kc">false</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;mathJaxInitialize&#34;</span><span class="p">:</span> <span class="s2">&#34;{}&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;mermaid&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;force&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;mermaidInitialize&#34;</span><span class="p">:</span> <span class="s2">&#34;{ \&#34;securityLevel\&#34;: \&#34;loose\&#34; }&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;mermaidZoom&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;openapi&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;errorlevel&#34;</span><span class="p">:</span> <span class="s2">&#34;error&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;oppenapi&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;force&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;ordersectionsby&#34;</span><span class="p">:</span> <span class="s2">&#34;weight&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;searchIndexURL&#34;</span><span class="p">:</span> <span class="s2">&#34;searchindex.js&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;searchPageURL&#34;</span><span class="p">:</span> <span class="s2">&#34;search&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;showVisitedLinks&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;social&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;facebook_admin&#34;</span><span class="p">:</span> <span class="s2">&#34;&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;twitter&#34;</span><span class="p">:</span> <span class="s2">&#34;&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;themeVariant&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;auto&#34;</span><span class="p">:</span> <span class="p">[],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-auto&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;Relearn Light/Dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-light&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;relearn-bright&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;auto&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;zen-light&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;zen-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;zen-auto&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;Zen Light/Dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;zen-light&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;zen-dark&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;auto&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;learn&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;neon&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;retro-auto&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;Retro Learn/Neon&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;neon&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;learn&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;blue&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;green&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;identifier&#34;</span><span class="p">:</span> <span class="s2">&#34;red&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;titleSeparator&#34;</span><span class="p">:</span> <span class="s2">&#34;::&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<h2 id="annotated-configuration-options">Annotated Configurat'n Opt'ns</h2>
<div class="tab-panel" data-tab-group="bff458b2dcae7467091a6d54fdcdce6b">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="hugotoml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('bff458b2dcae7467091a6d54fdcdce6b','hugotoml')"
>
<span class="tab-nav-text">hugo.toml</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="hugotoml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">params</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"><span class="c"># If an opt'n value be said t' be not set, ye can achieve th' same behavior</span>
</span></span><span class="line"><span class="cl"><span class="c"># by giv'n it an empty str'n value.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">###############################################################################</span>
</span></span><span class="line"><span class="cl"><span class="c"># Cap'n Hugo</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns usually apply t' other themes as well.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Th' title t' be used fer links t' th' main plank</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># This name will be used fer th' link t' th' main plank 'n th' upper section</span>
</span></span><span class="line"><span class="cl"><span class="c"># o' th' menu. If not set, `title` from th' Cap'n Hugo sett'ns will be used.</span>
</span></span><span class="line"><span class="cl"><span class="nx">linkTitle</span> <span class="p">=</span> <span class="s1">&#39;Relearn&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Th' author o' yer ship.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># This will be used 'n HTML meta tags, th' opengraph protocol an' twitter</span>
</span></span><span class="line"><span class="cl"><span class="c"># cards.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Ye can also set `author.email` if ye want t' publish this informat'n.</span>
</span></span><span class="line"><span class="cl"><span class="nx">author</span><span class="p">.</span><span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Sören Weber&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Th' social media image o' yer ship.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># This be used fer generat'n social media meta informat'n fer th' opengraph</span>
</span></span><span class="line"><span class="cl"><span class="c"># protocol an' twitter cards.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">images</span> <span class="p">=</span> <span class="p">[</span> <span class="s1">&#39;images/hero.png&#39;</span> <span class="p">]</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Admin opt'ns fer social media.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># Configurat'n fer th' Open Graph protocol an' Twitter Cards adhere t' Hugo&#39;s</span>
</span></span><span class="line"><span class="cl"><span class="c"># implementat'n. See th' Cap'n Hugo docs fer poss'ble values.</span>
</span></span><span class="line"><span class="cl"><span class="nx">social</span><span class="p">.</span><span class="nx">facebook_admin</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl"><span class="nx">social</span><span class="p">.</span><span class="nx">twitter</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">###############################################################################</span>
</span></span><span class="line"><span class="cl"><span class="c"># Relearrrn Theme</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns be specific t' th' Relearrrn theme.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Brand'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns set yer overall visual appearance.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Used color variants.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;auto&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># This sets one or more color variants, avail'ble t' yer readers t' choose</span>
</span></span><span class="line"><span class="cl"><span class="c"># from. Ye can</span>
</span></span><span class="line"><span class="cl"><span class="c"># - set a single value eg. &#39;zen-light&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># - an array like [ &#39;neon&#39;, &#39;learn&#39; ]</span>
</span></span><span class="line"><span class="cl"><span class="c"># - an array wit' opt'ns like [ { identifier = &#39;neon&#39; },{ identifier = &#39;learn&#39; } ]</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' last form allows t' set further opt'ns fer each variant.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' `identifier` be mandatory. Ye can also set `name` which overrides th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># value displayed 'n th' variant selector.</span>
</span></span><span class="line"><span class="cl"><span class="c"># If th' array has more than one entry, a variant selector</span>
</span></span><span class="line"><span class="cl"><span class="c"># be shown 'n th' lower part o' th' menu. Th' first entry 'n th' array be th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># default variant, used fer first time visitors.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' theme ships wit' th' follow'n variants: &#39;relearn-bright&#39;,</span>
</span></span><span class="line"><span class="cl"><span class="c"># &#39;relearn-light&#39;, &#39;relearn-dark&#39;, &#39;zen-light&#39;, &#39;zen-dark&#39;, &#39;neon&#39;, &#39;learn&#39;,</span>
</span></span><span class="line"><span class="cl"><span class="c"># &#39;blue&#39;, &#39;green&#39;, &#39;red&#39;. In addit'n ye can use auto mode variants. See th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># docs fer a detailed explanat'n.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Ye can also define yer own variants. See th' docs how this works. Also,</span>
</span></span><span class="line"><span class="cl"><span class="c"># th' docs provide an interactive theme generator t' help ye wit' this task.</span>
</span></span><span class="line"><span class="cl"><span class="nx">themeVariant</span> <span class="p">=</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-auto&#39;</span><span class="p">,</span> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Relearn Light/Dark&#39;</span><span class="p">,</span> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[]</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-light&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-dark&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;relearn-bright&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-auto&#39;</span><span class="p">,</span> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Zen Light/Dark&#39;</span><span class="p">,</span> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[</span> <span class="s1">&#39;zen-light&#39;</span><span class="p">,</span> <span class="s1">&#39;zen-dark&#39;</span> <span class="p">]</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-light&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;zen-dark&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;retro-auto&#39;</span><span class="p">,</span> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;Retro Learn/Neon&#39;</span><span class="p">,</span> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[</span> <span class="s1">&#39;learn&#39;</span><span class="p">,</span> <span class="s1">&#39;neon&#39;</span> <span class="p">]</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;neon&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;learn&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;blue&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;green&#39;</span> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;red&#39;</span> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">]</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># General</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns be defin'n general, non visual behavior.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Avoid new asset URLs on build.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># By default JavaScript-files an' CSS-files get a unique ID on each rebuild.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This makes sure, th' user always has th' latest version an' not some stale</span>
</span></span><span class="line"><span class="cl"><span class="c"># copy o' his browser cache. Anyways, it can be desire'ble t' turn this</span>
</span></span><span class="line"><span class="cl"><span class="c"># off 'n certain circumstances. For example if ye have Hugo&#39;s dev server</span>
</span></span><span class="line"><span class="cl"><span class="c"># runn'n. Also some proxies dislike this optimizat'n.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableAssetsBust'n</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Avoid generator meta tags.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># Set this t' true if ye want t' dis'ble generat'n fer generator meta tags</span>
</span></span><span class="line"><span class="cl"><span class="c"># o' Cap'n Hugo an' th' theme 'n yer HTML head. In this case also don&#39;t forget t'</span>
</span></span><span class="line"><span class="cl"><span class="c"># set Hugo&#39;s disableHugoGeneratorInject=true. Otherwise Cap'n Hugo will generate a</span>
</span></span><span class="line"><span class="cl"><span class="c"># meta tag into yer home plank anyways.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableGeneratorVersion</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Avoid unique IDs.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># In various situat'ns th' theme generates non st'ble unique ids t' be used</span>
</span></span><span class="line"><span class="cl"><span class="c"># 'n HTML fragment links. This can be undesir'ble fer example when test'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># th' output fer changes. If ye dis'ble th' random id generat'n, th' theme</span>
</span></span><span class="line"><span class="cl"><span class="c"># may not funct'n correctly anymore.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableRandomIds</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Additional code dependencies.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: See hugo.toml o' th' theme</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' theme provides a mechanism t' board further JavaScript an' CSS</span>
</span></span><span class="line"><span class="cl"><span class="c"># dependencies on demand only if they be needed. This comes 'n handy if ye</span>
</span></span><span class="line"><span class="cl"><span class="c"># want t' add own shorrrtcodes that depend on additional code t' be boarded.</span>
</span></span><span class="line"><span class="cl"><span class="c"># See th' docs how this works.</span>
</span></span><span class="line"><span class="cl"><span class="c"># [relearn.dependencies]</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Topbar</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns modify th' topbar appearance.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide th' t'ble o' contents button.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If th' TOC button be hidden, also th' keyboard shortcut be disabled.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableToc</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide th' breadcrumbs.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If th' breadcrumbs be hidden, th' title o' th' displayed plank will still be</span>
</span></span><span class="line"><span class="cl"><span class="c"># shown 'n th' topbar.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableBreadcrumb</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide Next an' Previous navigat'n buttons.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If th' navigat'n buttons be hidden, also th' keyboard shortcuts be</span>
</span></span><span class="line"><span class="cl"><span class="c"># disabled.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableNextPrev</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Th' URL prefix t' edit a plank.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># If set, an edit button will be shown 'n th' topbar. If th' button be hidden,</span>
</span></span><span class="line"><span class="cl"><span class="c"># also th' keyboard shortcuts be disabled. Th' value can contain th' macro</span>
</span></span><span class="line"><span class="cl"><span class="c"># `${FilePath}` which will be replaced by th' file path o' yer displayed plank.</span>
</span></span><span class="line"><span class="cl"><span class="c"># If no `${FilePath}` be given 'n th' value, th' value be treated as if th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># `${FilePath}` was appended at th' end o' th' value. This can be overridden</span>
</span></span><span class="line"><span class="cl"><span class="c"># 'n th' planks frontmatter. This be useful if ye want t' give th' opportunity</span>
</span></span><span class="line"><span class="cl"><span class="c"># fer people t' create merge request fer yer rrrambl'n.</span>
</span></span><span class="line"><span class="cl"><span class="nx">editURL</span> <span class="p">=</span> <span class="s1">&#39;https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Search</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns modify various aspects o' th' search functionality.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Dis'ble th' search.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If th' search be disabled, no search box will be displayed 'n th' menu,</span>
</span></span><span class="line"><span class="cl"><span class="c"># nor in-page search, search popup or dedicated search plank will be avail'ble.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This will also cause th' keyboard shortcut t' be disabled.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableSearch</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Dis'ble th' search index generat'n.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># `disableSearch=false` must be set t' let th' generat'n o' th' search index</span>
</span></span><span class="line"><span class="cl"><span class="c"># file t' be affected by this opt'n. If th' search index be disabled, no</span>
</span></span><span class="line"><span class="cl"><span class="c"># search popup or dedicated search plank will be avail'ble.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableSearchIndex</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># URL o' th' search index file relative t' th' language home.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;searchindex.js&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># Ye have t' set this opt'n if yer plank already has a rrrambl'n file named</span>
</span></span><span class="line"><span class="cl"><span class="c"># `searchindex.js` 'n th' language home.</span>
</span></span><span class="line"><span class="cl"><span class="nx">searchIndexURL</span> <span class="p">=</span> <span class="s1">&#39;searchindex.js&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Dis'ble th' dedicated search plank.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># `disableSearch=false` an' `disableSearchIndex=false` must be set t' let th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># generat'n o' th' dedicated search plank t' be affected by this opt'n.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableSearchPage</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># URL o' th' dedicated search plank relative t' th' language home.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;search&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># In its basic form th' search plank URL be named th' same fer all languages</span>
</span></span><span class="line"><span class="cl"><span class="c"># but ye be free t' override it 'n each language opt'ns t' localised th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># URL. Ye also need t' set this opt'n if yer plank already has a rrrambl'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># plank named `search`.</span>
</span></span><span class="line"><span class="cl"><span class="nx">searchPageURL</span> <span class="p">=</span> <span class="s1">&#39;search&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Multilanguage rrrambl'n.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># If th' search index be enabled an' yer planks contain further languages</span>
</span></span><span class="line"><span class="cl"><span class="c"># besides th' main one used, add all those auxiliary languages here. This</span>
</span></span><span class="line"><span class="cl"><span class="c"># will create a search index wit' support fer all used languages o' yer ship.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This be handy fer example if ye be writ'n 'n Spanish but have lots o'</span>
</span></span><span class="line"><span class="cl"><span class="c"># source code on yer plank which typically uses English terminology.</span>
</span></span><span class="line"><span class="cl"><span class="nx">additionalContentLanguage</span> <span class="p">=</span> <span class="p">[</span> <span class="s1">&#39;en&#39;</span> <span class="p">]</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Menu</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns modify th' menu appearance.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide th' Home entry.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If shown, a Home button will appear below th' search bar an' th' main menu.</span>
</span></span><span class="line"><span class="cl"><span class="c"># It links t' yer th' home plank o' th' current language.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableLandingPageButton</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Th' order o' main menu submenus.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;weight&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># Submenus can be ordered by &#39;weight&#39;, &#39;title&#39;, &#39;linktitle&#39;, &#39;modifieddate&#39;,</span>
</span></span><span class="line"><span class="cl"><span class="c"># &#39;expirydate&#39;, &#39;publishdate&#39;, &#39;date&#39;, &#39;length&#39; or &#39;default&#39; (adher'n t'</span>
</span></span><span class="line"><span class="cl"><span class="c"># Hugo&#39;s default sort order). This can be overridden 'n th' planks frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">ordersectionsby</span> <span class="p">=</span> <span class="s1">&#39;weight&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Th' initial expand state o' submenus.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># This controls whether submenus will be expanded (true), or collapsed (false)</span>
</span></span><span class="line"><span class="cl"><span class="c"># 'n th' menu. If not set, th' first menu level be set t' false, all others</span>
</span></span><span class="line"><span class="cl"><span class="c"># levels be set t' true. This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="c"># If th' displayed plank has submenus, they will always been displayed expanded</span>
</span></span><span class="line"><span class="cl"><span class="c"># regardless o' this opt'n.</span>
</span></span><span class="line"><span class="cl"><span class="nx">alwaysopen</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Shows expander fer submenus.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If set t' true, a submenu 'n th' sidebar will be displayed 'n a collaps'ble</span>
</span></span><span class="line"><span class="cl"><span class="c"># tree view an' a click'ble expander be set 'n front o' th' entry.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">collapsibleMenu</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Shows checkmarks fer visited planks o' th' main menu.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># This also causes th' display o' th' `Clear History` entry 'n th' lower part</span>
</span></span><span class="line"><span class="cl"><span class="c"># o' th' menu t' remove all checkmarks. Th' checkmarks will also been removed</span>
</span></span><span class="line"><span class="cl"><span class="c"># if ye regenerate yer ship as th' ids be not st'ble.</span>
</span></span><span class="line"><span class="cl"><span class="nx">showVisitedLinks</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide head'n above th' shortcut menu.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' title fer th' head'n can be overwritten 'n yer i18n files. See Hugo&#39;s</span>
</span></span><span class="line"><span class="cl"><span class="c"># documentat'n how t' do this.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableShortcutsTitle</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide th' language switcher.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If ye have more than one language configured, a language switcher be</span>
</span></span><span class="line"><span class="cl"><span class="c"># displayed 'n th' lower part o' th' menu. This opt'n lets ye explicitly</span>
</span></span><span class="line"><span class="cl"><span class="c"># turn this behavior off.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableLanguageSwitchingButton</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Hidden planks</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns configure how hidden planks be treated.</span>
</span></span><span class="line"><span class="cl"><span class="c"># A plank flagged as hidden, be only removed from th' main menu if ye be</span>
</span></span><span class="line"><span class="cl"><span class="c"># currently not on this plank or th' hidden plank be not part o' current page&#39;s</span>
</span></span><span class="line"><span class="cl"><span class="c"># ancestors. For all other functionality 'n Hugo a hidden plank behaves like any</span>
</span></span><span class="line"><span class="cl"><span class="c"># other plank if not otherwise configured.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide hidden planks from search.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># Hides hidden planks from th' suggest'ns o' th' search box an' th' dedicated</span>
</span></span><span class="line"><span class="cl"><span class="c"># search plank.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableSearchHiddenPages</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide hidden planks fer web crawlers.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># Avoids hidden planks from show'n up 'n th' sitemap an' on Google (et all),</span>
</span></span><span class="line"><span class="cl"><span class="c"># otherwise they may be indexed by search engines</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableSeoHiddenPages</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide hidden planks fer taxonomies.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># Hides hidden planks from show'n up on th' taxonomy an' terms planks. If this</span>
</span></span><span class="line"><span class="cl"><span class="c"># reduces term counters t' zero, an empty but not linked term plank will be</span>
</span></span><span class="line"><span class="cl"><span class="c"># created anyhow.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableTagHiddenPages</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Rrrambl'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns modify how yer rrrambl'n be displayed.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Title separator.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;::&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># Changes th' title separator used when concatenat'n th' plank title wit' th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># ship title. This be consistently used throughout th' theme.</span>
</span></span><span class="line"><span class="cl"><span class="nx">titleSeparator</span> <span class="p">=</span> <span class="s1">&#39;::&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Breadcrumb separator.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;&gt;&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># Changes th' breadcrumb separator used 'n th' topbars breadcrumb area an' fer</span>
</span></span><span class="line"><span class="cl"><span class="c"># search results an' term planks.</span>
</span></span><span class="line"><span class="cl"><span class="nx">breadcrumbSeparator</span> <span class="p">=</span> <span class="s1">&#39;&gt;&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide th' root breadcrumb.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' root breadcrumb be usually th' home plank o' yer ship. Because this be</span>
</span></span><span class="line"><span class="cl"><span class="c"># always access'ble by click'n on th' logo, ye may want t' reduce clutter</span>
</span></span><span class="line"><span class="cl"><span class="c"># by remov'n this from yer breadcrumb.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableRootBreadcrumb</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide breadcrumbs term planks.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If ye have lots o' taxonomy terms, th' term planks may seem cluttered wit'</span>
</span></span><span class="line"><span class="cl"><span class="c"># breadcrumbs t' ye, so this be th' opt'n t' turn off breadcrumbs on term</span>
</span></span><span class="line"><span class="cl"><span class="c"># planks. Only th' plank title will then be shown on th' term planks.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableTermBreadcrumbs</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Dis'ble copy'n head'n links t' clipboard</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If set t' true, this disables th' copy'n o' anchor links t' th' clipboard;</span>
</span></span><span class="line"><span class="cl"><span class="c"># if also `disableAnchorScrolling=true` then no anchor link will be vis'ble</span>
</span></span><span class="line"><span class="cl"><span class="c"># when hover'n a head'n.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableAnchorCopy</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Dis'ble scroll'n t' head'n link on click</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If set t' true, this disables th' scroll'n t' th' beginn'n o' th' head'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># when clicked; if also `disableAnchorCopy=true` then no anchor link will</span>
</span></span><span class="line"><span class="cl"><span class="c"># be vis'ble when hover'n a head'n.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableAnchorScroll'n</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># User-defined styles fer shorrrtcodes</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># Besides th' predefined `style` values, ye be able t' define yer own. Th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># `style` parameter o' th' shortcode must match th' `identifier` defined here.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' title fer th' style will be determined from th' `title`. If no `title`</span>
</span></span><span class="line"><span class="cl"><span class="c"># but a `i18n` be set, th' title will be taken from th' translat'n files by</span>
</span></span><span class="line"><span class="cl"><span class="c"># that key. Th' `title` may be empty 'n which case, th' box does not contain a</span>
</span></span><span class="line"><span class="cl"><span class="c"># default title. `icon` an' `color` be work'n similar.</span>
</span></span><span class="line"><span class="cl"><span class="nx">boxStyle</span> <span class="p">=</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">&#39;magic&#39;</span><span class="p">,</span> <span class="nx">i18n</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span><span class="p">,</span> <span class="nx">title</span> <span class="p">=</span> <span class="s1">&#39;Magic&#39;</span><span class="p">,</span> <span class="nx">ay'con</span> <span class="p">=</span> <span class="s1">&#39;rainbow&#39;</span><span class="p">,</span> <span class="nx">color</span> <span class="p">=</span> <span class="s1">&#39;gold&#39;</span> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">]</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Highlight</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns configure how code be displayed.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Hide copy-to-clipboard fer inline code.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># This removes th' copy-to-clipboard button from yer inline code.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableInlineCopyToClipBoard</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Always show copy-to-clipboard fer block code.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' theme only shows th' copy-to-clipboard button if ye hover over th' code</span>
</span></span><span class="line"><span class="cl"><span class="c"># block. Set this t' true t' dis'ble th' hover effect an' always show th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># button.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableHoverBlockCopyToClipBoard</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Wrap fer code blocks.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: true</span>
</span></span><span class="line"><span class="cl"><span class="c"># By default lines o' code blocks wrap around if th' line be too long t' be</span>
</span></span><span class="line"><span class="cl"><span class="c"># displayed on screen. If ye dislike this behavior, ye can reconfigure it</span>
</span></span><span class="line"><span class="cl"><span class="c"># here.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Avast that lines always wrap 'n print mode regardless o' this opt'n.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter or given as a parameter t'</span>
</span></span><span class="line"><span class="cl"><span class="c"># individual code blocks.</span>
</span></span><span class="line"><span class="cl"><span class="nx">highlightWrap</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Include</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns configure how th' include shortcode works.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># What t' do when path be not resolved.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># Ye can control what should happen if a path can not be resolved t' as</span>
</span></span><span class="line"><span class="cl"><span class="c"># a resource or via th' file system. If not set, no output will be written</span>
</span></span><span class="line"><span class="cl"><span class="c"># fer th' unresolved path. If set t' `warning` th' same happens an' an additional</span>
</span></span><span class="line"><span class="cl"><span class="c"># warning be printed. If set t' `error` an error message be printed an' th' build</span>
</span></span><span class="line"><span class="cl"><span class="c"># be aborted.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">include</span><span class="p">.</span><span class="nx">errorlevel</span> <span class="p">=</span> <span class="s1">&#39;error&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Images</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns configure how images be displayed.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># What t' do when local image link be not resolved.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># Ye can control what should happen if a local image can not be resolved t' as</span>
</span></span><span class="line"><span class="cl"><span class="c"># a resource. If not set, th' unresolved link be written as given into th' result'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># output. If set t' `warning` th' same happens an' an additional warning be</span>
</span></span><span class="line"><span class="cl"><span class="c"># printed. If set t' `error` an error message be printed an' th' build be</span>
</span></span><span class="line"><span class="cl"><span class="c"># aborted.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Please note that this can not resolve files inside o' yer `static` directory.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">image</span><span class="p">.</span><span class="nx">errorlevel</span> <span class="p">=</span> <span class="s1">&#39;error&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Image effects.</span>
</span></span><span class="line"><span class="cl"><span class="c"># See th' documentat'n fer how ye can even add yer own arbitrary effects t'</span>
</span></span><span class="line"><span class="cl"><span class="c"># th' list.</span>
</span></span><span class="line"><span class="cl"><span class="c"># All effects can be overridden 'n th' page&#39;s frontmatter or through URL parameter</span>
</span></span><span class="line"><span class="cl"><span class="c"># given t' th' image. See th' documentat'n fer details.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="nx">imageEffects</span><span class="p">.</span><span class="nx">border</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: true</span>
</span></span><span class="line"><span class="cl"><span class="nx">imageEffects</span><span class="p">.</span><span class="nx">lazy</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: true</span>
</span></span><span class="line"><span class="cl"><span class="nx">imageEffects</span><span class="p">.</span><span class="nx">lightbox</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="nx">imageEffects</span><span class="p">.</span><span class="nx">shadow</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Links</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns configure how links be displayed.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Wether t' use Hugo&#39;s default relref shortcode implementat'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># Since th' theme provides a link render hook, th' usage o' th' relref shortcode</span>
</span></span><span class="line"><span class="cl"><span class="c"># be obsolete. If a ship still uses that shortcode, it fails t' generate a</span>
</span></span><span class="line"><span class="cl"><span class="c"># correct links if th' baseURL be configured wit' a subdirectory an' relativeURLs=false.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Th' theme provides an overriden relref shortcode that also works 'n th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># above setup but must manually be activated by sett'n this opt'n t' true.</span>
</span></span><span class="line"><span class="cl"><span class="c"># See discussion 'n https://github.com/McShelby/hugo-theme-relearn/discussions/862</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableDefaultRelref</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Generate link URLs th' Cap'n Hugo way.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If set t' true, th' theme behaves like a standard Cap'n Hugo installat'n an'</span>
</span></span><span class="line"><span class="cl"><span class="c"># appends no index.html t' prettyURLs. As a trade off, yer build project will</span>
</span></span><span class="line"><span class="cl"><span class="c"># not be serv'ble from th' file system.</span>
</span></span><span class="line"><span class="cl"><span class="nx">disableExplicitIndexURLs</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># What t' do when local plank link be not resolved.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># Ye can control what should happen if a local link can not be resolved t' a</span>
</span></span><span class="line"><span class="cl"><span class="c"># plank. If not set, th' unresolved link be written as given into th' result'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># output. If set t' `warning` th' same happens an' an additional warning be</span>
</span></span><span class="line"><span class="cl"><span class="c"># printed. If set t' `error` an error message be printed an' th' build be</span>
</span></span><span class="line"><span class="cl"><span class="c"># aborted.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Please note that wit' Cap'n Hugo &lt; 0.123.0 + `uglyURLs=true` this can lead t' false</span>
</span></span><span class="line"><span class="cl"><span class="c"># negatives.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">link</span><span class="p">.</span><span class="nx">errorlevel</span> <span class="p">=</span> <span class="s1">&#39;error&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># How t' open external links.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;_blank&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># For external links ye can define how they be opened 'n yer browser. All</span>
</span></span><span class="line"><span class="cl"><span class="c"># values fer th' HTML `target` attribute o' th' `a` element be allowed. Th'</span>
</span></span><span class="line"><span class="cl"><span class="c"># default value opens external links 'n a separate browser tab. If ye want</span>
</span></span><span class="line"><span class="cl"><span class="c"># t' open those links 'n th' same tab, use &#39;_self&#39;.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">externalLinkTarget</span> <span class="p">=</span> <span class="s1">&#39;_self&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># MathJax</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns configure how math formulae be displayed.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Initializat'n opt'ns fer MathJax.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># A JSON value. See th' MathJaxdocumentat'n fer poss'ble parameter.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">mathJaxInitialize</span> <span class="p">=</span> <span class="s1">&#39;{}&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Force board Math on every plank.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If a, Math shortcode or codefence be found, th' opt'n will be ignored an'</span>
</span></span><span class="line"><span class="cl"><span class="c"># Math will be boarded regardlessly. This opt'n be useful 'n case ye</span>
</span></span><span class="line"><span class="cl"><span class="c"># be us'n passthrough configurat'n t' render yer math. In this case no shortcode or</span>
</span></span><span class="line"><span class="cl"><span class="c"># codefence be involved an' th' library be not boarded by default so ye can</span>
</span></span><span class="line"><span class="cl"><span class="c"># force load'n it by sett'n `math=true`.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This opt'n has an alias `math.force`.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">math</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># URL fer external MathJax library.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># Specifies th' remote locat'n o' th' MathJax library. By default th' shipped</span>
</span></span><span class="line"><span class="cl"><span class="c"># version will be used.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">customMathJaxURL</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span> <span class="c"># &#39;https://unpkg.com/mathjax/es5/tex-mml-chtml.js&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># Merrrmaid</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns configure how Merrrmaid graphs be displayed.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Make graphs pan'ble an' zoom'ble</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># For huge graphs it can be helpful t' make them zoom'ble. Zoom'ble graphs come</span>
</span></span><span class="line"><span class="cl"><span class="c"># wit' a reset button fer th' zoom.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter or given as a parameter t'</span>
</span></span><span class="line"><span class="cl"><span class="c"># individual graphs.</span>
</span></span><span class="line"><span class="cl"><span class="nx">mermaidZoom</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Initializat'n opt'ns fer Merrrmaid.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># A JSON value. See th' Merrrmaid documentat'n fer poss'ble parameter.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">mermaidInitialize</span> <span class="p">=</span> <span class="s1">&#39;{ &#34;securityLevel&#34;: &#34;loose&#34; }&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Force board Merrrmaid on every plank.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If a Merrrmaid shortcode or codefence be found, th' opt'n will be ignored an'</span>
</span></span><span class="line"><span class="cl"><span class="c"># Merrrmaid will be boarded regardlessly. This opt'n be useful 'n case ye</span>
</span></span><span class="line"><span class="cl"><span class="c"># be us'n script'n t' render yer graph. In this case no shortcode or</span>
</span></span><span class="line"><span class="cl"><span class="c"># codefence be involved an' th' library be not boarded by default so ye can</span>
</span></span><span class="line"><span class="cl"><span class="c"># force load'n it by sett'n `mermaid.force=true`.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">mermaid</span><span class="p">.</span><span class="nx">force</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># URL fer external Merrrmaid library.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># Specifies th' remote locat'n o' th' Merrrmaid library. By default th' shipped</span>
</span></span><span class="line"><span class="cl"><span class="c"># version will be used.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">customMermaidURL</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span> <span class="c"># &#39;https://unpkg.com/mermaid/dist/mermaid.min.js&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c">#++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++</span>
</span></span><span class="line"><span class="cl"><span class="c"># OpenApi</span>
</span></span><span class="line"><span class="cl"><span class="c"># These opt'ns configure how OpenAPI specificat'ns be displayed.</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># Force board OpenAPI on every plank.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: false</span>
</span></span><span class="line"><span class="cl"><span class="c"># If a, OpenAPI shortcode or codefence be found, th' opt'n will be ignored an'</span>
</span></span><span class="line"><span class="cl"><span class="c"># OpenAPI will be boarded regardlessly. This opt'n be useful 'n case ye</span>
</span></span><span class="line"><span class="cl"><span class="c"># be us'n script'n t' render yer spec. In this case no shortcode or</span>
</span></span><span class="line"><span class="cl"><span class="c"># codefence be involved an' th' library be not boarded by default so ye can</span>
</span></span><span class="line"><span class="cl"><span class="c"># force load'n it by sett'n `openapi.force=true`.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">oppenapi</span><span class="p">.</span><span class="nx">force</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># URL fer external OpenAPI library.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: not set</span>
</span></span><span class="line"><span class="cl"><span class="c"># Specifies th' remote locat'n o' th' OpenAPI library. By default th' shipped</span>
</span></span><span class="line"><span class="cl"><span class="c"># version will be used.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">customOpenapiURL</span> <span class="p">=</span> <span class="s1">&#39;&#39;</span> <span class="c"># &#39;https://unpkg.com/swagger-ui-dist/swagger-ui-bundle.js&#39;</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="c"># What t' do when a local OpenAPI spec link be not resolved.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Default: &#39;&#39;</span>
</span></span><span class="line"><span class="cl"><span class="c"># Ye can control what should happen if a local OpenAPI spec link can not be resolved</span>
</span></span><span class="line"><span class="cl"><span class="c"># t' a resource. If not set, th' unresolved link be written as given into th' result'n</span>
</span></span><span class="line"><span class="cl"><span class="c"># output. If set t' `warning` th' same happens an' an additional warning be</span>
</span></span><span class="line"><span class="cl"><span class="c"># printed. If set t' `error` an error message be printed an' th' build be</span>
</span></span><span class="line"><span class="cl"><span class="c"># aborted.</span>
</span></span><span class="line"><span class="cl"><span class="c"># Please note that this can not resolve files inside o' yer `static` directory.</span>
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden 'n th' page&#39;s frontmatter.</span>
</span></span><span class="line"><span class="cl"><span class="nx">openapi</span><span class="p">.</span><span class="nx">errorlevel</span> <span class="p">=</span> <span class="s1">&#39;error&#39;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/reference/index.html">Reference</a></li>
</ul>
</div>
</footer>
</article>
</section>
</div>
</main>
</div>
<script src="/hugo-theme-relearn/js/clipboard.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-color.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-dispatch.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-drag.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-ease.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-interpolate.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-selection.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-timer.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-transition.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/d3/d3-zoom.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/js-yaml.min.js?1728929952" defer></script>
<script src="/hugo-theme-relearn/js/mermaid.min.js?1728929952" defer></script>
<script>
window.themeUseMermaid = JSON.parse("{ \"securityLevel\": \"loose\" }");
</script>
<script src="/hugo-theme-relearn/js/theme.js?1728929952" defer></script>
</body>
</html>