mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-10-27 18:53:18 +00:00
6573 lines
510 KiB
HTML
6573 lines
510 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en" dir="ltr" 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+179369e4b4527c0a34abf2783070181d2a202b3b">
|
||
<meta name="description" content="Find out how to configure and customize your site.
|
||
Site ManagementGet yourself familiar with the general structure of your 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="Configuration :: Hugo Relearn Theme">
|
||
<meta name="twitter:description" content="Find out how to configure and customize your site.
|
||
Site ManagementGet yourself familiar with the general structure of your website">
|
||
<meta property="og:url" content="https://mcshelby.github.io/hugo-theme-relearn/configuration/index.html">
|
||
<meta property="og:site_name" content="Hugo Relearn Theme">
|
||
<meta property="og:title" content="Configuration :: Hugo Relearn Theme">
|
||
<meta property="og:description" content="Find out how to configure and customize your site.
|
||
Site ManagementGet yourself familiar with the general structure of your website">
|
||
<meta property="og:locale" content="en">
|
||
<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="Configuration :: Hugo Relearn Theme">
|
||
<meta itemprop="description" content="Find out how to configure and customize your site.
|
||
Site ManagementGet yourself familiar with the general structure of your 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>Configuration :: Hugo Relearn 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/configuration/index.html" rel="canonical" type="text/html" title="Configuration :: Hugo Relearn Theme">
|
||
<link href="/hugo-theme-relearn/configuration/index.xml" rel="alternate" type="application/rss+xml" title="Configuration :: Hugo Relearn Theme">
|
||
<link href="/hugo-theme-relearn/images/logo.svg?1728838675" rel="icon" type="image/svg+xml">
|
||
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1728838675" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1728838675" rel="stylesheet"></noscript>
|
||
<link href="/hugo-theme-relearn/css/nucleus.css?1728838675" rel="stylesheet">
|
||
<link href="/hugo-theme-relearn/css/auto-complete.css?1728838675" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1728838675" rel="stylesheet"></noscript>
|
||
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1728838675" rel="stylesheet">
|
||
<link href="/hugo-theme-relearn/css/fonts.css?1728838675" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fonts.css?1728838675" rel="stylesheet"></noscript>
|
||
<link href="/hugo-theme-relearn/css/theme.css?1728838675" rel="stylesheet">
|
||
<link href="/hugo-theme-relearn/css/theme-relearn-auto.css?1728838675" rel="stylesheet" id="R-variant-style">
|
||
<link href="/hugo-theme-relearn/css/chroma-relearn-auto.css?1728838675" rel="stylesheet" id="R-variant-chroma-style">
|
||
<link href="/hugo-theme-relearn/css/print.css?1728838675" rel="stylesheet" media="print">
|
||
<link href="/hugo-theme-relearn/css/format-print.css?1728838675" rel="stylesheet">
|
||
<script src="/hugo-theme-relearn/js/variant.js?1728838675"></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 to clipboard`;
|
||
window.T_Copied_to_clipboard = `Copied to clipboard!`;
|
||
window.T_Copy_link_to_clipboard = `Copy link to clipboard`;
|
||
window.T_Link_copied_to_clipboard = `Copied link to clipboard!`;
|
||
window.T_Reset_view = `Reset view`;
|
||
window.T_View_reset = `View reset!`;
|
||
window.T_No_results_found = `No results found for "{0}"`;
|
||
window.T_N_results_found = `{1} results found for "{0}"`;
|
||
</script>
|
||
<style>
|
||
#R-body img.bg-white {
|
||
background-color: white;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="mobile-support print disableInlineCopyToClipboard" data-url="/hugo-theme-relearn/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+ALT+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 of Contents (CTRL+ALT+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">Configuration</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.en.md" target="_self" title="Edit (CTRL+ALT+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/configuration/index.print.html" title="Print whole chapter (CTRL+ALT+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/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/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="More"><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">Chapter 2</div>
|
||
|
||
<h1 id="configuration">Configuration</h1>
|
||
|
||
<p>Find out how to configure and customize your site.</p>
|
||
<div class="children children-h2 children-sort-">
|
||
<h2><a href="/hugo-theme-relearn/configuration/sitemanagement/index.html">Site Management</a></h2><p>Get yourself familiar with the general structure of your website</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/branding/index.html">Branding</a></h2><p>Change colors and logos of your site</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sidebar/index.html">Sidebar</a></h2><p>Configure all things sidebar</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/content/index.html">Content</a></h2><p>Configure the content area of your site</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/customization/index.html">Customization</a></h2><p>Customize files for advanced usage</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/reference/index.html">Options Reference</a></h2><p>All configuration options for the Relearn theme</p>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/reference/index.html">Reference</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<section>
|
||
<h1 class="a11y-only">Subsections of Configuration</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/configuration/sitemanagement/structure/index.html">Directory Structure</a></h2><p>Your site's directory structure</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sitemanagement/multilingual/index.html">Multilingual</a></h2><p>How to set up a multilingual site</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sitemanagement/meta/index.html">Meta Information</a></h2><p>What site-wide meta information can be set</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sitemanagement/deployment/index.html">Deployment Scenarios</a></h2><p>Options for specific deployment needs</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sitemanagement/outputformats/index.html">Available Output Formats</a></h2><p>What other formats can a page be displayed in</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sitemanagement/stableoutput/index.html">Stable Output</a></h2><p>How to make your generated HTML output stable</p>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/reference/index.html">Reference</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<section>
|
||
<h1 class="a11y-only">Subsections of Site Management</h1>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="directory-structure">Directory Structure</h1>
|
||
|
||
<p>If you’ve followed the <a href="/hugo-theme-relearn/introduction/quickstart/index.html">Getting Started</a> guide, your directory layout will look similar to 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">├── content
|
||
</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>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 you combine multiple directories.</p>
|
||
<p>By default, it puts your root directory on top of the Relearn theme directory. Files in your root directory will replace theme files in the same location.</p>
|
||
<p>For example, if you create a file at <code>layouts/partials/heading.html</code>, it will override the theme’s <code>themes/hugo-theme-relearn/layouts/partials/heading.html</code>.</p>
|
||
<p><a href="/hugo-theme-relearn/configuration/customization/partials/index.html">See this list</a>, to learn which files are allowed to be modified by you.</p>
|
||
<p>This makes it easy to customize the theme without changing files in the <code>themes</code> directory, making future theme updates simpler.</p>
|
||
<div class="box notices cstyle warning">
|
||
<div class="box-label">
|
||
<i class="fa-fw fas fa-exclamation-triangle"></i> Warning
|
||
</div>
|
||
<div class="box-content">
|
||
<p>Don’t edit files inside the <code>themes/hugo-theme-relearn</code> directory. That’s not the recommended way to customize! Refer to the explanation above.</p>
|
||
<p>Don’t clone the theme repository and edit files there for your site. That’s not the recommended way to customize! Instead, follow the <a href="/hugo-theme-relearn/introduction/quickstart/index.html">Getting Started</a> guide.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="multilingual">Multilingual</h1>
|
||
|
||
<p>The Relearn theme works with <a href="https://gohugo.io/content-management/multilingual/" rel="external" target="_self">Hugo’s multilingual mode</a>.</p>
|
||
<p>It supports many languages, including right-to-left languages.</p>
|
||
<div class="expand">
|
||
<input type="checkbox" id="R-expand-108a73e26f190d795a21c96a648e2693" aria-controls="R-expandcontent-108a73e26f190d795a21c96a648e2693">
|
||
<label class="expand-label" for="R-expand-108a73e26f190d795a21c96a648e2693">
|
||
<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-108a73e26f190d795a21c96a648e2693" 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">Translation by File Name</h2>
|
||
<p>Here’s how to make your site multilingual using <a href="https://gohugo.io/content-management/multilingual/#translation-by-file-name" rel="external" target="_self">translations by file name</a>:</p>
|
||
<ol>
|
||
<li>
|
||
<p>Set up languages in your <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">'en'</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">'en'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">languageName</span> <span class="p">=</span> <span class="s1">'English'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">'My Website'</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">'art-x-pir'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">languageDirection</span> <span class="p">=</span> <span class="s1">'rtl'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">languageName</span> <span class="p">=</span> <span class="s1">'Pirrratish'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">'Arrr, my Website'</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">languageDirection</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">"defaultContentLanguage"</span><span class="p">:</span> <span class="s2">"en"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"languages"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"en"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"languageCode"</span><span class="p">:</span> <span class="s2">"en"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"languageName"</span><span class="p">:</span> <span class="s2">"English"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"title"</span><span class="p">:</span> <span class="s2">"My Website"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"pir"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"languageCode"</span><span class="p">:</span> <span class="s2">"art-x-pir"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"languageDirection"</span><span class="p">:</span> <span class="s2">"rtl"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"languageName"</span><span class="p">:</span> <span class="s2">"Pirrratish"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"title"</span><span class="p">:</span> <span class="s2">"Arrr, my Website"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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 your content files and add language codes to 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">├── content
|
||
</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">Translation by Content Directory</h2>
|
||
<p>The theme also support <a href="https://gohugo.io/content-management/multilingual/#translation-by-content-directory" rel="external" target="_self">translations by content directory</a> which can be configured in a similar way. This is not used in further examples of this documentation.</p>
|
||
<h2 id="search-settings">Search Settings</h2>
|
||
<p>Check the <a href="/hugo-theme-relearn/configuration/sidebar/search/index.html#mixed-language-support">search configuration</a> for multilingual options.</p>
|
||
<h2 id="turn-off-language-switching">Turn Off Language Switching</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">Option</span></span> By default the theme shows a language switcher in the lower part of the menu.</p>
|
||
<p>To disable the 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableLanguageSwitchingButton"</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="Categories" 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/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">Site Author Information</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">Option</span></span> The theme uses author details in various parts of your site, like RSS feeds and 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">'santa@example.com'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Santa Claus'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"author"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"email"</span><span class="p">:</span> <span class="s2">"santa@example.com"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"Santa Claus"</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">Site Title</h2>
|
||
<p>The <code>title</code> will be used in meta information of your 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">'Hugo Relearn Theme'</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">Hugo Relearn 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">"title"</span><span class="p">:</span> <span class="s2">"Hugo Relearn Theme"</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">Site Description</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> The theme shows a site description in various places, such as RSS feeds and meta tags. For this, it uses the <code>description</code> field from your home page’s front matter.</p>
|
||
<h2 id="social-media-images">Social Media Images</h2>
|
||
<p>When your page is shared on social media, you can set a site-wide image to display with the 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">'images/hero.png'</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">"images"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"images/hero.png"</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 Options</h2>
|
||
<p>The theme adheres to Hugo’s official documentation for <a href="https://gohugo.io/templates/embedded/#configure-open-graph" rel="external" target="_self">Open Graph</a> and <a href="https://gohugo.io/templates/embedded/#configure-x-twitter-cards" rel="external" target="_self">Twitter Cards</a> configuration.</p>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/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>The theme is usable offline. No internet connection is required to load your page. This is achieved by storing all dependencies within the theme.</p>
|
||
<p>No calls to 3rd party servers, no calling home, no tracking. Privacy friendly.</p>
|
||
<h2 id="server-deployment">Server Deployment</h2>
|
||
<p>If your server deployment has no special requirements, you can skip this section and use the <a href="https://gohugo.io/content-management/urls/" rel="external" target="_self">standard Hugo options</a>.</p>
|
||
<p>For special requirements, the theme is capable of different scenarios, requiring the following mandatory settings in your <code>hugo.toml</code>. All settings not mentioned in the examples below can be set to your liking.</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">'https://example.com/'</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">"baseURL"</span><span class="p">:</span> <span class="s2">"https://example.com/"</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">'https://example.com/mysite/'</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">"baseURL"</span><span class="p">:</span> <span class="s2">"https://example.com/mysite/"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"relativeURLs"</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 you are still using Hugo’s <code>relref</code> shortcode (which you shouldn’t), you will need <a href="/hugo-theme-relearn/configuration/content/linking/index.html#patching-the-relref-shortcode">further configuration</a>.</p>
|
||
<div class="box notices cstyle warning">
|
||
<div class="box-label">
|
||
<i class="fa-fw fas fa-exclamation-triangle"></i> Warning
|
||
</div>
|
||
<div class="box-content">
|
||
<p>Don’t use a <code>baseURL</code> with a subdirectory and <code>relativeURLs=true</code> together. <a href="https://github.com/gohugoio/hugo/issues/12130" rel="external" target="_self">Hugo doesn’t apply the <code>baseURL</code> correctly</a> in this case. If you need both, generate your site twice with different settings into separate directories.</p>
|
||
</div>
|
||
</div>
|
||
<h3 id="private-web-server-lan">Private Web Server (LAN)</h3>
|
||
<p>The same settings as with any of the 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">'/'</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">"baseURL"</span><span class="p">:</span> <span class="s2">"/"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"relativeURLs"</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>Your generated site can be used headless without a HTTP server.</p>
|
||
<p>This can be achieved by using the <code>file://</code> protocol in your browser’s address bar or by double click on a generated <code>*.html</code> file in your file navigation tool.</p>
|
||
<p>Use the following settings</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">'/'</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">"baseURL"</span><span class="p">:</span> <span class="s2">"/"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"relativeURLs"</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> Note
|
||
</div>
|
||
<div class="box-content">
|
||
<p>Pages like <code>sitemap.xml</code> and <code>rss.xml</code>, and social media links will always use absolute URLs. They won’t work with <code>relativeURLs=true</code>.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/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>Enable print support to print entire chapters or the whole site. Add the <code>print</code> output format to your home, section, and page in <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">'html'</span><span class="p">,</span> <span class="s1">'rss'</span><span class="p">,</span> <span class="s1">'print'</span><span class="p">]</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">page</span> <span class="p">=</span> <span class="p">[</span><span class="s1">'html'</span><span class="p">,</span> <span class="s1">'rss'</span><span class="p">,</span> <span class="s1">'print'</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">'html'</span><span class="p">,</span> <span class="s1">'rss'</span><span class="p">,</span> <span class="s1">'print'</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">page</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">"outputs"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"home"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"html"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"rss"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"print"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"page"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"html"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"rss"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"print"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"section"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"html"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"rss"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"print"</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 icon in the topbar. Clicking it switches to print preview, showing the page and its <a href="/hugo-theme-relearn/configuration/content/hidden/index.html">visible subpages</a> in a printer-friendly format. Use your browser’s print function to print or save as PDF.</p>
|
||
<p>The URL won’t be <a href="https://gohugo.io/templates/output-formats/#configure-output-formats" rel="external" target="_self">configured ugly</a> for <a href="https://gohugo.io/content-management/urls/#ugly-urls" rel="external" target="_self">Hugo’s URL handling</a>, even with <code>uglyURLs=true</code> in <code>hugo.toml</code>. This is because each mime type can only have one suffix.</p>
|
||
<p>If you don’t like the URLs, you can reconfigure <code>outputFormats.print</code> in your <code>hugo.toml</code> to something other than the default of:</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">'index.print'</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">'text/html'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'print'</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">permalinkable</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">permalinkable</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">"outputFormats"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"print"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"baseName"</span><span class="p">:</span> <span class="s2">"index.print"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"isHTML"</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">"mediaType"</span><span class="p">:</span> <span class="s2">"text/html"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"print"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"noUgly"</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">"permalinkable"</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="Categories" 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/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">Disabling the 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">Option</span></span> The theme adds a meta tag with its version number to each page.</p>
|
||
<p>This isn’t a security risk and helps us support you better.</p>
|
||
<p>To 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableGeneratorVersion"</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 you also want to turn off <a href="https://gohugo.io/getting-started/configuration/#disablehugogeneratorinject" rel="external" target="_self">Hugo’s version meta tag</a>, use <code>disableHugoGeneratorInject=true</code>.</p>
|
||
<h2 id="disabling-ids-for-referenced-assets">Disabling IDs for 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">Option</span></span> The theme creates a unique ID for each build and adds it to each referenced asset’s URL to make browsers not keep outdated cached assets.</p>
|
||
<p>This is good for production sites but can be problematic during development. It makes comparing outputs difficult as each build has new IDs.</p>
|
||
<p>To disable 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">disableAssetsBusting</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">disableAssetsBusting</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableAssetsBusting"</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">Disabling IDs for 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">Option</span></span> Features like expanders, callouts, and tabs use unique IDs to work. These IDs change with each build.</p>
|
||
<p>This is necessary for the theme to work properly, but it can make comparing outputs between builds difficult.</p>
|
||
<p>To turn this off, set <code>disableRandomIds=true</code>. Note, that this will result in a non-functional site!.</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableRandomIds"</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="Categories" 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/categories/howto/index.html">Howto</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
</section>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="branding">Branding</h1>
|
||
|
||
<div class="children children-h2 children-sort-">
|
||
<h2><a href="/hugo-theme-relearn/configuration/branding/logo/index.html">Logo</a></h2><p>Provide your own logo and favicon</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/branding/colors/index.html">Colors</a></h2><p>Learn how to customize your site's colors</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/branding/modules/index.html">Module Theming</a></h2><p>Colors of syntax highlighting and 3rd-party modules</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/branding/generator/index.html">Stylesheet Generator</a></h2><p>An interactive tool to generate color variant stylesheets</p>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/reference/index.html">Reference</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<section>
|
||
<h1 class="a11y-only">Subsections of Branding</h1>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="logo">Logo</h1>
|
||
|
||
<h2 id="change-the-favicon">Change the Favicon</h2>
|
||
<p>If your favicon is an SVG, PNG, or ICO, just drop your image in your site’s <code>static/images/</code> directory and name it <code>favicon.svg</code>, <code>favicon.png</code>, or <code>favicon.ico</code> respectively.</p>
|
||
<p>If you want to adjust your favicon according to your OS settings for light/dark mode, add the image files <code>static/images/favicon-light.svg</code> and <code>static/images/favicon-dark.svg</code> to your site’s directory, respectively, corresponding to your file format. In case some of the files are missing, the theme falls back to <code>favicon.svg</code> for each missing file. All supplied favicons must be of the same file format.</p>
|
||
<p>If no favicon file is found, the theme will look up the alternative filename <code>logo</code> in the same location and will repeat the search for the list of supported file types.</p>
|
||
<p>If you need to change this default behavior, create a new file <code>layouts/partials/favicon.html</code> in your site’s directory and write something like this:</p>
|
||
<div class="tab-panel" data-tab-group="85911697c7775b488de028d48d2bbaf7">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="layoutspartialsfaviconhtml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('85911697c7775b488de028d48d2bbaf7','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"><</span><span class="nt">link</span> <span class="na">rel</span><span class="o">=</span><span class="s">"icon"</span> <span class="na">href</span><span class="o">=</span><span class="s">"/images/favicon.bmp"</span> <span class="na">type</span><span class="o">=</span><span class="s">"image/bmp"</span><span class="p">></span></span></span></code></pre></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div><h2 id="change-the-logo">Change the Logo</h2>
|
||
<p>By default, only your site title will be shown at the top of the menu. You can <a href="/hugo-theme-relearn/configuration/sidebar/headerfooter/index.html#title">configure this</a>, or override the logo partial.</p>
|
||
<p>Create a new file in <code>layouts/partials/logo.html</code> of your site. Then write any HTML you want. You could use an <code>img</code> HTML tag and reference an image, or you could paste an SVG definition!</p>
|
||
<p>The size of the logo will adapt automatically.</p>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/howto/index.html">Howto</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="colors">Colors</h1>
|
||
|
||
<p>The Relearn theme offers color variants to change your site’s appearance. Each color variant contains of a CSS file and optional settings in your <code>hugo.toml</code>.</p>
|
||
<p>You can use the <a href="/hugo-theme-relearn/configuration/branding/colors/index.html#shipped-variants">shipped variants</a>, <a href="/hugo-theme-relearn/configuration/branding/colors/index.html#modifying-variants">customize them</a>, or create your own. The <a href="/hugo-theme-relearn/configuration/branding/generator/index.html">interactive variant generator</a> can help you with this.</p>
|
||
<p>Once set up in <code>hugo.toml</code>, you can switch variants using the selector at the bottom of the menu.</p>
|
||
<h2 id="shipped-variants">Shipped Variants</h2>
|
||
<p>The theme ships with the following set of variants</p>
|
||
<ul>
|
||
<li>Relearn
|
||
<ul>
|
||
<li>Light: the classic Relearn default, coming with signature green, dark sidebar and light content area</li>
|
||
<li>Dark: dark variant of Light, coming with signature green, dark sidebar and dark content area</li>
|
||
<li>Bright: alternative of Light, coming with signature green, green sidebar and light content area</li>
|
||
</ul>
|
||
</li>
|
||
<li>Zen
|
||
<ul>
|
||
<li>Light: a more relaxed white/grey variant, coming with blue accents, light sidebar and light content area</li>
|
||
<li>Dark: dark variant of Light, coming with blue accents, dark sidebar and dark content area</li>
|
||
</ul>
|
||
</li>
|
||
<li>Experimental
|
||
<ul>
|
||
<li>Neon: a variant that glows in the dark, gradient sidebar and dark content area</li>
|
||
</ul>
|
||
</li>
|
||
<li>Retro
|
||
<ul>
|
||
<li>Learn: the default of the old Learn theme, coming with signature light purple, dark sidebar and light content area</li>
|
||
<li>Blue: a blue variant of the old Learn theme, coming tinted in blue, dark sidebar and light content area</li>
|
||
<li>Green: a green variant of the old Learn theme, coming tinted in green, dark sidebar and light content area</li>
|
||
<li>Red: a red variant of the old Learn theme, coming tinted in red, dark sidebar and light content area</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
<h2 id="changing-the-variant">Changing the 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">Option</span></span> Set the <code>themeVariant</code> option to change the variant.</p>
|
||
<p>The theme offers the recommended <a href="/hugo-theme-relearn/configuration/branding/colors/index.html#theme-variant-advanced">advanced configuration mode</a> that combines the functionality for <a href="/hugo-theme-relearn/configuration/branding/colors/index.html#multiple-variants">multiple variants</a>, <a href="/hugo-theme-relearn/configuration/branding/colors/index.html#adjust-to-os-settings">OS setting adjustments</a>, and more.</p>
|
||
<h3 id="theme-variant">Simple Setup</h3>
|
||
<h4 id="single-variant">Single Variant</h4>
|
||
<p>Set <code>themeVariant</code> to your 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">'relearn-light'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariant"</span><span class="p">:</span> <span class="s2">"relearn-light"</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 your theme file in <code>assets/css</code> or <code>themes/hugo-theme-relearn/assets/css</code>. Name it <code>theme-*.css</code>.</p>
|
||
<p>In the above example, the path of your 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>To let the 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">'relearn-light'</span><span class="p">,</span> <span class="s1">'relearn-dark'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariant"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"relearn-light"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"relearn-dark"</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>The first variant is the default, and a selector will appear if there’s more than one.</p>
|
||
<h4 id="adjust-to-os-settings">Adjust to OS Settings</h4>
|
||
<p>Use the <code>auto</code> value to match OS light/dark settings. Usually it makes sense to set it in the first position and make it the 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">'auto'</span><span class="p">,</span> <span class="s1">'red'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariant"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"auto"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"red"</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 you don’t configure anything else, the theme will default to use <code>relearn-light</code> for light mode and <code>relearn-dark</code> for dark mode.</p>
|
||
<p>Default is <code>relearn-light</code> for light and <code>relearn-dark</code> for dark mode. These defaults are overwritten by the first two non-auto options of your <code>themeVariant</code> array.</p>
|
||
<p>You can override the default with <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">'learn'</span><span class="p">,</span> <span class="s1">'neon'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariantAuto"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"learn"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"neon"</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>The theme offers an advanced way to configure theme variants and all of the aspects above inside of a single configuration item. This comes with some features previously unsupported.</p>
|
||
<p>Like with the <a href="/hugo-theme-relearn/configuration/branding/colors/index.html#multiple-variants">multiple variants</a> option, you are defining your theme variants in an array but now in a table with suboptions.</p>
|
||
<p>Again, in this case, the first variant is the default chosen on first view and a variant selector will be shown in the menu footer if the array contains more than one entry.</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">'relearn-light'</span><span class="p">,</span> <span class="s1">'relearn-dark'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariant"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"relearn-light"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"relearn-dark"</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>you 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">'relearn-light'</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">'relearn-dark'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariant"</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">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-light"</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">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-dark"</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>The <code>identifier</code> option is mandatory and equivalent to the string in the first example. Further options can be configured, see the table 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><empty></em></td>
|
||
<td style="text-align: left">Must correspond to the name of a color variant either in your site’s or the theme’s directory in the form <code>assets/css/theme-<IDENTIFIER>.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">The name to be displayed in the variant selector. If not set, the identifier is used in a human readable form.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left">auto</td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">If set, the variant is treated as an <a href="/hugo-theme-relearn/configuration/branding/colors/index.html#adjust-to-os-settings">auto mode variant</a>. It has the same behavior as the <code>themeVariantAuto</code> option. The first entry in the array is the color variant for light mode, the second for dark mode. Defining auto mode variants with the advanced options has the benefit that you can now have multiple auto mode variants instead of just one with the simple options.</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<h4 id="example-configuration">Example Configuration</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">'relearn-auto'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Relearn Light/Dark'</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">'relearn-light'</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">'relearn-dark'</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">'relearn-bright'</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">'zen-light'</span><span class="p">,</span> <span class="s1">'zen-dark'</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">'zen-auto'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Zen Light/Dark'</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">'zen-light'</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">'zen-dark'</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">'learn'</span><span class="p">,</span> <span class="s1">'neon'</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">'retro-auto'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Retro Learn/Neon'</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">'neon'</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">'learn'</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">Relearn 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariant"</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">"auto"</span><span class="p">:</span> <span class="p">[],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-auto"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"Relearn Light/Dark"</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">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-light"</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">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-dark"</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">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-bright"</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">"auto"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"zen-light"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"zen-dark"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"identifier"</span><span class="p">:</span> <span class="s2">"zen-auto"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"Zen Light/Dark"</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">"identifier"</span><span class="p">:</span> <span class="s2">"zen-light"</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">"identifier"</span><span class="p">:</span> <span class="s2">"zen-dark"</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">"auto"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"learn"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"neon"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"identifier"</span><span class="p">:</span> <span class="s2">"retro-auto"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"Retro Learn/Neon"</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">"identifier"</span><span class="p">:</span> <span class="s2">"neon"</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">"identifier"</span><span class="p">:</span> <span class="s2">"learn"</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">Modifying Variants</h3>
|
||
<p>In case you like a shipped variant but only want to tweak some aspects, you have some choices. <strong>Don’t edit the file in the theme’s directory!</strong> You will lose the ability to later easily upgrade your theme to a newer version.</p>
|
||
<ol>
|
||
<li>
|
||
<p>Copy and change</p>
|
||
<p>You can copy the shipped variant file from the theme’s <code>themes/hugo-theme-relearn/assets/css</code> directory to the site’s <code>assets/css</code> directory and either store it with the same name or give it a new name. Edit the settings and save the new file. Afterwards, you can use it in your <code>hugo.toml</code> by the chosen name.</p>
|
||
</li>
|
||
<li>
|
||
<p>Create and import</p>
|
||
<p>You can create a new variant file in the site’s <code>assets/css</code> directory and give it a new name. Import the shipped variant, add the settings you want to change and save the new file. Afterwards, you can use it in your <code>hugo.toml</code> by the chosen name.</p>
|
||
<p>For example, you want to use the <code>relearn-light</code> variant but want to change the syntax highlighting schema to the one used in the <code>neon</code> variant. For that, create a new <code>assets/css/theme-my-branding.css</code> in your site’s directory and add the following lines:</p>
|
||
<div class="tab-panel" data-tab-group="8d4bc6e91e7813a1253c61ea8eb1aa7d">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="assetscsstheme-my-brandingcss"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('8d4bc6e91e7813a1253c61ea8eb1aa7d','assetscsstheme-my-brandingcss')"
|
||
>
|
||
<span class="tab-nav-text">assets/css/theme-my-branding.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">"theme-relearn-light.css"</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 of the 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 for 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 for 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 in your <code>hugo.toml</code> to use your 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">'my-branding'</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-branding</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariant"</span><span class="p">:</span> <span class="s2">"my-branding"</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 to <em>copy and change</em>, this has the advantage that you profit from any adjustments to the <code>relearn-light</code> variant while keeping your modifications.</p>
|
||
</li>
|
||
</ol>
|
||
<h3 id="react-to-variant-switches-in-javascript">React to Variant Switches in JavaScript</h3>
|
||
<p>Once a color variant is fully loaded, either initially or by switching the color variant manually with the variant selector, the custom event <code>themeVariantLoaded</code> on the <code>document</code> will be dispatched. You can add an event listener and react to changes.</p>
|
||
<div class="tab-panel" data-tab-group="0e0d4639c7436ef4c22de283aede9533">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="javascript"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('0e0d4639c7436ef4c22de283aede9533','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">'themeVariantLoaded'</span><span class="p">,</span> <span class="kd">function</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="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/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 Syntax Highlighting</h2>
|
||
<p>If you want to switch the syntax highlighting theme together with your color variant, first you need to configure your installation <a href="https://gohugo.io/content-management/syntax-highlighting/#generate-syntax-highlighter-css" rel="external" target="_self">according to Hugo’s documentation</a> to provide a syntax highlighting 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">markup</span><span class="p">]</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">[</span><span class="nx">markup</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">markup</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">"markup"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"highlight"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"noClasses"</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>You can use one of the shipped stylesheet files or use Hugo to generate a file for you.</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 > chroma-mycode.css</span></span></code></pre></div>
|
||
<p>The file must be written to <code>assets/css/chroma-<NAME>.css</code>. To use it with your color variant, you have to modify <code>--CODE-theme: <NAME></code> in the color variant stylesheet file.</p>
|
||
<div class="tab-panel" data-tab-group="6d57a5804524bc8ac60658b9dddf65d0">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="assetscsstheme-my-brandingcss"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('6d57a5804524bc8ac60658b9dddf65d0','assetscsstheme-my-brandingcss')"
|
||
>
|
||
<span class="tab-nav-text">assets/css/theme-my-branding.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">"theme-relearn-light.css"</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 of the 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 Theming</h2>
|
||
<p>Some of the shipped shortcodes are using 3rd-party libraries. See the individual shortcode documentation on how to change their theming.</p>
|
||
<ul>
|
||
<li><a href="/hugo-theme-relearn/shortcodes/mermaid/index.html#setting-a-specific-mermaid-theme"><code>mermaid</code> shortcode</a></li>
|
||
<li><a href="/hugo-theme-relearn/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="Categories" 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/categories/howto/index.html">Howto</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="stylesheet-generator">Stylesheet Generator</h1>
|
||
|
||
<p>This interactive tool may help you to generate your own color variant stylesheet.</p>
|
||
<div class="expand">
|
||
<input type="checkbox" id="R-expand-af45d1f019f72706179341311925b801" aria-controls="R-expandcontent-af45d1f019f72706179341311925b801">
|
||
<label class="expand-label" for="R-expand-af45d1f019f72706179341311925b801">
|
||
<i class="expander-icon fa-fw fas fa-chevron-down"></i>
|
||
<i class="expander-icon fa-fw fas fa-chevron-right"></i> Show usage instructions
|
||
</label>
|
||
<div id="R-expandcontent-af45d1f019f72706179341311925b801" class="expand-content">
|
||
<p>To get started, first select a color variant from the variant selector in the lower left sidebar that fits you best as a starting point.</p>
|
||
<p>The graph is interactive and reflects the current colors. You can click on any of the colored boxes to adjust the respective color. The graph <strong>and the page</strong> will update accordingly.</p>
|
||
<p>The arrowed lines reflect how colors are inherited through different parts of the theme if the descendant isn’t overwritten. If you want to delete a color and let it inherit from its parent, just delete the value from the input field.</p>
|
||
<p>To better understand this, select the <code>neon</code> variant and modify the different heading colors. There, colors for the headings <code>h2</code>, <code>h3</code> and <code>h4</code> are explicitly set. <code>h5</code> is not set and inherits its value from <code>h4</code>. <code>h6</code> is also not set and inherits its value from <code>h5</code>.</p>
|
||
<p>Once you’ve changed a color, the variant selector will show a “My custom variant” entry and your changes are stored in the browser. You can <strong>browse to other pages</strong> and even close the browser <strong>without losing your changes</strong>.</p>
|
||
<p>Once you are satisfied, you can download the new variants file and copy it into your site’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">Option</span></span> Afterwards, you have to adjust the <code>themeVariant</code> option in your <code>hugo.toml</code> to your chosen file name. For example, if your new variants file is named <code>theme-my-custom-variant.css</code>, you have to set <code>themeVariant='my-custom-variant'</code> to use it.</p>
|
||
<p>See the docs for <a href="/hugo-theme-relearn/configuration/branding/colors/index.html">further configuration options</a>.</p>
|
||
</div>
|
||
</div>
|
||
<p><span class="btn cstyle interactive secondary"><button onclick="window.variants&&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&&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&&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&&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="Categories" 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/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/configuration/sidebar/width/index.html">Width</a></h2><p>Changing the width of the sidebar</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sidebar/headerfooter/index.html">Header & Footer</a></h2><p>Configure the header and footer</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sidebar/search/index.html">Search</a></h2><p>Configure search and the search form</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/sidebar/shortcutmenu/index.html">Shortcut Menu</a></h2><p>Add additional shortcut links to the sidebar</p>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/reference/index.html">Reference</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<section>
|
||
<h1 class="a11y-only">Subsections of Sidebar</h1>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="width">Width</h1>
|
||
|
||
<p>The theme adjusts the menu width based on browser size.</p>
|
||
<p>If you want to change the chosen default width, you can add CSS variables to <code>layouts/partials/custom-header.html</code>.</p>
|
||
<h2 id="changing-menu-width">Changing Menu Width</h2>
|
||
<p>The menu width changes for 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">< 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">>= 60rem</td>
|
||
<td style="text-align: left">18.75rem</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<p>You can change the menu width but not the screen width breakpoints.</p>
|
||
<p>To adjust the menu width, use these CSS variables. Note that <code>--MENU-WIDTH-S</code> is for the mobile menu flyout on small screens.</p>
|
||
<div class="tab-panel" data-tab-group="153206a081f9180bc890bc04a9422b0b">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="layoutspartialscustom-headerhtml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('153206a081f9180bc890bc04a9422b0b','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"><</span><span class="nt">style</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">--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"></</span><span class="nt">style</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="Categories" 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/categories/howto/index.html">Howto</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="header--footer">Header & 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">Option</span></span> With the <a href="/hugo-theme-relearn/configuration/branding/logo/index.html#change-the-logo">default partials</a> for the logo, The site title will also be used for the text at the top of the sidebar. If you want to show a different text in the sidebar, you 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">'Relearn'</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">Relearn</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"linkTitle"</span><span class="p">:</span> <span class="s2">"Relearn"</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 Configuration</h2>
|
||
<p>By default, the theme displays a home button between search form and navigation menu. The Home button serves as an alternative to clicking the logo.</p>
|
||
<p><a href="#R-image-37145845faa4df3d2da01f024e734a5b" 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-37145845faa4df3d2da01f024e734a5b"><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">Option</span></span> To hide the Home button on the 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableLandingPageButton"</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">Option</span></span> To change its icon or text, configure the <code>landingPageName</code> for your 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">'<i class="fa-fw fas fa-home"></i> Home'</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">'<i class="fa-fw fas fa-home"></i> Arrr! Homme'</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"><i class="fa-fw fas fa-home"></i> 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"><i class="fa-fw fas fa-home"></i> 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">"languages"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"en"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"landingPageName"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-home\"\u003e\u003c/i\u003e Home"</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">"pir"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"landingPageName"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-home\"\u003e\u003c/i\u003e Arrr! Homme"</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 option isn’t set for 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">'<i class="fa-fw fas fa-home"></i> Home'</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"><i class="fa-fw fas fa-home"></i> 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"landingPageName"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-home\"\u003e\u003c/i\u003e Home"</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">Option</span></span> Turn on <code>showVisitedLinks=true</code> to see checkmarks next to visited pages in the main menu. This also adds a <code>Clear History</code> option at the bottom of the menu to remove all checkmarks. Note that checkmarks will disappear if you rebuild your site, as the page 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"showVisitedLinks"</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>To change the menu footer, edit the <code>layouts/partials/menu-footer.html</code> file. Check out the <a href="/hugo-theme-relearn/configuration/customization/partials/index.html">Partials section</a> for more ways to customize your site.</p>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/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>The theme offers three levels of search through the menu’s search form:</p>
|
||
<ol>
|
||
<li>In-page search: Highlights search terms on the current page</li>
|
||
<li>Search popup: Opens a popup with results from other pages</li>
|
||
<li>Dedicated search page: Accessible by clicking the magnifier glass or pressing <kbd>ENTER</kbd></li>
|
||
</ol>
|
||
<p>Each level requires the previous one to be enabled. If no search is configured, the search form won’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">Option</span></span> All levels are enabled by default. Disable them in <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 page: <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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableSearch"</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">"disableSearchIndex"</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">"disableSearchPage"</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">Option</span></span> Default URLs can be changed with the following parameter</p>
|
||
<ul>
|
||
<li>Search popup: <code>searchindex.js</code> set by <code>searchIndexURL</code></li>
|
||
<li>Dedicated search page: <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">'omnisearchindex.js'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">searchPageURL</span> <span class="p">=</span> <span class="s1">'omnisearch'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"searchIndexURL"</span><span class="p">:</span> <span class="s2">"omnisearchindex.js"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"searchPageURL"</span><span class="p">:</span> <span class="s2">"omnisearch"</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> Note
|
||
</div>
|
||
<div class="box-content">
|
||
<p>Only change these if you have content at those URLs. This can happen with <code>uglyURLs=true</code> in <code>hugo.toml</code> and having a content file at <code>content/search.md</code>.</p>
|
||
<p>Check for duplicate URLs by running <code>hugo --printPathWarnings</code>.</p>
|
||
</div>
|
||
</div>
|
||
<h2 id="supported-languages">Supported Languages</h2>
|
||
<p>The <a href="https://lunrjs.com" rel="external" target="_self">Lunr</a> search library doesn’t support all languages of the theme. Unsupported languages will show errors in the browser console. Currently unsupported are</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">Option</span></span> In case your page’s content contains text in multiple languages (for example, you are writing a Piratish documentation for your English API), you can set those languages in <code>additionalContentLanguage</code> to broaden the 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">'en'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"additionalContentLanguage"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"en"</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>You can add multiple languages to this array.</p>
|
||
<div class="box notices cstyle note">
|
||
<div class="box-label">
|
||
<i class="fa-fw fas fa-exclamation-circle"></i> Note
|
||
</div>
|
||
<div class="box-content">
|
||
<p>Use the base language code. For example, if your page is using <code>zh-CN</code>, add <code>zh</code> to this parameter.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/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>The sidebar contains your content’s navigation menu, but you can also add extra menu entries or shortcuts in a separate section.</p>
|
||
<p>For internal links, use the <code>pageRef</code> property instead of <code>url</code>. Learn more about <a href="https://gohugo.io/content-management/menus/#define-in-site-configuration" rel="external" target="_self">Hugo’s menu configuration</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">Option</span></span> By default, the shortcut menu has a title ("<em>More</em>" in English).</p>
|
||
<p>You can disable this title with <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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableShortcutsTitle"</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>To change the title, update your local i18n translation file.</p>
|
||
<div class="tab-panel" data-tab-group="914a3ef70d88fc93b3b5681c0f126c8d">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="i18nentoml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('914a3ef70d88fc93b3b5681c0f126c8d','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">"Other Great Stuff"</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> and add <code>[[menu.shortcuts]]</code> entries for 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">'ds'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'<i class="fa-fw fab fa-github"></i> GitHub Repo'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">'https://github.com/McShelby/hugo-theme-relearn'</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">'<i class="fa-fw fas fa-camera"></i> Showcases'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/showcase'</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">'hugodoc'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'<i class="fa-fw fas fa-bookmark"></i> Hugo Documentation'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">'https://gohugo.io/'</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">'<i class="fa-fw fas fa-bullhorn"></i> Credits'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/more/credits'</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">'<i class="fa-fw fas fa-tags"></i> Tags'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/tags'</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"><i class="fa-fw fab fa-github"></i> 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"><i class="fa-fw fas fa-camera"></i> 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"><i class="fa-fw fas fa-bookmark"></i> Hugo Documentation</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"><i class="fa-fw fas fa-bullhorn"></i> 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"><i class="fa-fw fas fa-tags"></i> 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">"menu"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"shortcuts"</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">"identifier"</span><span class="p">:</span> <span class="s2">"ds"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fab fa-github\"\u003e\u003c/i\u003e GitHub Repo"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"url"</span><span class="p">:</span> <span class="s2">"https://github.com/McShelby/hugo-theme-relearn"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-camera\"\u003e\u003c/i\u003e Showcases"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/showcase"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"identifier"</span><span class="p">:</span> <span class="s2">"hugodoc"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-bookmark\"\u003e\u003c/i\u003e Hugo Documentation"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"url"</span><span class="p">:</span> <span class="s2">"https://gohugo.io/"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-bullhorn\"\u003e\u003c/i\u003e Credits"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/more/credits"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-tags\"\u003e\u003c/i\u003e Tags"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/tags"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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 for each language in <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">'English'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">'Hugo Relearn Theme'</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">'ds'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'<i class="fa-fw fab fa-github"></i> GitHub Repo'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">'https://github.com/McShelby/hugo-theme-relearn'</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">'<i class="fa-fw fas fa-camera"></i> Showcases'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/showcase'</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">'hugodoc'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'<i class="fa-fw fas fa-bookmark"></i> Hugo Documentation'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">'https://gohugo.io/'</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">'<i class="fa-fw fas fa-bullhorn"></i> Credits'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/more/credits'</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">'<i class="fa-fw fas fa-tags"></i> Tags'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/tags'</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">'Arrr! Pirrratish'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">'Captain Hugo Relearrrn Theme'</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">'ds'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'<i class="fa-fw fab fa-github"></i> GitHub Repo'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">'https://github.com/McShelby/hugo-theme-relearn'</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">'<i class="fa-fw fas fa-camera"></i> Showcases'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/showcase'</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">'hugodoc'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'<i class="fa-fw fas fa-bookmark"></i> Captain Hugo Documentation'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">url</span> <span class="p">=</span> <span class="s1">'https://gohugo.io/'</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">'<i class="fa-fw fas fa-bullhorn"></i> Crrredits'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/more/credits'</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">'<i class="fa-fw fas fa-tags"></i> Arrr! Tags'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">pageRef</span> <span class="p">=</span> <span class="s1">'/tags'</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"><i class="fa-fw fab fa-github"></i> 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"><i class="fa-fw fas fa-camera"></i> 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"><i class="fa-fw fas fa-bookmark"></i> Hugo Documentation</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"><i class="fa-fw fas fa-bullhorn"></i> 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"><i class="fa-fw fas fa-tags"></i> 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">Hugo Relearn 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"><i class="fa-fw fab fa-github"></i> 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"><i class="fa-fw fas fa-camera"></i> 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"><i class="fa-fw fas fa-bookmark"></i> Captain Hugo Documentation</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"><i class="fa-fw fas fa-bullhorn"></i> 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"><i class="fa-fw fas fa-tags"></i> 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">"languages"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"en"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"languageName"</span><span class="p">:</span> <span class="s2">"English"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"menu"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"shortcuts"</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">"identifier"</span><span class="p">:</span> <span class="s2">"ds"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fab fa-github\"\u003e\u003c/i\u003e GitHub Repo"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"url"</span><span class="p">:</span> <span class="s2">"https://github.com/McShelby/hugo-theme-relearn"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-camera\"\u003e\u003c/i\u003e Showcases"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/showcase"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"identifier"</span><span class="p">:</span> <span class="s2">"hugodoc"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-bookmark\"\u003e\u003c/i\u003e Hugo Documentation"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"url"</span><span class="p">:</span> <span class="s2">"https://gohugo.io/"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-bullhorn\"\u003e\u003c/i\u003e Credits"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/more/credits"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-tags\"\u003e\u003c/i\u003e Tags"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/tags"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"title"</span><span class="p">:</span> <span class="s2">"Hugo Relearn Theme"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"pir"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"languageName"</span><span class="p">:</span> <span class="s2">"Arrr! Pirrratish"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"menu"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"shortcuts"</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">"identifier"</span><span class="p">:</span> <span class="s2">"ds"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fab fa-github\"\u003e\u003c/i\u003e GitHub Repo"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"url"</span><span class="p">:</span> <span class="s2">"https://github.com/McShelby/hugo-theme-relearn"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-camera\"\u003e\u003c/i\u003e Showcases"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/showcase"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"identifier"</span><span class="p">:</span> <span class="s2">"hugodoc"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-bookmark\"\u003e\u003c/i\u003e Captain Hugo Documentation"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"url"</span><span class="p">:</span> <span class="s2">"https://gohugo.io/"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-bullhorn\"\u003e\u003c/i\u003e Crrredits"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/more/credits"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"name"</span><span class="p">:</span> <span class="s2">"\u003ci class=\"fa-fw fas fa-tags\"\u003e\u003c/i\u003e Arrr! Tags"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"pageRef"</span><span class="p">:</span> <span class="s2">"/tags"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">"title"</span><span class="p">:</span> <span class="s2">"Captain Hugo Relearrrn Theme"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"weight"</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">Displaying Pages Only in the Shortcuts Menu</h2>
|
||
<p>To show pages only in the shortcuts menu you 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> in its own folder with the below front matter. The branch bundle will <strong>not</strong> be contained in the 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">'Showcase'</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">'never'</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">'always'</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">"_build"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"list"</span><span class="p">:</span> <span class="s2">"never"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"publishResources"</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">"render"</span><span class="p">:</span> <span class="s2">"always"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"title"</span><span class="p">:</span> <span class="s2">"Showcase"</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 page inside a headless branch bundle with the following front matter in the bundle. This causes the child but not the branch bundle to be contained in the 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">'never'</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">'never'</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">"_build"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"list"</span><span class="p">:</span> <span class="s2">"never"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"publishResources"</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">"render"</span><span class="p">:</span> <span class="s2">"never"</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>The child page can be any type of content.</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">'Credits'</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">"title"</span><span class="p">:</span> <span class="s2">"Credits"</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="Categories" 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/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/configuration/content/width/index.html">Width</a></h2><p>Changing the content area width</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/content/titles/index.html">Titles & Breadcrumbs</a></h2><p>Configuring titles and breadcrumbs to your needs</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/content/headings/index.html">Headings</a></h2><p>Configuring heading anchors</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/content/linking/index.html">Linking</a></h2><p>What options are available for links and images</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/content/hidden/index.html">Hidden Pages</a></h2><p>Learn about the hidden pages feature</p>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/reference/index.html">Reference</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<section>
|
||
<h1 class="a11y-only">Subsections of Content</h1>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="width">Width</h1>
|
||
|
||
<p>The theme adjusts the content width when you resize your browser.</p>
|
||
<p>If you want to change the chosen default width, you can add CSS variables to <code>layouts/partials/custom-header.html</code>.</p>
|
||
<h2 id="changing-the-main-areas-maximum-width">Changing the Main Area’s Maximum Width</h2>
|
||
<p>The main area has a default maximum width of <code>80.25rem</code> for better readability. If you want to change this, you can set a CSS variable</p>
|
||
<p>For full width, use a large value like <code>1000rem</code>.</p>
|
||
<div class="tab-panel" data-tab-group="c355293e765495f83c017e14509d2b88">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="layoutspartialscustom-headerhtml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('c355293e765495f83c017e14509d2b88','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"><</span><span class="nt">style</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">--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"></</span><span class="nt">style</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="Categories" 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/categories/howto/index.html">Howto</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="titles--breadcrumbs">Titles & Breadcrumbs</h1>
|
||
|
||
<h2 id="breadcrumbs">Breadcrumbs</h2>
|
||
<p>Learn how to turn off the breadcrumbs completely and further <a href="/hugo-theme-relearn/authoring/frontmatter/topbar/index.html">configure the 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">Option</span></span> Set <code>disableRootBreadcrumb=true</code> to remove the root breadcrumb which often feels redundant. This will also apply to the breadcrumbs of the search results and taxonomy pages.</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">Option</span></span> You can override the default breadcrumb separator by using <code>breadcrumbSeparator='/'</code>. This separator will also be used in the breadcrumbs of the search results and taxonomy pages.</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">Option</span></span> By default the term pages of a taxonomy will display the breadcrumb for each page. Set <code>disableTermBreadcrumbs=true</code> to remove the breadcrumb if the term pages look to 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">'/'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"breadcrumbSeparator"</span><span class="p">:</span> <span class="s2">"/"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableRootBreadcrumb"</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">"disableTermBreadcrumbs"</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">Option</span></span> You can override the default title separator by using <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">'|'</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">'|'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"titleSeparator"</span><span class="p">:</span> <span class="s2">"|"</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="Categories" 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/categories/howto/index.html">Howto</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="headings">Headings</h1>
|
||
|
||
<p>Headings can have anchor links that appear when you hover over them.</p>
|
||
<p>You can change what happens when you click the anchor icon in your <code>hugo.toml</code> file. By default, all options are turned on. If you turn off all options, no anchor icon will show up when you 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">Option</span></span> Set <code>disableAnchorCopy=true</code> to prevent copying the anchor link when you click the icon.</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableAnchorCopy"</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 to Heading</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">Option</span></span> Set <code>disableAnchorScrolling=true</code> to stop the page from scrolling to the heading when you click the anchor icon.</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">disableAnchorScrolling</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">disableAnchorScrolling</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableAnchorScrolling"</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="Categories" 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/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/authoring/frontmatter/linking/index.html">settings are available</a> to be used in your configuration 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">Option</span></span> By default, the theme adds <code>index.html</code> to page links when <code>uglyURLs=false</code> (Hugo’s default).</p>
|
||
<p>If you’re only using a web server scenario and dislike this, you can reset to Hugo’s default behavior by settings <code>disableExplicitIndexURLs=true</code>.</p>
|
||
<p>For the file system scenario, you are not allowed to 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableExplicitIndexURLs"</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">Patching the <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">Option</span></span> While the usage of <code>relref</code> is obsolete and discouraged by Hugo for a while, existing installations may still use it.</p>
|
||
<p>In configurations using a <strong>baseURL</strong> with a <strong>subdirectory</strong> and having <strong>relativeURLs=false</strong> (the default), Hugo’s standard <code>relref</code> implementation is failing.</p>
|
||
<p>To work around this, you can activate a patched version of the shortcode by setting <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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableDefaultRelref"</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="Categories" 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/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 you to <a href="/hugo-theme-relearn/authoring/meta/index.html#hidden">create hidden pages</a>.</p>
|
||
<p>Hidden pages are created but not shown in the navigation. This is useful for pages you only want to access via a direct link.</p>
|
||
<p>When you visit a hidden page’s URL, it will appear in the navigation menu.</p>
|
||
<p>Hidden pages can also have hidden subpages, creating multiple levels of hiding.</p>
|
||
<p>By default, hidden pages are only hidden from human visitors. Search engines can still find them by crawling your site and the pages are linked in your taxonomies and site search. You can prevent this with these options.</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">Option</span></span> To remove hidden pages 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableSearchHiddenPages"</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">Option</span></span> To hide pages from search engines by removing them from the sitemap, RSS feed and <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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableSeoHiddenPages"</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">Option</span></span> To prevent hidden pages from appearing on taxonomy and term pages, use <code>disableTagHiddenPages=true</code>. If this makes a term’s count zero, an empty term page 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableTagHiddenPages"</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="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/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/configuration/customization/partials/index.html">Partials</a></h2><p>Modifying partials to your needs</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/customization/dependencies/index.html">Extending Scripts</a></h2><p>Add further code to your site</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/customization/imageeffects/index.html">Image Effects</a></h2><p>How to extend image effects</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/customization/topbar/index.html">Topbar</a></h2><p>How to extend the topbar</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/customization/designs/index.html">Page Designs</a></h2><p>Extending page designs</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/customization/outputformats/index.html">Output Formats</a></h2><p>Adding Custom Output Formats</p>
|
||
<h2><a href="/hugo-theme-relearn/configuration/customization/taxonomy/index.html">Taxonomies</a></h2><p>How to display custom taxonomies on your pages</p>
|
||
</div>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/reference/index.html">Reference</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<section>
|
||
<h1 class="a11y-only">Subsections of Customization</h1>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="partials">Partials</h1>
|
||
|
||
<h2 id="usable-partials">Usable Partials</h2>
|
||
<p>You can call other partials from <code>themes/hugo-relearn-themes/</code> besides those in <code>themes/hugo-relearn-themes/layouts/partials/_relearn</code>. However, using partials not mentioned as customizable below might make future updates more challenging.</p>
|
||
<h2 id="customizable-partials">Customizable Partials</h2>
|
||
<p>The Relearn theme allows you to customize various parts of the theme by overriding partials. This makes the theme highly configurable.</p>
|
||
<p>A good rule to follow: The less code a partial contains, the easier it will be to update the theme in the future.</p>
|
||
<p>Here’s a list of partials you can safely override:</p>
|
||
<ul>
|
||
<li>
|
||
<p><code>layouts/partials/content.html</code>: The main content of a page. Override this to display additonal page metadata.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/content-header.html</code>: The header above the title. By default, it shows tags, but you can change this.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/content-footer.html</code>: The footer below the content. By default, it shows author info, modification dates, and categories. You can customize this.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/custom-header.html</code>: For adding custom CSS. Remember to include the <code>style</code> HTML tag.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/custom-footer.html</code>: For adding custom JavaScript. Remember to include the <code>script</code> HTML tag.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/favicon.html</code>: The favicon. You should definitely customize this.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/heading.html</code>: the page’s title headings</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/heading-pre.html</code>: Add content before the page’s title headings. Remember to consider the <code>headingPre</code> front matter.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/heading-post.html</code>: Add content after the page’s title headings. Remember to consider the <code>headingPost</code> front matter.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/logo.html</code>: The logo in the top left corner. You should customize this.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/menu-pre.html</code>: Add content before menu items. Remember to consider the <code>menuPre</code> front matter.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/menu-post.html</code>: Add content after menu items. Remember to consider the <code>menuPost</code> front matter.</p>
|
||
</li>
|
||
<li>
|
||
<p><code>layouts/partials/menu-footer.html</code>: The footer of the left menu.</p>
|
||
</li>
|
||
</ul>
|
||
<p>You 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="Categories" 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/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 question is how to add extra CSS styles or JavaScript to your site. This depends on what you need.</p>
|
||
<h2 id="adding-javascript-or-stylesheets-to-all-pages">Adding JavaScript or Stylesheets to All Pages</h2>
|
||
<p>To add JavaScript files or CSS stylesheets to every page, you can include them in <code>layouts/partials/custom-header.html</code> or <code>layouts/partials/custom-footer.html</code>.</p>
|
||
<p>However, this can make your site larger than necessary if these files are only needed on a few pages. The next section explains how to add dependencies only when needed.</p>
|
||
<h2 id="custom-shortcodes-with-dependencies">Custom Shortcodes with Dependencies</h2>
|
||
<p>Some shortcodes need extra JavaScript and CSS files. The theme only loads these when the shortcode is used. You can use this for your own shortcodes too.</p>
|
||
<p>For example, to create a shortcode called <code>myshortcode</code> that needs the <code>jquery</code> library:</p>
|
||
<ol>
|
||
<li>
|
||
<p>Create the shortcode file <code>layouts/shortcodes/myshortcode.html</code> and add the folloging line somewhere:</p>
|
||
<div class="tab-panel" data-tab-group="5396f6c49af00c0ffdf08d18344ee766">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="layoutsshortcodesmyshortcodehtml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('5396f6c49af00c0ffdf08d18344ee766','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">Page</span><span class="p">.</span><span class="nx">Store</span><span class="p">.</span><span class="nx">Set</span> <span class="s">"hasMyShortcode"</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">Option</span></span> Add this to your <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">'MyShortcode'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"relearn"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"dependencies"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"myshortcode"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"MyShortcode"</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="9bca6f4748c31fc42e76d70ad72f465c">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="layoutspartialsdependenciesmyshortcodehtml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('9bca6f4748c31fc42e76d70ad72f465c','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">location</span> <span class="s">"footer"</span> <span class="p">}}</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p"><</span><span class="nx">script</span> <span class="nx">src</span><span class="p">=</span><span class="s">"https://www.unpkg.com/jquery/dist/jquery.js"</span><span class="p">><</span><span class="o">/</span><span class="nx">script</span><span class="p">></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 casing is relevant!</li>
|
||
<li>The <code>name</code> in <code>hugo.toml</code> must match the <code>Store</code> key used in the shortcode file, prefixed with a <code>has</code>.</li>
|
||
<li>The key of <code>relearn.dependencies</code> must match the loader file name.</li>
|
||
</ul>
|
||
<p>See the <code>math</code>, <code>mermaid</code>, and <code>openapi</code> shortcodes for examples.</p>
|
||
<div class="box notices cstyle note">
|
||
<div class="box-label">
|
||
<i class="fa-fw fas fa-exclamation-circle"></i> Note
|
||
</div>
|
||
<div class="box-content">
|
||
<p>For advanced customization, you can use the dependency loader in your 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">"dependencies.gotmpl"</span> <span class="p">(</span><span class="nx">dict</span> <span class="s">"page"</span> <span class="p">.</span> <span class="s">"location"</span> <span class="s">"mylocation"</span><span class="p">)</span> <span class="p">}}</span></span></span></code></pre></div>
|
||
</div>
|
||
</div>
|
||
<p>Give a unique name for the <code>location</code> parameter when you call it, so you can distinguish your loaders behavior depending on the location it was called from.</p>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/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 page shows you, how to configure custom <a href="/hugo-theme-relearn/authoring/markdown/index.html#image-effects">image effects</a> on top of existing ones.</p>
|
||
<p>This setting can also <a href="/hugo-theme-relearn/authoring/imageeffects/index.html">be overridden by your front matter</a>.</p>
|
||
<p>If you don’t configure anything in your <code>hugo.toml</code>, the image effects default to</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">​</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">"imageEffects"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"border"</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">"lazy"</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">"lightbox"</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">"shadow"</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">Configuration</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">Option</span></span> You can change these settings in your <code>hugo.toml</code> and add arbitrary custom effects as boolean values (like <code>bg-white</code> in the 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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"imageEffects"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"bg-white"</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">"border"</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">"lazy"</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 in</p>
|
||
<div class="tab-panel" data-tab-group="config-code">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</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">"imageEffects"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"bg-white"</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">"border"</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">"lazy"</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">"lightbox"</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">"shadow"</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>With this configuration in effect, the following URL</p>
|
||
<div class="tab-panel" data-tab-group="4560f0e08c3928023dc3e4ed89fd199e">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="markdown"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('4560f0e08c3928023dc3e4ed89fd199e','markdown')"
|
||
>
|
||
<span class="tab-nav-text">Markdown</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 in</p>
|
||
<div class="tab-panel" data-tab-group="0528b93e5719607b01daefe3e650c17d">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="html"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('0528b93e5719607b01daefe3e650c17d','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"><</span><span class="nt">img</span> <span class="na">src</span><span class="o">=</span><span class="s">"https://octodex.github.com/images/minion.png"</span> <span class="na">loading</span><span class="o">=</span><span class="s">"lazy"</span> <span class="na">alt</span><span class="o">=</span><span class="s">"Minion"</span> <span class="na">class</span><span class="o">=</span><span class="s">"bg-white border nolazy lightbox noshadow"</span><span class="p">></span></span></span></code></pre></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div><h2 id="styling-effects">Styling Effects</h2>
|
||
<p>If the resulting effect value is</p>
|
||
<ul>
|
||
<li><code>true</code>: add a class with the effect’s name</li>
|
||
<li><code>false</code>: add a class with the effect’s name and a “no” prefix</li>
|
||
</ul>
|
||
<p>Styles for default effects are contained in the theme. Add styles for your custom effects to <code>layouts/partials/content-header.html</code>.</p>
|
||
<p>For the above example you could add styles for both boolean cases:</p>
|
||
<div class="tab-panel" data-tab-group="f8cb2fe91184b1c2f504aa347ff07fbd">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="layoutspartialscontent-headerhtml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('f8cb2fe91184b1c2f504aa347ff07fbd','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"><</span><span class="nt">style</span><span class="p">></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"></</span><span class="nt">style</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="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/categories/howto/index.html">Howto</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
<article class="default">
|
||
<header class="headline">
|
||
</header>
|
||
|
||
<h1 id="topbar">Topbar</h1>
|
||
|
||
<p>The theme comes with a reasonably configured topbar. You can learn how to <a href="/hugo-theme-relearn/authoring/frontmatter/topbar/index.html">configure the defaults in this section</a>.</p>
|
||
<p><a href="#R-image-a41e915d18627721e31d479fa0d17628" 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-a41e915d18627721e31d479fa0d17628"><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, your requirements may differ from this configuration. Luckily, the theme has you covered as the topbar, its buttons, and the functionality behind these buttons are fully configurable by you.</p>
|
||
<div class="box notices cstyle tip">
|
||
<div class="box-label">
|
||
<i class="fa-fw fas fa-lightbulb"></i> Tip
|
||
</div>
|
||
<div class="box-content">
|
||
<p>All mentioned file names below can be clicked and show you the implementation for a better understanding.</p>
|
||
</div>
|
||
</div>
|
||
<h2 id="areas">Areas</h2>
|
||
<p>The default configuration comes with three predefined areas that may contain an arbitrary set of buttons.</p>
|
||
<p><a href="#R-image-7e959fae2d6212610b73b3cdf29c9f19" class="lightbox-link"><img alt="topbar with 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-7e959fae2d6212610b73b3cdf29c9f19"><img alt="topbar with 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 and 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 the opposite breadcrumb side in comparison to the <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 pressing the <span class="btn cstyle transparent"><span><i class="fa-fw fas fa-ellipsis-v"></i></span></span> <em>more</em> button in the topbar</li>
|
||
</ul>
|
||
<p>While you cannot add additional areas in the topbar, you are free to configure additional buttons that behave like the <em>more</em> button, providing further user-defined areas.</p>
|
||
<h2 id="buttons">Buttons</h2>
|
||
<p>The theme ships with the following predefined buttons (from left to right in the 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 the sidebar flyout if in 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/authoring/frontmatter/topbar/index.html#table-of-contents">opens the table of contents in 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 to the editable page if the <code>editURL</code> <a href="/hugo-theme-relearn/authoring/frontmatter/topbar/index.html#edit-button">parameter is 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 to the chapter’s printable page if <a href="/hugo-theme-relearn/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 to the <a href="/hugo-theme-relearn/authoring/frontmatter/topbar/index.html#arrow-navigation">previous page</a> if there is 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 to the [next page]authoring/frontmatter/topbar(#arrow-navigation) if there is 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 the overlay for the <em>more</em> area</li>
|
||
</ul>
|
||
<p>Not all buttons are displayed at every given time. This is configurable (see below if interested).</p>
|
||
<h2 id="redefining-areas">Redefining Areas</h2>
|
||
<p>Each predefined area and button comes in its own file. By that, it is easy for you to overwrite an area file in your installation, reusing only the buttons you like.</p>
|
||
<p>E.g., you can redefine the predefined <em>end</em> area by adding the 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> in your installation (not in the theme itself) to remove all but the <em>more</em> button.</p>
|
||
<p>The below example sets an explicit value for the <code>onempty</code> parameter, overriding the specific default value for this button (these defaults vary depending on the button). The parameter causes the <em>more</em> button to always be displayed instead of hiding once its content is 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">"topbar/button/more.html"</span> <span class="p">(</span><span class="nx">dict</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s">"page"</span> <span class="p">.</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s">"onempty"</span> <span class="s">"disable"</span>
|
||
</span></span><span class="line"><span class="cl"><span class="p">)}}</span></span></span></code></pre></div>
|
||
<h2 id="defining-own-buttons">Defining Own Buttons</h2>
|
||
<h3 id="button-types">Button Types</h3>
|
||
<p>The theme distinguishes between two types of buttons:</p>
|
||
<ul>
|
||
<li><a href="/hugo-theme-relearn/configuration/customization/topbar/index.html#button"><strong>button</strong></a>: a clickable button that either browses to another site, triggers a user-defined script or opens an overlay containing user-defined content</li>
|
||
<li><a href="/hugo-theme-relearn/configuration/customization/topbar/index.html#area-button"><strong>area-button</strong></a>: the template for the <span class="btn cstyle transparent"><span><i class="fa-fw fas fa-ellipsis-v"></i></span></span> <em>more</em> button, to define your own area overlay buttons</li>
|
||
</ul>
|
||
<h3 id="button-parameter">Button Parameter</h3>
|
||
<h4 id="screen-widths-and-actions">Screen Widths and Actions</h4>
|
||
<p>Depending on the screen width, you can configure how the button should behave. Screen width is divided into three classes:</p>
|
||
<ul>
|
||
<li><strong>s</strong>: (controlled by the <code>onwidths</code> parameter) mobile layout where the menu sidebar is hidden</li>
|
||
<li><strong>m</strong>: (controlled by the <code>onwidthm</code> parameter) desktop layout with visible sidebar while the content area width still resizes</li>
|
||
<li><strong>l</strong>: (controlled by the <code>onwidthl</code> parameter) desktop layout with visible sidebar once the content area reached its maximum width</li>
|
||
</ul>
|
||
<p>For each width class, you can configure one of the following actions:</p>
|
||
<ul>
|
||
<li><code>show</code>: the button is displayed in its given area</li>
|
||
<li><code>hide</code>: the button is removed</li>
|
||
<li><code>area-XXX</code>: the button is moved from its given area into the area <code>XXX</code>; for example, this is used to move buttons to the <em>more</em> area overlay in the mobile layout</li>
|
||
</ul>
|
||
<h4 id="hiding-and-disabling-stuff">Hiding and Disabling Stuff</h4>
|
||
<p>While hiding a button depending on the screen size can be configured with the above-described <em>hide</em> action, you may want to hide the button on certain other conditions as well.</p>
|
||
<p>For example, the <em>print</em> button in its default configuration should only be displayed if print support was configured. This is done in your button template by checking the conditions first before displaying the 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 condition for hiding a button is if the displayed overlay is empty. This is the case for the <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 the <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>) and controlled by the parameter <code>onempty</code>.</p>
|
||
<p>This parameter can have one of the following values:</p>
|
||
<ul>
|
||
<li><code>disable</code>: the button is displayed in a disabled state if the overlay is empty</li>
|
||
<li><code>hide</code>: the button is removed if the overlay is empty</li>
|
||
</ul>
|
||
<p>If you want to disable a button containing <em>no overlay</em>, this can be achieved by an empty <code>href</code> parameter. An example can be seen in the <em>prev</em> button (see <code>layouts/partials/topbar/button/prev.html</code>) where the URL for the previous site may be empty.</p>
|
||
<h2 id="reference">Reference</h2>
|
||
<h3 id="button">Button</h3>
|
||
<p>Contains the basic button functionality and is used as a base implementation for 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 your own button templates if you want to implement a button without an overlay like the <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 with an overlay containing arbitrary content like the <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 displaying an area in the button’s overlay, see <a href="/hugo-theme-relearn/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>page</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Mandatory reference to the page.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>class</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Mandatory unique class name for this button. Displaying two buttons with the same value for <strong>class</strong> is undefined.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>href</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Either the destination URL for the button or JavaScript code to be executed on click.<br><br>- If starting with <code>javascript:</code> all following text will be executed in your browser<br>- Every other string will be interpreted as URL<br>- If empty, the button will be displayed in a disabled state regardless of its <strong>content</strong></td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>icon</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left"><a href="/hugo-theme-relearn/shortcodes/icon/index.html#finding-an-icon">Font Awesome icon name</a>.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>onempty</strong></td>
|
||
<td style="text-align: left"><code>disable</code></td>
|
||
<td style="text-align: left">Defines what to do with the button if the content parameter was set but ends up empty:<br><br>- <code>disable</code>: The button is displayed in a disabled state.<br>- <code>hide</code>: The button is 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">The action that should be executed if the site is displayed in the given width:<br><br>- <code>show</code>: The button is displayed in its given area<br>- <code>hide</code>: The button is removed.<br>- <code>area-XXX</code>: The button is moved from its given area into the 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><empty></em></td>
|
||
<td style="text-align: left">Arbitrary text displayed in the tooltip.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>title</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Arbitrary text for the button.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>content</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Arbitrary HTML to put into the content 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 the basic functionality to 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 your own button templates if you want to implement a button with an area overlay like the <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>page</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Mandatory reference to the page.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>area</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Mandatory unique area name for this area. Displaying two areas with the same value for <strong>area</strong> is undefined.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>icon</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left"><a href="/hugo-theme-relearn/shortcodes/icon/index.html#finding-an-icon">Font Awesome icon name</a>.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>onempty</strong></td>
|
||
<td style="text-align: left"><code>disable</code></td>
|
||
<td style="text-align: left">Defines what to do with the button if the content overlay is empty:<br><br>- <code>disable</code>: The button is displayed in a disabled state.<br>- <code>hide</code>: The button is 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">The action that should be executed if the site is displayed in the given width:<br><br>- <code>show</code>: The button is displayed in its given area<br>- <code>hide</code>: The button is removed.<br>- <code>area-XXX</code>: The button is moved from its given area into the 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><empty></em></td>
|
||
<td style="text-align: left">Arbitrary text displayed in the tooltip.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>title</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Arbitrary text for the button.</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<h3 id="predefined-buttons">Predefined Buttons</h3>
|
||
<p>The predefined buttons by the theme (all other buttons besides the <em>more</em> and <em>toc</em> button in <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 your own redefined area templates if you want to use default button behavior.</p>
|
||
<p>The <em><varying></em> parameter values are different for each button and configured for standard behavior as seen on this page.</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>page</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Mandatory reference to the page.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>onwidths</strong></td>
|
||
<td style="text-align: left"><em><varying></em></td>
|
||
<td style="text-align: left">The action that should be executed if the site is displayed in the given width:<br><br>- <code>show</code>: The button is displayed in its given area<br>- <code>hide</code>: The button is removed.<br>- <code>area-XXX</code>: The button is moved from its given area into the area <code>XXX</code>.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>onwidthm</strong></td>
|
||
<td style="text-align: left"><em><varying></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><varying></em></td>
|
||
<td style="text-align: left">See above.</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<h3 id="predefined-overlay-buttons">Predefined Overlay-Buttons</h3>
|
||
<p>The predefined buttons by the theme that open an overlay (the <em>more</em> and <em>toc</em> button in <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 your own redefined area templates if you want to use default button behavior utilizing overlay functionality.</p>
|
||
<p>The <em><varying></em> parameter values are different for each button and configured for standard behavior as seen on this page.</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>page</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Mandatory reference to the page.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>onempty</strong></td>
|
||
<td style="text-align: left"><code>disable</code></td>
|
||
<td style="text-align: left">Defines what to do with the button if the content overlay is empty:<br><br>- <code>disable</code>: The button is displayed in a disabled state.<br>- <code>hide</code>: The button is removed.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>onwidths</strong></td>
|
||
<td style="text-align: left"><em><varying></em></td>
|
||
<td style="text-align: left">The action that should be executed if the site is displayed in the given width:<br><br>- <code>show</code>: The button is displayed in its given area<br>- <code>hide</code>: The button is removed.<br>- <code>area-XXX</code>: The button is moved from its given area into the area <code>XXX</code>.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>onwidthm</strong></td>
|
||
<td style="text-align: left"><em><varying></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><varying></em></td>
|
||
<td style="text-align: left">See above.</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/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 page is displayed by exactly one page design. The Relearn theme offers the page designs <code>home</code>, <code>chapter</code>, and <code>default</code>.</p>
|
||
<p>A page design usually consists of</p>
|
||
<ul>
|
||
<li><a href="https://gohugo.io/content-management/archetypes/" rel="external" target="_self">an archetype file</a>: a template for creating new Markdown files with this design</li>
|
||
<li><a href="https://gohugo.io/templates/types/#content-view" rel="external" target="_self">content view files</a>: represented by <a href="https://gohugo.io/content-management/front-matter/#type" rel="external" target="_self">Hugo’s reserved <code>type</code> front matter</a> and backed by matching partials</li>
|
||
<li>CSS styles</li>
|
||
</ul>
|
||
<p>If no <code>type</code> is set in your front matter, the page is 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> Warning
|
||
</div>
|
||
<div class="box-content">
|
||
<p>Don’t use the <code>type</code> option in your modifications for other functionality!</p>
|
||
</div>
|
||
</div>
|
||
<p>All shipped designs use the theme’s framework from <code>themes/hugo-theme-learn/layouts/_default/baseof.html</code>, containing of the same topbar and sidebar but can change how content appears in the center of the page.</p>
|
||
<h2 id="using-a-page-design">Using a Page Design</h2>
|
||
<p>Regardless of shipped or custom page design, you are <a href="/hugo-theme-relearn/authoring/frontmatter/designs/index.html">using them</a> in the same way.</p>
|
||
<h2 id="creating-a-page-designs">Creating a Page Designs</h2>
|
||
<p>To make a custom page design:</p>
|
||
<ol>
|
||
<li>
|
||
<p>Choose a name (for example, <code>mydesign</code>)</p>
|
||
</li>
|
||
<li>
|
||
<p>Create a content view file at <code>layouts/mydesign/views/article.html</code></p>
|
||
<div class="tab-panel" data-tab-group="073f308cd39ce38f809ef5056da21e49">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="layoutsmydesignviewsarticlehtml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('073f308cd39ce38f809ef5056da21e49','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"><</span><span class="nt">article</span> <span class="na">class</span><span class="o">=</span><span class="s">"mydesign"</span><span class="p">></span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p"><</span><span class="nt">header</span> <span class="na">class</span><span class="o">=</span><span class="s">"headline"</span><span class="p">></span>
|
||
</span></span><span class="line"><span class="cl">{{ partial "content-header.html" . }}
|
||
</span></span><span class="line"><span class="cl"> <span class="p"></</span><span class="nt">header</span><span class="p">></span>
|
||
</span></span><span class="line"><span class="cl"><span class="p"><</span><span class="nt">div</span> <span class="na">class</span><span class="o">=</span><span class="s">"article-subheading"</span><span class="p">></span>AWESOME<span class="p"></</span><span class="nt">div</span><span class="p">></span>
|
||
</span></span><span class="line"><span class="cl">{{ partial "heading-pre.html" . }}{{ partial "heading.html" . }}{{ partial "heading-post.html" . }}
|
||
</span></span><span class="line"><span class="cl">{{ partial "article-content.html" . }}
|
||
</span></span><span class="line"><span class="cl"> <span class="p"><</span><span class="nt">footer</span> <span class="na">class</span><span class="o">=</span><span class="s">"footline"</span><span class="p">></span>
|
||
</span></span><span class="line"><span class="cl">{{ partial "content-footer.html" . }}
|
||
</span></span><span class="line"><span class="cl"> <span class="p"></</span><span class="nt">footer</span><span class="p">></span>
|
||
</span></span><span class="line"><span class="cl"><span class="p"></</span><span class="nt">article</span><span class="p">></span></span></span></code></pre></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div><p>In this file, you can customize the page design as needed. Typically, you’ll want to:</p>
|
||
<ul>
|
||
<li>Set a <code>class</code> at the <code>article</code> element for custom CSS styles</li>
|
||
<li>Use <code>{{ partial "article-content.html" . }}</code> to show your page content</li>
|
||
</ul>
|
||
</li>
|
||
<li>
|
||
<p>Create an archetype file at <code>archetypes/mydesign.md</code> (optional)</p>
|
||
<div class="tab-panel" data-tab-group="e01e70141c215c89b5860164361351fe">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="archetypesmydesignmd"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('e01e70141c215c89b5860164361351fe','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 = "{{ replace .Name "-" " " | title }}"
|
||
</span></span><span class="line"><span class="cl">type = "mydesign"
|
||
</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 is my new design.</span></span></code></pre></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div></li>
|
||
<li>
|
||
<p>Add CSS in file <code>layouts/partials/custom-header.html</code> (optional)</p>
|
||
<div class="tab-panel" data-tab-group="788b8baae4cd1c041a4a081f05f8801a">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="layoutspartialscustom-headerhtml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('788b8baae4cd1c041a4a081f05f8801a','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"><</span><span class="nt">style</span><span class="p">></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-subheading</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"></</span><span class="nt">style</span><span class="p">></span></span></span></code></pre></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div></li>
|
||
</ol>
|
||
<h3 id="partials">Partials</h3>
|
||
<p>The above example uses <code>layouts/mydesign/views/article.html</code> but you have some others</p>
|
||
<ul>
|
||
<li><code>layouts/mydesign/baseof.html</code>: Completely redefine the whole HTML structure, none of the other listed partials will be used</li>
|
||
<li><code>layouts/mydesign/views/menu.html</code>: Defines the sidebar menu layout</li>
|
||
<li><code>layouts/mydesign/views/body.html</code>: Determines what to contain in the content area (for example a single page, a list of pages, a tree of sub pages)</li>
|
||
<li><code>layouts/mydesign/views/article.html</code>: Controls how one page’s content and title are displayed</li>
|
||
</ul>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/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 addition to the <a href="/hugo-theme-relearn/configuration/sitemanagement/outputformats/index.html">output formats coming with the theme</a>, you can create your own <a href="https://gohugo.io/templates/output-formats/" rel="external" target="_self">output formats</a>.</p>
|
||
<h2 id="starting-from-scratch">Starting from Scratch</h2>
|
||
<p>If you want to add a new output format called <code>myformat</code> that outputs HTML and you want to build everything yourself without using the theme’s components:</p>
|
||
<ol>
|
||
<li>Create a file <code>layouts/_default/baseof.myformat.html</code></li>
|
||
<li>Implement all the necessary code in this file</li>
|
||
</ol>
|
||
<h2 id="using-the-themes-structure">Using the Theme’s Structure</h2>
|
||
<p>If you want to keep the general framework and only change specific parts, you can override these files:</p>
|
||
<ul>
|
||
<li><code>layouts/_default/views/article.html</code>: Controls how a page’s content and title are displayed</li>
|
||
<li><code>layouts/_default/views/body.html</code>: Determines the page body structure</li>
|
||
<li><code>layouts/_default/views/menu.html</code>: Defines the sidebar menu layout</li>
|
||
<li><code>layouts/_default/views/storeOutputFormat.html</code>: Stores the output format name for use in the framework</li>
|
||
</ul>
|
||
<p>For a real-world example, check out the <code>print</code> output format implementations</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="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/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="Tags" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
|
||
<ul>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/tags/taxonomy/index.html">Taxonomy</a></li>
|
||
</ul>
|
||
</div>
|
||
</header>
|
||
|
||
<h1 id="taxonomies">Taxonomies</h1>
|
||
|
||
<p>This page explains how to show custom taxonomies on your pages.</p>
|
||
<p>For more details, check the official docs on <a href="https://gohugo.io/content-management/taxonomies/#configure-taxonomies" rel="external" target="_self">setting up custom taxonomies</a> and <a href="https://gohugo.io/content-management/taxonomies/#assign-terms-to-content" rel="external" target="_self">using them in your content</a>.</p>
|
||
<h2 id="default-behavior">Default Behavior</h2>
|
||
<p>The Relearn theme automatically shows Hugo’s <a href="https://gohugo.io/content-management/taxonomies/#default-taxonomies" rel="external" target="_self">default taxonomies</a> <em>tags</em> and <em>categories</em> out of the box.</p>
|
||
<ul>
|
||
<li>Tags appear at the top of the page in alphabetical order in form of baggage tags.</li>
|
||
<li>Categories appear at the bottom of the page in alphabetical order as a list prefixed with an icon.</li>
|
||
</ul>
|
||
<p>Each item links to a page showing all articles with that term.</p>
|
||
<h2 id="setting-up-custom-taxonomies">Setting Up Custom Taxonomies</h2>
|
||
<p>To add custom taxonomies, update your <code>hugo.toml</code> file. You also have to add the default taxonomies if you want to 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">'categories'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">mycustomtag</span> <span class="p">=</span> <span class="s1">'mycustomtags'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">tag</span> <span class="p">=</span> <span class="s1">'tags'</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">"taxonomies"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"category"</span><span class="p">:</span> <span class="s2">"categories"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"mycustomtag"</span><span class="p">:</span> <span class="s2">"mycustomtags"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"tag"</span><span class="p">:</span> <span class="s2">"tags"</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">Showing Custom Taxonomies</h2>
|
||
<p>To display your custom taxonomy terms, add this to your page (usually in <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">"term-list.html"</span> <span class="p">(</span><span class="nx">dict</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s">"page"</span> <span class="p">.</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s">"taxonomy"</span> <span class="s">"mycustomtags"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s">"icon"</span> <span class="s">"layer-group"</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>page</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Mandatory reference to the page.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>taxonomy</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">The plural name of the taxonomy to display as used in your front matter.</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>class</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">Additional CSS classes set on the outermost generated HTML element.<br><br>If set to <code>tags</code> you will get the visuals for displaying the <em>tags</em> taxonomy, otherwise it will be a simple list of links as for the <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">The style scheme used if <strong>class</strong> is <code>tags</code>.<br><br>- by severity: <code>caution</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">The <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color_value" rel="external" target="_self">CSS color value</a> to be used if <strong>class</strong> is <code>tags</code>. If not set, the chosen color depends on the <strong>style</strong>. Any given value will overwrite the default.<br><br>- for severity styles: a nice matching color for the severity<br>- for all other styles: the corresponding color</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="text-align: left"><strong>icon</strong></td>
|
||
<td style="text-align: left"><em><empty></em></td>
|
||
<td style="text-align: left">An optional <a href="/hugo-theme-relearn/shortcodes/icon/index.html#finding-an-icon">Font Awesome icon name</a> set to the left of the list.</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/explanation/index.html">Explanation</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/categories/howto/index.html">Howto</a></li>
|
||
<li><a class="term-link" href="/hugo-theme-relearn/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 page explains how to configure the Relearn theme in your <code>hugo.toml</code> file.</p>
|
||
<p>In addition to <a href="https://gohugo.io/getting-started/configuration/#all-configuration-settings" rel="external" target="_self">Hugo’s standard options</a>, the Relearn theme offers extra settings listed here.</p>
|
||
<p>Throughout the documentation, theme-specific options are marked with 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">Option</span></span> badge.</p>
|
||
<p>Add theme options to the <code>params</code> section of your <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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"math"</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/options/additionalcontentlanguage/index.html">AdditionalContentLanguage</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/alwaysopen/index.html">Alwaysopen</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/author.email/index.html">Author.email</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/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/options/boxstyle/index.html">BoxStyle</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/breadcrumbseparator/index.html">BreadcrumbSeparator</a> (1)</li>
|
||
</ul>
|
||
<h3 id="c">C</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/collapsiblemenu/index.html">CollapsibleMenu</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/custommathjaxurl/index.html">CustomMathJaxURL</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/custommermaidurl/index.html">CustomMermaidURL</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/customopenapiurl/index.html">CustomOpenapiURL</a> (1)</li>
|
||
</ul>
|
||
<h3 id="d">D</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/disableanchorcopy/index.html">DisableAnchorCopy</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disableanchorscrolling/index.html">DisableAnchorScrolling</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disableassetsbusting/index.html">DisableAssetsBusting</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablebreadcrumb/index.html">DisableBreadcrumb</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disabledefaultrelref/index.html">DisableDefaultRelref</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disableexplicitindexurls/index.html">DisableExplicitIndexURLs</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablegeneratorversion/index.html">DisableGeneratorVersion</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablehoverblockcopytoclipboard/index.html">DisableHoverBlockCopyToClipBoard</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disableinlinecopytoclipboard/index.html">DisableInlineCopyToClipBoard</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablelandingpagebutton/index.html">DisableLandingPageButton</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablelanguageswitchingbutton/index.html">DisableLanguageSwitchingButton</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablenextprev/index.html">DisableNextPrev</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablerandomids/index.html">DisableRandomIds</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablerootbreadcrumb/index.html">DisableRootBreadcrumb</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablesearch/index.html">DisableSearch</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablesearchhiddenpages/index.html">DisableSearchHiddenPages</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablesearchindex/index.html">DisableSearchIndex</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disablesearchpage/index.html">DisableSearchPage</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disableseohiddenpages/index.html">DisableSeoHiddenPages</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disableshortcutstitle/index.html">DisableShortcutsTitle</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disabletaghiddenpages/index.html">DisableTagHiddenPages</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disabletermbreadcrumbs/index.html">DisableTermBreadcrumbs</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/disabletoc/index.html">DisableToc</a> (1)</li>
|
||
</ul>
|
||
<h3 id="e">E</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/editurl/index.html">EditURL</a> (2)</li>
|
||
<li><a href="/hugo-theme-relearn/options/externallinktarget/index.html">ExternalLinkTarget</a> (1)</li>
|
||
</ul>
|
||
<h3 id="h">H</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/highlightwrap/index.html">HighlightWrap</a> (1)</li>
|
||
</ul>
|
||
<h3 id="i">I</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/image.errorlevel/index.html">Image.errorlevel</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/imageeffects/index.html">ImageEffects</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/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/options/landingpagename/index.html">LandingPageName</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/link.errorlevel/index.html">Link.errorlevel</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/linktitle/index.html">LinkTitle</a> (1)</li>
|
||
</ul>
|
||
<h3 id="m">M</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/math/index.html">Math</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/math.force/index.html">Math.force</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/mathjaxinitialize/index.html">MathJaxInitialize</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/mermaid.force/index.html">Mermaid.force</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/mermaidinitialize/index.html">MermaidInitialize</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/mermaidzoom/index.html">MermaidZoom</a> (1)</li>
|
||
</ul>
|
||
<h3 id="o">O</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/openapi.errorlevel/index.html">Openapi.errorlevel</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/openapi.force/index.html">Openapi.force</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/ordersectionsby/index.html">Ordersectionsby</a> (2)</li>
|
||
</ul>
|
||
<h3 id="r">R</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/relearn.dependencies/index.html">Relearn.dependencies</a> (1)</li>
|
||
</ul>
|
||
<h3 id="s">S</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/searchindexurl/index.html">SearchIndexURL</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/searchpageurl/index.html">SearchPageURL</a> (1)</li>
|
||
<li><a href="/hugo-theme-relearn/options/showvisitedlinks/index.html">ShowVisitedLinks</a> (1)</li>
|
||
</ul>
|
||
<h3 id="t">T</h3>
|
||
<ul class="columnize">
|
||
<li><a href="/hugo-theme-relearn/options/themevariant/index.html">ThemeVariant</a> (2)</li>
|
||
<li><a href="/hugo-theme-relearn/options/titleseparator/index.html">TitleSeparator</a> (1)</li>
|
||
</ul>
|
||
<h2 id="all-configuration-options">All Configuration Options</h2>
|
||
<p>Here’s a list of all available options with example values. Default values are described in the <a href="/hugo-theme-relearn/configuration/reference/index.html#annotated-configuration-options">annotated example</a> below in each option’s documentation.</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">'en'</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">''</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">breadcrumbSeparator</span> <span class="p">=</span> <span class="s1">'>'</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">''</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">customMermaidURL</span> <span class="p">=</span> <span class="s1">''</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">customOpenapiURL</span> <span class="p">=</span> <span class="s1">''</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">disableAnchorScrolling</span> <span class="p">=</span> <span class="kc">false</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">disableAssetsBusting</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">'https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">externalLinkTarget</span> <span class="p">=</span> <span class="s1">'_self'</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">'images/hero.png'</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">'Relearn'</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">'{}'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">mermaidInitialize</span> <span class="p">=</span> <span class="s1">'{ "securityLevel": "loose" }'</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">'weight'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">searchIndexURL</span> <span class="p">=</span> <span class="s1">'searchindex.js'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">searchPageURL</span> <span class="p">=</span> <span class="s1">'search'</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">'::'</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">'Sören Weber'</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">'gold'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">i18n</span> <span class="p">=</span> <span class="s1">''</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">icon</span> <span class="p">=</span> <span class="s1">'rainbow'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">identifier</span> <span class="p">=</span> <span class="s1">'magic'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">title</span> <span class="p">=</span> <span class="s1">'Magic'</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">'error'</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">'error'</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">'error'</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">'error'</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">''</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">twitter</span> <span class="p">=</span> <span class="s1">''</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">'relearn-auto'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Relearn Light/Dark'</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">'relearn-light'</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">'relearn-dark'</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">'relearn-bright'</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">'zen-light'</span><span class="p">,</span> <span class="s1">'zen-dark'</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">'zen-auto'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Zen Light/Dark'</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">'zen-light'</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">'zen-dark'</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">'learn'</span><span class="p">,</span> <span class="s1">'neon'</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">'retro-auto'</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Retro Learn/Neon'</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">'neon'</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">'learn'</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">'blue'</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">'green'</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">'red'</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">""</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">""</span><span class="w">
|
||
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">icon</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">'>'</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">""</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">""</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">""</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">disableAnchorScrolling</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">disableAssetsBusting</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">Relearn</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">'{}'</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">'{ "securityLevel": "loose" }'</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">""</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">""</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">Relearn 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">'::'</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">"params"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"additionalContentLanguage"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"en"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"alwaysopen"</span><span class="p">:</span> <span class="s2">""</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"author"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"Sören Weber"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"boxStyle"</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">"color"</span><span class="p">:</span> <span class="s2">"gold"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"i18n"</span><span class="p">:</span> <span class="s2">""</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"icon"</span><span class="p">:</span> <span class="s2">"rainbow"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"identifier"</span><span class="p">:</span> <span class="s2">"magic"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"title"</span><span class="p">:</span> <span class="s2">"Magic"</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">"breadcrumbSeparator"</span><span class="p">:</span> <span class="s2">"\u003e"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"collapsibleMenu"</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">"customMathJaxURL"</span><span class="p">:</span> <span class="s2">""</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"customMermaidURL"</span><span class="p">:</span> <span class="s2">""</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"customOpenapiURL"</span><span class="p">:</span> <span class="s2">""</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"disableAnchorCopy"</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">"disableAnchorScrolling"</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">"disableAssetsBusting"</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">"disableBreadcrumb"</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">"disableDefaultRelref"</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">"disableExplicitIndexURLs"</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">"disableGeneratorVersion"</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">"disableHoverBlockCopyToClipBoard"</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">"disableInlineCopyToClipBoard"</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">"disableLandingPageButton"</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">"disableLanguageSwitchingButton"</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">"disableNextPrev"</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">"disableRandomIds"</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">"disableRootBreadcrumb"</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">"disableSearch"</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">"disableSearchHiddenPages"</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">"disableSearchIndex"</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">"disableSearchPage"</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">"disableSeoHiddenPages"</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">"disableShortcutsTitle"</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">"disableTagHiddenPages"</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">"disableTermBreadcrumbs"</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">"disableToc"</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">"editURL"</span><span class="p">:</span> <span class="s2">"https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"externalLinkTarget"</span><span class="p">:</span> <span class="s2">"_self"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"highlightWrap"</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">"image"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"errorlevel"</span><span class="p">:</span> <span class="s2">"error"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"imageEffects"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"border"</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">"lazy"</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">"lightbox"</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">"shadow"</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">"images"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"images/hero.png"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"include"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"errorlevel"</span><span class="p">:</span> <span class="s2">"error"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"link"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"errorlevel"</span><span class="p">:</span> <span class="s2">"error"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"linkTitle"</span><span class="p">:</span> <span class="s2">"Relearn"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"math"</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">"mathJaxInitialize"</span><span class="p">:</span> <span class="s2">"{}"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"mermaid"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"force"</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">"mermaidInitialize"</span><span class="p">:</span> <span class="s2">"{ \"securityLevel\": \"loose\" }"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"mermaidZoom"</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">"openapi"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"errorlevel"</span><span class="p">:</span> <span class="s2">"error"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"oppenapi"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"force"</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">"ordersectionsby"</span><span class="p">:</span> <span class="s2">"weight"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"searchIndexURL"</span><span class="p">:</span> <span class="s2">"searchindex.js"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"searchPageURL"</span><span class="p">:</span> <span class="s2">"search"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"showVisitedLinks"</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">"social"</span><span class="p">:</span> <span class="p">{</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"facebook_admin"</span><span class="p">:</span> <span class="s2">""</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"twitter"</span><span class="p">:</span> <span class="s2">""</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"themeVariant"</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">"auto"</span><span class="p">:</span> <span class="p">[],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-auto"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"Relearn Light/Dark"</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">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-light"</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">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-dark"</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">"identifier"</span><span class="p">:</span> <span class="s2">"relearn-bright"</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">"auto"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"zen-light"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"zen-dark"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"identifier"</span><span class="p">:</span> <span class="s2">"zen-auto"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"Zen Light/Dark"</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">"identifier"</span><span class="p">:</span> <span class="s2">"zen-light"</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">"identifier"</span><span class="p">:</span> <span class="s2">"zen-dark"</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">"auto"</span><span class="p">:</span> <span class="p">[</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"learn"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="s2">"neon"</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"identifier"</span><span class="p">:</span> <span class="s2">"retro-auto"</span><span class="p">,</span>
|
||
</span></span><span class="line"><span class="cl"> <span class="nt">"name"</span><span class="p">:</span> <span class="s2">"Retro Learn/Neon"</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">"identifier"</span><span class="p">:</span> <span class="s2">"neon"</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">"identifier"</span><span class="p">:</span> <span class="s2">"learn"</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">"identifier"</span><span class="p">:</span> <span class="s2">"blue"</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">"identifier"</span><span class="p">:</span> <span class="s2">"green"</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">"identifier"</span><span class="p">:</span> <span class="s2">"red"</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">"titleSeparator"</span><span class="p">:</span> <span class="s2">"::"</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 Configuration Options</h2>
|
||
<div class="tab-panel" data-tab-group="2ca3ebb0c1f41e478dce935cdb489918">
|
||
<div class="tab-nav">
|
||
<div class="tab-nav-title">​</div>
|
||
<button
|
||
data-tab-item="hugotoml"
|
||
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
|
||
onclick="switchTab('2ca3ebb0c1f41e478dce935cdb489918','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 option value is said to be not set, you can achieve the same behavior</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># by giving it an empty string 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"># Hugo</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># These options usually apply to other themes as well.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The title to be used for links to the main page</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 for the link to the main page in the upper section</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># of the menu. If not set, `title` from the Hugo settings will be used.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">linkTitle</span> <span class="p">=</span> <span class="s1">'Relearn'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The author of your site.</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 in HTML meta tags, the opengraph protocol and 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"># You can also set `author.email` if you want to publish this information.</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">'Sören Weber'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The social media image of your site.</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 is used for generating social media meta information for the opengraph</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># protocol and twitter cards.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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">'images/hero.png'</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 options for 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"># Configuration for the Open Graph protocol and Twitter Cards adhere to Hugo's</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># implementation. See the Hugo docs for possible 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">''</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">''</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"># Relearn Theme</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># These options are specific to the Relearn 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"># Branding</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># These options set your 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: 'auto'</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This sets one or more color variants, available to your readers to choose</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># from. You can</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># - set a single value eg. 'zen-light'</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># - an array like [ 'neon', 'learn' ]</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># - an array with options like [ { identifier = 'neon' },{ identifier = 'learn' } ]</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The last form allows to set further options for each variant.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The `identifier` is mandatory. You can also set `name` which overrides the</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># value displayed in the variant selector.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># If the array has more than one entry, a variant selector</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># is shown in the lower part of the menu. The first entry in the array is the</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># default variant, used for first time visitors.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The theme ships with the following variants: 'relearn-bright',</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># 'relearn-light', 'relearn-dark', 'zen-light', 'zen-dark', 'neon', 'learn',</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># 'blue', 'green', 'red'. In addition you can use auto mode variants. See the</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># docs for a detailed explanation.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># You can also define your own variants. See the docs how this works. Also,</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># the docs provide an interactive theme generator to help you with 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">'relearn-auto'</span><span class="p">,</span> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Relearn Light/Dark'</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">'relearn-light'</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">'relearn-dark'</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">'relearn-bright'</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">'zen-auto'</span><span class="p">,</span> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Zen Light/Dark'</span><span class="p">,</span> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[</span> <span class="s1">'zen-light'</span><span class="p">,</span> <span class="s1">'zen-dark'</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">'zen-light'</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">'zen-dark'</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">'retro-auto'</span><span class="p">,</span> <span class="nx">name</span> <span class="p">=</span> <span class="s1">'Retro Learn/Neon'</span><span class="p">,</span> <span class="nx">auto</span> <span class="p">=</span> <span class="p">[</span> <span class="s1">'learn'</span><span class="p">,</span> <span class="s1">'neon'</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">'neon'</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">'learn'</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">'blue'</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">'green'</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">'red'</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 options are defining 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 and CSS-files get a unique ID on each rebuild.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This makes sure, the user always has the latest version and not some stale</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># copy of his browser cache. Anyways, it can be desireable to turn this</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># off in certain circumstances. For example if you have Hugo's dev server</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># running. Also some proxies dislike this optimization.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">disableAssetsBusting</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 to true if you want to disable generation for generator meta tags</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># of Hugo and the theme in your HTML head. In this case also don't forget to</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># set Hugo's disableHugoGeneratorInject=true. Otherwise Hugo will generate a</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># meta tag into your home page 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 situations the theme generates non stable unique ids to be used</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># in HTML fragment links. This can be undesirable for example when testing</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># the output for changes. If you disable the random id generation, the theme</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># may not function 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 of the theme</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The theme provides a mechanism to load further JavaScript and CSS</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># dependencies on demand only if they are needed. This comes in handy if you</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># want to add own shortcodes that depend on additional code to be loaded.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># See the 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 options modify the topbar appearance.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Hide the table of 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 the TOC button is hidden, also the keyboard shortcut is disabled.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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 the 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 the breadcrumbs are hidden, the title of the displayed page will still be</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># shown in the 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 and Previous navigation 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 the navigation buttons are hidden, also the keyboard shortcuts are</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"># The URL prefix to edit a page.</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 in the topbar. If the button is hidden,</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># also the keyboard shortcuts are disabled. The value can contain the macro</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># `${FilePath}` which will be replaced by the file path of your displayed page.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># If no `${FilePath}` is given in the value, the value is treated as if the</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># `${FilePath}` was appended at the end of the value. This can be overridden</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># in the pages frontmatter. This is useful if you want to give the opportunity</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># for people to create merge request for your content.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">editURL</span> <span class="p">=</span> <span class="s1">'https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}'</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 options modify various aspects of the search functionality.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Disable the 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 the search is disabled, no search box will be displayed in the menu,</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># nor in-page search, search popup or dedicated search page will be available.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This will also cause the keyboard shortcut to 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"># Disable the search index generation.</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 to let the generation of the search index</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># file to be affected by this option. If the search index is disabled, no</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># search popup or dedicated search page will be available.</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 of the search index file relative to the language home.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Default: 'searchindex.js'</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># You have to set this option if your page already has a content file named</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># `searchindex.js` in the language home.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">searchIndexURL</span> <span class="p">=</span> <span class="s1">'searchindex.js'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Disable the dedicated search page.</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` and `disableSearchIndex=false` must be set to let the</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># generation of the dedicated search page to be affected by this option.</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 of the dedicated search page relative to the language home.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Default: 'search'</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># In its basic form the search page URL is named the same for all languages</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># but you are free to override it in each language options to localised the</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># URL. You also need to set this option if your page already has a content</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># page named `search`.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">searchPageURL</span> <span class="p">=</span> <span class="s1">'search'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Multilanguage content.</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 the search index is enabled and your pages contain further languages</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># besides the 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 with support for all used languages of your site.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This is handy for example if you are writing in Spanish but have lots of</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># source code on your page 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">'en'</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 options modify the menu appearance.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Hide the 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 the search bar and the main menu.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># It links to your the home page of the 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"># The order of main menu submenus.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Default: 'weight'</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Submenus can be ordered by 'weight', 'title', 'linktitle', 'modifieddate',</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># 'expirydate', 'publishdate', 'date', 'length' or 'default' (adhering to</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Hugo's default sort order). This can be overridden in the pages frontmatter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">ordersectionsby</span> <span class="p">=</span> <span class="s1">'weight'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The initial expand state of 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"># in the menu. If not set, the first menu level is set to false, all others</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># levels are set to true. This can be overridden in the page's frontmatter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># If the displayed page has submenus, they will always been displayed expanded</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># regardless of this option.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">alwaysopen</span> <span class="p">=</span> <span class="s1">''</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Shows expander for 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 to true, a submenu in the sidebar will be displayed in a collapsible</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># tree view and a clickable expander is set in front of the entry.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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 for visited pages of the 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 the display of the `Clear History` entry in the lower part</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># of the menu to remove all checkmarks. The checkmarks will also been removed</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># if you regenerate your site as the ids are not stable.</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 heading above the 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"># The title for the heading can be overwritten in your i18n files. See Hugo's</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># documentation how to 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 the 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 you have more than one language configured, a language switcher is</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># displayed in the lower part of the menu. This option lets you 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 pages</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># These options configure how hidden pages are treated.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># A page flagged as hidden, is only removed from the main menu if you are</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># currently not on this page or the hidden page is not part of current page's</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># ancestors. For all other functionality in Hugo a hidden page behaves like any</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># other page 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 pages 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 pages from the suggestions of the search box and the dedicated</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># search page.</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 pages for 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 pages from showing up in the sitemap and 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 pages for 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 pages from showing up on the taxonomy and terms pages. If this</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># reduces term counters to zero, an empty but not linked term page 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"># Content</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># These options modify how your content is 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: '::'</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Changes the title separator used when concatenating the page title with the</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># site title. This is consistently used throughout the theme.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">titleSeparator</span> <span class="p">=</span> <span class="s1">'::'</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: '>'</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Changes the breadcrumb separator used in the topbars breadcrumb area and for</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># search results and term pages.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">breadcrumbSeparator</span> <span class="p">=</span> <span class="s1">'>'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Hide the 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"># The root breadcrumb is usually the home page of your site. Because this is</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># always accessible by clicking on the logo, you may want to reduce clutter</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># by removing this from your 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 pages.</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 you have lots of taxonomy terms, the term pages may seem cluttered with</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># breadcrumbs to you, so this is the option to turn off breadcrumbs on term</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># pages. Only the page title will then be shown on the term pages.</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"># Disable copying heading links to 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 to true, this disables the copying of anchor links to the clipboard;</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># if also `disableAnchorScrolling=true` then no anchor link will be visible</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># when hovering a heading.</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"># Disable scrolling to heading 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 to true, this disables the scrolling to the beginning of the heading</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 visible when hovering a heading.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">disableAnchorScrolling</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 for shortcodes</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 the predefined `style` values, you are able to define your own. The</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># `style` parameter of the shortcode must match the `identifier` defined here.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The title for the style will be determined from the `title`. If no `title`</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># but a `i18n` is set, the title will be taken from the translation files by</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># that key. The `title` may be empty in which case, the box does not contain a</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># default title. `icon` and `color` are working 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">'magic'</span><span class="p">,</span> <span class="nx">i18n</span> <span class="p">=</span> <span class="s1">''</span><span class="p">,</span> <span class="nx">title</span> <span class="p">=</span> <span class="s1">'Magic'</span><span class="p">,</span> <span class="nx">icon</span> <span class="p">=</span> <span class="s1">'rainbow'</span><span class="p">,</span> <span class="nx">color</span> <span class="p">=</span> <span class="s1">'gold'</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 options configure how code is 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 for 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 the copy-to-clipboard button from your 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 for 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"># The theme only shows the copy-to-clipboard button if you hover over the code</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># block. Set this to true to disable the hover effect and always show the</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 for 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 of code blocks wrap around if the line is too long to be</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># displayed on screen. If you dislike this behavior, you 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"># Note that lines always wrap in print mode regardless of this option.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page's frontmatter or given as a parameter to</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 options configure how the include shortcode works.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># What to do when path is not resolved.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Default: ''</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># You can control what should happen if a path can not be resolved to as</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># a resource or via the file system. If not set, no output will be written</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># for the unresolved path. If set to `warning` the same happens and an additional</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># warning is printed. If set to `error` an error message is printed and the build</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># is aborted.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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">'error'</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 options configure how images are displayed.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># What to do when local image link is not resolved.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Default: ''</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># You can control what should happen if a local image can not be resolved to as</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># a resource. If not set, the unresolved link is written as given into the resulting</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># output. If set to `warning` the same happens and an additional warning is</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># printed. If set to `error` an error message is printed and the build is</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 of your `static` directory.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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">'error'</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 the documentation for how you can even add your own arbitrary effects to</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># the list.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># All effects can be overridden in the page's frontmatter or through URL parameter</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># given to the image. See the documentation for 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 options configure how links are displayed.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Wether to use Hugo's default relref shortcode implementation</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 the theme provides a link render hook, the usage of the relref shortcode</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># is obsolete. If a site still uses that shortcode, it fails to generate a</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># correct links if the baseURL is configured with a subdirectory and relativeURLs=false.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># The theme provides an overriden relref shortcode that also works in the</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># above setup but must manually be activated by setting this option to true.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># See discussion in 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 the 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 to true, the theme behaves like a standard Hugo installation and</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># appends no index.html to prettyURLs. As a trade off, your build project will</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># not be servable from the 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 to do when local page link is not resolved.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Default: ''</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># You can control what should happen if a local link can not be resolved to a</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># page. If not set, the unresolved link is written as given into the resulting</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># output. If set to `warning` the same happens and an additional warning is</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># printed. If set to `error` an error message is printed and the build is</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 with Hugo < 0.123.0 + `uglyURLs=true` this can lead to 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 in the page'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">'error'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># How to open external links.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Default: '_blank'</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># For external links you can define how they are opened in your browser. All</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># values for the HTML `target` attribute of the `a` element are allowed. The</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># default value opens external links in a separate browser tab. If you want</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># to open those links in the same tab, use '_self'.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page's frontmatter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">externalLinkTarget</span> <span class="p">=</span> <span class="s1">'_self'</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 options configure how math formulae are displayed.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Initialization options for 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 the MathJaxdocumentation for possible parameter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page's frontmatter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">mathJaxInitialize</span> <span class="p">=</span> <span class="s1">'{}'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Force load Math on every page.</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 is found, the option will be ignored and</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Math will be loaded regardlessly. This option is useful in case you</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># are using passthrough configuration to render your math. In this case no shortcode or</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># codefence is involved and the library is not loaded by default so you can</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># force loading it by setting `math=true`.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This option has an alias `math.force`.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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 for 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 the remote location of the MathJax library. By default the 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 in the page's frontmatter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">customMathJaxURL</span> <span class="p">=</span> <span class="s1">''</span> <span class="c"># 'https://unpkg.com/mathjax/es5/tex-mml-chtml.js'</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"># Mermaid</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># These options configure how Mermaid graphs are displayed.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Make graphs panable and zoomable</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 to make them zoomable. Zoomable graphs come</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># with a reset button for the zoom.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page's frontmatter or given as a parameter to</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"># Initialization options for Mermaid.</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 the Mermaid documentation for possible parameter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page's frontmatter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">mermaidInitialize</span> <span class="p">=</span> <span class="s1">'{ "securityLevel": "loose" }'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Force load Mermaid on every page.</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 Mermaid shortcode or codefence is found, the option will be ignored and</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Mermaid will be loaded regardlessly. This option is useful in case you</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># are using scripting to render your graph. In this case no shortcode or</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># codefence is involved and the library is not loaded by default so you can</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># force loading it by setting `mermaid.force=true`.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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 for external Mermaid 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 the remote location of the Mermaid library. By default the 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 in the page's frontmatter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">customMermaidURL</span> <span class="p">=</span> <span class="s1">''</span> <span class="c"># 'https://unpkg.com/mermaid/dist/mermaid.min.js'</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 options configure how OpenAPI specifications are displayed.</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Force load OpenAPI on every page.</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 is found, the option will be ignored and</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># OpenAPI will be loaded regardlessly. This option is useful in case you</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># are using scripting to render your spec. In this case no shortcode or</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># codefence is involved and the library is not loaded by default so you can</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># force loading it by setting `openapi.force=true`.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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 for 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 the remote location of the OpenAPI library. By default the 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 in the page's frontmatter.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="nx">customOpenapiURL</span> <span class="p">=</span> <span class="s1">''</span> <span class="c"># 'https://unpkg.com/swagger-ui-dist/swagger-ui-bundle.js'</span>
|
||
</span></span><span class="line"><span class="cl">
|
||
</span></span><span class="line"><span class="cl"><span class="c"># What to do when a local OpenAPI spec link is not resolved.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># Default: ''</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># You 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"># to a resource. If not set, the unresolved link is written as given into the resulting</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># output. If set to `warning` the same happens and an additional warning is</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># printed. If set to `error` an error message is printed and the build is</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 of your `static` directory.</span>
|
||
</span></span><span class="line"><span class="cl"><span class="c"># This can be overridden in the page'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">'error'</span></span></span></code></pre></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<footer class="footline">
|
||
<div class="R-taxonomy taxonomy-categories cstyle" title="Categories" 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/categories/reference/index.html">Reference</a></li>
|
||
</ul>
|
||
</div>
|
||
</footer>
|
||
</article>
|
||
</section>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
<script src="/hugo-theme-relearn/js/clipboard.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-color.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-dispatch.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-drag.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-ease.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-interpolate.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-selection.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-timer.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-transition.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/d3/d3-zoom.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/js-yaml.min.js?1728838675" defer></script>
|
||
<script src="/hugo-theme-relearn/js/mermaid.min.js?1728838675" defer></script>
|
||
<script>
|
||
window.themeUseMermaid = JSON.parse("{ \"securityLevel\": \"loose\" }");
|
||
</script>
|
||
<script src="/hugo-theme-relearn/js/theme.js?1728838675" defer></script>
|
||
</body>
|
||
</html>
|