hugo-theme-relearn/pir/configuration/customization/outputformats/index.html
2025-01-02 21:41:58 +00:00

881 lines
99 KiB
HTML

<!DOCTYPE html>
<html lang="art-x-pir" dir="rtl" itemscope itemtype="http://schema.org/Article" data-r-output-format="html">
<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.140.2">
<meta name="generator" content="Relearn 7.3.0+4f9b02f2e43556319e73b38edde19e1d262757c1">
<meta name="description" content="Adding Custom Output Formats">
<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="Output Formats :: Cap&#39;n Hugo Relearrrn Theme">
<meta name="twitter:description" content="Adding Custom Output Formats">
<meta property="og:url" content="https://mcshelby.github.io/hugo-theme-relearn/pir/configuration/customization/outputformats/index.html">
<meta property="og:site_name" content="Cap&#39;n Hugo Relearrrn Theme">
<meta property="og:title" content="Output Formats :: Cap&#39;n Hugo Relearrrn Theme">
<meta property="og:description" content="Adding Custom Output Formats">
<meta property="og:locale" content="art_x_pir">
<meta property="og:type" content="website">
<meta property="og:image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
<meta itemprop="name" content="Output Formats :: Cap&#39;n Hugo Relearrrn Theme">
<meta itemprop="description" content="Adding Custom Output Formats">
<meta itemprop="wordCount" content="991">
<meta itemprop="image" content="https://mcshelby.github.io/hugo-theme-relearn/images/hero.png">
<meta itemprop="keywords" content="Explanation,Howto">
<title>Output Formats :: Cap&#39;n Hugo Relearrrn Theme</title>
<link href="https://mcshelby.github.io/hugo-theme-relearn/configuration/customization/outputformats/index.html" rel="alternate" hreflang="x-default">
<link href="https://mcshelby.github.io/hugo-theme-relearn/configuration/customization/outputformats/index.html" rel="alternate" hreflang="en">
<link href="https://mcshelby.github.io/hugo-theme-relearn/pir/configuration/customization/outputformats/index.html" rel="alternate" hreflang="art-x-pir">
<link href="/hugo-theme-relearn/pir/configuration/customization/outputformats/index.xml" rel="alternate" type="application/rss+xml" title="Output Formats :: Cap&#39;n Hugo Relearrrn Theme">
<link href="/hugo-theme-relearn/pir/configuration/customization/outputformats/index.print.html" rel="alternate" type="text/html" title="Output Formats :: Cap&#39;n Hugo Relearrrn Theme">
<link href="/hugo-theme-relearn/images/logo.svg?1735854108" rel="icon" type="image/svg+xml">
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1735854108" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1735854108" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/auto-complete.css?1735854108" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1735854108" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1735854108" rel="stylesheet">
<link href="/hugo-theme-relearn/css/theme.min.css?1735854108" rel="stylesheet">
<link href="/hugo-theme-relearn/css/format-html.min.css?1735854108" rel="stylesheet" id="R-format-style">
<script>
window.relearn = window.relearn || {};
window.relearn.relBasePath='..\/..\/..\/..';
window.relearn.relBaseUri='..\/..\/..\/..\/..';
window.relearn.absBaseUri='https:\/\/mcshelby.github.io\/hugo-theme-relearn';
window.relearn.min = `.min`;
window.relearn.disableAnchorCopy=false;
window.relearn.disableAnchorScrolling=false;
// variant stuff
window.relearn.themevariants = [ 'relearn-auto', 'relearn-light', 'relearn-dark', 'relearn-bright', 'zen-auto', 'zen-light', 'zen-dark', 'retro-auto', 'neon', 'learn', 'blue', 'green', 'red' ];
window.relearn.customvariantname = "my-custom-variant";
window.relearn.changeVariant = function(variant) {
var oldVariant = document.documentElement.dataset.rThemeVariant;
window.localStorage.setItem(window.relearn.absBaseUri + "/variant", variant);
document.documentElement.dataset.rThemeVariant = variant;
if (oldVariant != variant) {
document.dispatchEvent( new CustomEvent('themeVariantLoaded', { detail: { variant, oldVariant } }) );
}
}
window.relearn.markVariant = function() {
var variant = window.localStorage.getItem(window.relearn.absBaseUri + "/variant");
var select = document.querySelector("#R-select-variant");
if (select) {
select.value = variant;
}
}
window.relearn.initVariant = function() {
var variant = window.localStorage.getItem(window.relearn.absBaseUri + "/variant") ?? "";
if( variant == window.relearn.customvariantname ){
}else if( !variant || !window.relearn.themevariants.includes(variant) ){
variant = window.relearn.themevariants[0];
window.localStorage.setItem(window.relearn.absBaseUri + "/variant", variant);
}
document.documentElement.dataset.rThemeVariant = variant;
}
window.relearn.initVariant();
window.relearn.markVariant();
// translations
window.T_Copy_to_clipboard = `Copy t' clipboard`;
window.T_Copied_to_clipboard = `Copied t' clipboard!`;
window.T_Copy_link_to_clipboard = `Copy link t' clipboard`;
window.T_Link_copied_to_clipboard = `Copied link t' clipboard!`;
window.T_Reset_view = `Rrreset view`;
window.T_View_reset = `View rrreset!`;
window.T_No_results_found = `No rrresults found fer "{0}"`;
window.T_N_results_found = `{1} rrresults found fer "{0}"`;
</script>
<script src="/hugo-theme-relearn/js/variant.js?1735854108"></script>
<style>
#R-body img.bg-white {
background-color: white;
}
</style>
</head>
<body class="mobile-support html disableInlineCopyToClipboard" data-url="/hugo-theme-relearn/pir/configuration/customization/outputformats/index.html">
<div id="R-body" class="default-animation">
<div id="R-body-overlay"></div>
<nav id="R-topbar">
<div class="topbar-wrapper">
<div class="topbar-sidebar-divider"></div>
<div class="topbar-area topbar-area-start" data-area="start">
<div class="topbar-button topbar-button-sidebar" data-content-empty="disable" data-width-s="show" data-width-m="hide" data-width-l="hide"><button class="topbar-control" onclick="toggleNav()" type="button" title="Menu (CTRL&#43;ALT&#43;n)"><i class="fa-fw fas fa-bars"></i></button>
</div>
<div class="topbar-button topbar-button-toc" data-content-empty="hide" data-width-s="show" data-width-m="show" data-width-l="show"><button class="topbar-control" onclick="toggleTopbarFlyout(this)" type="button" title="Table o&#39; Contents (CTRL&#43;ALT&#43;t)"><i class="fa-fw fas fa-list-alt"></i></button>
<div class="topbar-content">
<div class="topbar-content-wrapper">
<nav class="TableOfContents">
<ul>
<li><a href="#creating-an-output-format">Creat'n an Output Format</a></li>
<li><a href="#partials">Partials</a>
<ul>
<li><a href="#for-html-output-formats">For HTML Output Formats</a></li>
<li><a href="#for-non-html-output-formats">For Non-HTML Output Formats</a></li>
</ul>
</li>
<li><a href="#migration-to-relearn-7-or-higher">Migrat'n t' Relearrrn 7 or higher</a>
<ul>
<li><a href="#for-html-output-formats-1">For HTML Output Formats</a></li>
<li><a href="#for-non-html-output-formats-1">For Non-HTML Output Formats</a></li>
</ul>
</li>
</ul>
</nav>
</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"><a itemprop="item" href="/hugo-theme-relearn/pir/configuration/index.html"><span itemprop="name">Configurrrat&#39;n</span></a><meta itemprop="position" content="1">&nbsp;>&nbsp;</li><li
itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement"><a itemprop="item" href="/hugo-theme-relearn/pir/configuration/customization/index.html"><span itemprop="name">Customization</span></a><meta itemprop="position" content="2">&nbsp;>&nbsp;</li><li
itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement"><span itemprop="name">Output Formats</span><meta itemprop="position" content="3"></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/customization/outputformats/_index.pir.md" target="_self" title="Edit (CTRL&#43;ALT&#43;w)"><i class="fa-fw fas fa-pen"></i></a>
</div>
<div class="topbar-button topbar-button-print" data-content-empty="disable" data-width-s="area-more" data-width-m="show" data-width-l="show"><a class="topbar-control" href="/hugo-theme-relearn/pir/configuration/customization/outputformats/index.print.html" title="Prrrint whole chapterrr (CTRL&#43;ALT&#43;p)"><i class="fa-fw fas fa-print"></i></a>
</div>
<div class="topbar-button topbar-button-prev" data-content-empty="disable" data-width-s="show" data-width-m="show" data-width-l="show"><a class="topbar-control" href="/hugo-theme-relearn/pir/configuration/customization/designs/index.html" title="Page Designs (🡒)"><i class="fa-fw fas fa-chevron-left"></i></a>
</div>
<div class="topbar-button topbar-button-next" data-content-empty="disable" data-width-s="show" data-width-m="show" data-width-l="show"><a class="topbar-control" href="/hugo-theme-relearn/pir/configuration/customization/taxonomy/index.html" title="Taxonomies (🡐)"><i class="fa-fw fas fa-chevron-right"></i></a>
</div>
<div class="topbar-button topbar-button-more" data-content-empty="hide" data-width-s="show" data-width-m="show" data-width-l="show"><button class="topbar-control" onclick="toggleTopbarFlyout(this)" type="button" title="Morrre"><i class="fa-fw fas fa-ellipsis-v"></i></button>
<div class="topbar-content">
<div class="topbar-content-wrapper">
<div class="topbar-area topbar-area-more" data-area="more">
</div>
</div>
</div>
</div>
</div>
</div>
</nav>
<div id="R-main-overlay"></div>
<main id="R-body-inner" class="highlightable configuration" tabindex="-1">
<div class="flex-block-wrapper">
<article class="default">
<header class="headline">
</header>
<h1 id="output-formats">Output Formats</h1>
<p>Cap'n Hugo can display yer rrrambl'n 'n different <a href="https://gohugo.io/templates/output-formats/" rel="external" target="_self">formats</a> like HTML, JSON, Google AMP, etc. T' do this, templates must be provided.</p>
<p>Th' Relearrrn theme by default comes wit' templates fer <a href="/hugo-theme-relearn/pir/configuration/sitemanagement/outputformats/index.html">HTML, HTML fer print, RSS an' Marrrkdown</a>. If this be not enough, this plank describes how ye can create yer own output formats.</p>
<p>If ye instead just want t' <a href="/hugo-theme-relearn/pir/configuration/customization/designs/index.html">cust'mize th' layout o' an exist'n output format</a>, th' theme got ye covered as well.</p>
<h2 id="creating-an-output-format">Creat'n an Output Format</h2>
<p>Suppose ye want t' be able t' send yer articles as HTML formatted emails. Th' planks o' these format need t' be self contained so an email client can display th' rrrambl'n without load'n any further assets.</p>
<p>Therefore we add a new output format called <code>email</code> that outputs HTML an' assembles a completely custom HTML document structure.</p>
<ol>
<li>
<p>Add th' output format t' yer <code>hugo.toml</code></p>
<div class="tab-panel" data-tab-group="config-code">
<div class="tab-nav">
<div class="tab-nav-title">hugo.</div>
<button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
<span class="tab-nav-text">toml</span>
</button>
<button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
<span class="tab-nav-text">yaml</span>
</button>
<button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
<span class="tab-nav-text">json</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-toml" data-lang="toml"><span class="line"><span class="cl"><span class="p">[</span><span class="nx">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">email</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">baseName</span> <span class="p">=</span> <span class="s1">&#39;index.email&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">isHTML</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">mediaType</span> <span class="p">=</span> <span class="s1">&#39;text/html&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">name</span> <span class="p">=</span> <span class="s1">&#39;email&#39;</span>
</span></span><span class="line"><span class="cl"> <span class="nx">noUgly</span> <span class="p">=</span> <span class="kc">true</span>
</span></span><span class="line"><span class="cl"> <span class="nx">permalink'ble</span> <span class="p">=</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"><span class="p">[</span><span class="nx">outputs</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">home</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;html&#39;</span><span class="p">,</span> <span class="s1">&#39;rss&#39;</span><span class="p">,</span> <span class="s1">&#39;email&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">plank</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;html&#39;</span><span class="p">,</span> <span class="s1">&#39;rss&#39;</span><span class="p">,</span> <span class="s1">&#39;email&#39;</span><span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="nx">section</span> <span class="p">=</span> <span class="p">[</span><span class="s1">&#39;html&#39;</span><span class="p">,</span> <span class="s1">&#39;rss&#39;</span><span class="p">,</span> <span class="s1">&#39;email&#39;</span><span class="p">]</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-yaml" data-lang="yaml"><span class="line"><span class="cl"><span class="nt">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">email</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.email</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">email</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">noUgly</span><span class="p">:</span><span class="w"> </span><span class="kc">true</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">permalink'ble</span><span class="p">:</span><span class="w"> </span><span class="kc">false</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"></span><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">email</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span><span class="nt">plank</span><span class="p">:</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">html</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">rss</span><span class="w">
</span></span></span><span class="line"><span class="cl"><span class="w"> </span>- <span class="l">email</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">email</span></span></span></code></pre></div>
</div>
</div>
<div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-json" data-lang="json"><span class="line"><span class="cl"><span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;outputFormats&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;email&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;baseName&#34;</span><span class="p">:</span> <span class="s2">&#34;index.email&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;isHTML&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;mediaType&#34;</span><span class="p">:</span> <span class="s2">&#34;text/html&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;name&#34;</span><span class="p">:</span> <span class="s2">&#34;email&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;noUgly&#34;</span><span class="p">:</span> <span class="kc">true</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;permalinkable&#34;</span><span class="p">:</span> <span class="kc">false</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">},</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;outputs&#34;</span><span class="p">:</span> <span class="p">{</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;home&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;html&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;rss&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;email&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;page&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;html&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;rss&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;email&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">],</span>
</span></span><span class="line"><span class="cl"> <span class="nt">&#34;section&#34;</span><span class="p">:</span> <span class="p">[</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;html&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;rss&#34;</span><span class="p">,</span>
</span></span><span class="line"><span class="cl"> <span class="s2">&#34;email&#34;</span>
</span></span><span class="line"><span class="cl"> <span class="p">]</span>
</span></span><span class="line"><span class="cl"> <span class="p">}</span>
</span></span><span class="line"><span class="cl"><span class="p">}</span></span></span></code></pre></div>
</div>
</div>
</div>
</div>
</li>
<li>
<p>Create a file <code>layouts/_default/baseof.email.html</code></p>
<div class="tab-panel" data-tab-group="8cf06d3ee2931fcdb66f98762c082943">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layouts_defaultbaseofemailhtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('8cf06d3ee2931fcdb66f98762c082943','layouts_defaultbaseofemailhtml')"
>
<span class="tab-nav-text">layouts/_default/baseof.email.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layouts_defaultbaseofemailhtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code" hl_Lines="15"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="cp">&lt;!DOCTYPE html&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">html</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">head</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">title</span><span class="p">&gt;</span>{{ .Title }}<span class="p">&lt;/</span><span class="nt">title</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">style</span> <span class="na">type</span><span class="o">=</span><span class="s">&#34;text/css&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="c">/* add some styles here t' make it pretty */</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">style</span> <span class="na">type</span><span class="o">=</span><span class="s">&#34;text/css&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="c">/* add chroma style fer code highlight'n */</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span><span class="err">{-</span> <span class="err">&#34;/assets/css/chroma-relearn-light.css&#34;</span> <span class="err">|</span> <span class="err">readFile</span> <span class="err">|</span> <span class="err">safeCSS</span> <span class="p">}</span><span class="err">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">head</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">body</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">main</span><span class="p">&gt;</span>
</span></span><span class="line hl"><span class="cl"> {{- block &#34;body&#34; . }}{{ end }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">main</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">body</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">html</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><p>Th' marked <code>block</code> construct above will cause th' display o' th' article wit' a default HTML structure. In case ye want t' keep it really simple, ye could replace this line wit' just <code>{{ .Content }}</code>.</p>
</li>
<li>
<p><em>Optional</em>: create a file <code>layouts/_default/views/article.email.html</code></p>
<p>In our case, we want t' display a disclaimer 'n front o' every article. T' do this we have t' define th' output o' an article ourself an' rely on th' above <code>block</code> statement t' call our template.</p>
<div class="tab-panel" data-tab-group="6f990ed6ed330d7d86ffa4092476b481">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layouts_defaultviewsarticleemailhtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('6f990ed6ed330d7d86ffa4092476b481','layouts_defaultviewsarticleemailhtml')"
>
<span class="tab-nav-text">layouts/_default/views/article.email.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layouts_defaultviewsarticleemailhtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">article</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;email&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">blockquote</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> View this article on <span class="p">&lt;</span><span class="nt">a</span> <span class="na">href</span><span class="o">=</span><span class="s">&#34;http://example.com{{ .RelPermalink }}&#34;</span><span class="p">&gt;</span>our website<span class="p">&lt;/</span><span class="nt">a</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">blockquote</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> {{ partial &#34;article-content.html&#34; . }}
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">article</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div></li>
<li>
<p><em>Optional</em>: create a file <code>layouts/_default/_markup_/render-image.email.html</code></p>
<p>In our case, we want t' convert each image into a base 64 encoded str'n t' display it inline 'n th' email without load'n external assets.</p>
<div class="tab-panel" data-tab-group="ffcf71836ec91c46f7d884418e173939">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layouts_defaultmarkuprender-imageemailhtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('ffcf71836ec91c46f7d884418e173939','layouts_defaultmarkuprender-imageemailhtml')"
>
<span class="tab-nav-text">layouts/_default/<em>marrrkup</em>/render-image.email.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layouts_defaultmarkuprender-imageemailhtml"
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">{{- $dest_url := urls.Parse .Destinat'n }}
</span></span><span class="line"><span class="cl">{{- $dest_path := path.Clean ($dest_url.Path) }}
</span></span><span class="line"><span class="cl">{{- $img := .Page.Resources.GetMatch $dest_path }}
</span></span><span class="line"><span class="cl">{{- if an' (not $img) .Page.File }}
</span></span><span class="line"><span class="cl"> {{- $path := path.Join .Page.File.Dir $dest_path }}
</span></span><span class="line"><span class="cl"> {{- $img = resources.Get $path }}
</span></span><span class="line"><span class="cl">{{- end }}
</span></span><span class="line"><span class="cl">{{- if $img }}
</span></span><span class="line"><span class="cl"> {{- if (gt (len $img.Content) 1000000000) }}
</span></span><span class="line"><span class="cl"> {{/* currently resiz'n does not work fer animated gifs :-( */}}
</span></span><span class="line"><span class="cl"> {{- $img = $img.Resize &#34;600x webp q75&#34; }}
</span></span><span class="line"><span class="cl"> {{- end }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">img</span> <span class="na">src</span><span class="o">=</span><span class="s">&#34;data:{{ $img.MediaType }};base64,{{ $img.Content | base64Encode }}&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl">{{- end }}</span></span></code></pre></div>
</div>
</div>
</div>
</div></li>
</ol>
<h2 id="partials">Partials</h2>
<h3 id="for-html-output-formats">For HTML Output Formats</h3>
<p>If ye want t' keep th' general HTML framework an' only change specific parts, ye can provide these files fer yer output format independently o' one another:</p>
<ul>
<li><code>layouts/_default/views/article.&lt;FORMAT&gt;.html</code>: <em>Optional</em>: Controls how a page&rsquo;s rrrambl'n an' title be displayed</li>
<li><code>layouts/_default/views/body.&lt;FORMAT&gt;.html</code>: <em>Optional</em>: Determines what t' contain 'n th' rrrambl'n area (for example a single plank, a list o' planks, a tree o' sub pages)</li>
<li><code>layouts/_default/views/menu.&lt;FORMAT&gt;.html</code>: <em>Optional</em>: Defines th' sidebar menu layout</li>
<li><code>layouts/_default/views/storeOutputFormat.&lt;FORMAT&gt;.html</code>: <em>Optional</em>: Stores th' output format name fer use 'n th' framework t' let th' body element been marked wit' an output format specific class</li>
</ul>
<p>For a real-world example, check out th' <code>print</code> output format implementat'n</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>
<h3 id="for-non-html-output-formats">For Non-HTML Output Formats</h3>
<ul>
<li><code>layouts/_default/list.&lt;FORMAT&gt;</code>: <em>Mandatory</em>: Controls how sections be displayed</li>
<li><code>layouts/_default/single.&lt;FORMAT&gt;</code>: <em>Mandatory</em>: Controls how planks be displayed</li>
<li><code>layouts/_default/baseof.&lt;FORMAT&gt;</code>: <em>Optional</em>: Controls how sections an' planks be displayed. If not provided, ye have t' provide yer implementat'n 'n <code>list.&lt;FORMAT&gt;</code> an' <code>single.&lt;FORMAT&gt;</code></li>
</ul>
<p>For a real-world example, check out th' <code>markdown</code> output format implementat'n</p>
<ul>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/baseof.md" rel="external" target="_self"><code>layouts/_default/baseof.md</code></a></li>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/list.md" rel="external" target="_self"><code>layouts/_default/list.md</code></a></li>
<li><a href="https://github.com/McShelby/hugo-theme-relearn/blob/main/layouts/_default/single.md" rel="external" target="_self"><code>layouts/_default/single.md</code></a></li>
</ul>
<h2 id="migration-to-relearn-7-or-higher">Migrat'n t' Relearrrn 7 or higher</h2>
<p>Previous t' Relearrrn 7, HTML output formats did not use th' <code>baseof.html</code> but now do.</p>
<h3 id="for-html-output-formats-1">For HTML Output Formats</h3>
<ul>
<li>
<p>Move yer files <code>layouts/partials/article.&lt;FORMAT&gt;.html</code> t' <code>layouts/_default/views/article.&lt;FORMAT&gt;.html</code></p>
<p>Th' files will most likely require further modificat'ns as they now receive th' plank as it context (dot <code>.</code>) instead o' th' <code>.page</code> an' <code>.content</code> parameter.</p>
<p><strong>Old</strong>:</p>
<div class="tab-panel" data-tab-group="dd3402aa12819fd976cd07ecc44e17ab">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialsarticleltformatgthtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('dd3402aa12819fd976cd07ecc44e17ab','layoutspartialsarticleltformatgthtml')"
>
<span class="tab-nav-text">layouts/partials/article.&lt;FORMAT&gt;.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialsarticleltformatgthtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code" hl_Lines="1-3 10 16"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line hl"><span class="cl">{{- $page := .page }}
</span></span><span class="line hl"><span class="cl">{{- $content := .content }}
</span></span><span class="line hl"><span class="cl">{{- wit' $page }}
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">article</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;default&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">header</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;headline&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> {{- partial &#34;content-header.html&#34; . }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">header</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> {{partial &#34;heading-pre.html&#34; .}}{{partial &#34;head'n.html&#34; .}}{{partial &#34;heading-post.html&#34; .}}
</span></span><span class="line"><span class="cl">
</span></span><span class="line hl"><span class="cl"> {{ $content | safeHTML }}
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">footer</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;footline&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> {{- partial &#34;content-footer.html&#34; . }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">footer</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">article</span><span class="p">&gt;</span>
</span></span><span class="line hl"><span class="cl">{{- end }}</span></span></code></pre></div>
</div>
</div>
</div>
</div><p><strong>New</strong>:</p>
<div class="tab-panel" data-tab-group="c6cb13c37eb53d217316d9fd9ed367cb">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layouts_defaultviewsarticleltformatgthtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('c6cb13c37eb53d217316d9fd9ed367cb','layouts_defaultviewsarticleltformatgthtml')"
>
<span class="tab-nav-text">layouts/_default/views/article.&lt;FORMAT&gt;.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layouts_defaultviewsarticleltformatgthtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code" hl_Lines="7"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">article</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;default&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">header</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;headline&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> {{- partial &#34;content-header.html&#34; . }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">header</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> {{partial &#34;heading-pre.html&#34; .}}{{partial &#34;head'n.html&#34; .}}{{partial &#34;heading-post.html&#34; .}}
</span></span><span class="line"><span class="cl">
</span></span><span class="line hl"><span class="cl"> {{ partial &#34;article-content.html&#34; . }}
</span></span><span class="line"><span class="cl">
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">footer</span> <span class="na">class</span><span class="o">=</span><span class="s">&#34;footline&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> {{- partial &#34;content-footer.html&#34; . }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">footer</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">article</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div></li>
</ul>
<h3 id="for-non-html-output-formats-1">For Non-HTML Output Formats</h3>
<ul>
<li>
<p>Merge yer files <code>layouts/partials/header.&lt;FORMAT&gt;.html</code>, <code>layouts/partials/footer.&lt;FORMAT&gt;.html</code> t' <code>layouts/_default/baseof.&lt;FORMAT&gt;.html</code></p>
<p><strong>Old</strong>:</p>
<div class="tab-panel" data-tab-group="31dd1b191cbb655ecb61b353189c252b">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialsheaderltformatgthtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('31dd1b191cbb655ecb61b353189c252b','layoutspartialsheaderltformatgthtml')"
>
<span class="tab-nav-text">layouts/partials/header.&lt;FORMAT&gt;.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialsheaderltformatgthtml"
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="cp">&lt;!DOCTYPE html&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">html</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">head</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">title</span><span class="p">&gt;</span>{{ .Title }}<span class="p">&lt;/</span><span class="nt">title</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">style</span> <span class="na">type</span><span class="o">=</span><span class="s">&#34;text/css&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="c">/* add some styles here t' make it pretty */</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">style</span> <span class="na">type</span><span class="o">=</span><span class="s">&#34;text/css&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="c">/* add chroma style fer code highlight'n */</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span><span class="err">{-</span> <span class="err">&#34;/assets/css/chroma-relearn-light.css&#34;</span> <span class="err">|</span> <span class="err">readFile</span> <span class="err">|</span> <span class="err">safeCSS</span> <span class="p">}</span><span class="err">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">head</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">body</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">main</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><div class="tab-panel" data-tab-group="8dc315073ef687416d30cd0b867467c3">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialsfooterltformatgthtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('8dc315073ef687416d30cd0b867467c3','layoutspartialsfooterltformatgthtml')"
>
<span class="tab-nav-text">layouts/partials/footer.&lt;FORMAT&gt;.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layoutspartialsfooterltformatgthtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">main</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">body</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">html</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div><p><strong>New</strong>:</p>
<p>Th' upper part o' th' file be from yer <code>header.&lt;FORMAT&gt;.html</code> an' th' lower part be from yer <code>footer.&lt;FORMAT&gt;.html</code>.</p>
<p>Th' marked line needs t' be added, so yer output format uses a potential <code>layouts/_default/views/article.&lt;FORMAT&gt;.html</code></p>
<div class="tab-panel" data-tab-group="160359c19f15b39fd8ec3dc1d7c54c3f">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layouts_defaultbaseofltformatgthtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('160359c19f15b39fd8ec3dc1d7c54c3f','layouts_defaultbaseofltformatgthtml')"
>
<span class="tab-nav-text">layouts/_default/baseof.&lt;FORMAT&gt;.html</span>
</button>
</div>
<div class="tab-content-container">
<div
data-tab-item="layouts_defaultbaseofltformatgthtml"
class="tab-content tab-panel-style cstyle initial active">
<div class="tab-content-text">
<div class="highlight wrap-code" hl_Lines="15"><pre tabindex="0" class="chroma"><code class="language-html" data-lang="html"><span class="line"><span class="cl"><span class="cp">&lt;!DOCTYPE html&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">html</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">head</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">title</span><span class="p">&gt;</span>{{ .Title }}<span class="p">&lt;/</span><span class="nt">title</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">style</span> <span class="na">type</span><span class="o">=</span><span class="s">&#34;text/css&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="c">/* add some styles here t' make it pretty */</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">style</span> <span class="na">type</span><span class="o">=</span><span class="s">&#34;text/css&#34;</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="c">/* add chroma style fer code highlight'n */</span>
</span></span><span class="line"><span class="cl"> <span class="p">{</span><span class="err">{-</span> <span class="err">&#34;/assets/css/chroma-relearn-light.css&#34;</span> <span class="err">|</span> <span class="err">readFile</span> <span class="err">|</span> <span class="err">safeCSS</span> <span class="p">}</span><span class="err">}</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">style</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">head</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;</span><span class="nt">body</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"> <span class="p">&lt;</span><span class="nt">main</span><span class="p">&gt;</span>
</span></span><span class="line hl"><span class="cl"> {{- block &#34;body&#34; . }}{{ end }}
</span></span><span class="line"><span class="cl"> <span class="p">&lt;/</span><span class="nt">main</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">body</span><span class="p">&gt;</span>
</span></span><span class="line"><span class="cl"><span class="p">&lt;/</span><span class="nt">html</span><span class="p">&gt;</span></span></span></code></pre></div>
</div>
</div>
</div>
</div></li>
</ul>
<footer class="footline">
<div class="R-taxonomy taxonomy-categories cstyle" title="Categorrries" style="--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);">
<i class="fa-fw fas fa-layer-group"></i>
<ul>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/explanation/index.html">Explanation</a></li>
<li><a class="term-link" href="/hugo-theme-relearn/pir/categories/howto/index.html">Howto</a></li>
</ul>
</div>
</footer>
</article>
</div>
</main>
</div>
<aside id="R-sidebar" class="default-animation showVisitedLinks">
<div id="R-header-topbar" class="default-animation"></div>
<div id="R-header-wrapper" class="default-animation">
<div id="R-header" class="default-animation">
<style>
a#R-logo {
font-size: 1.875rem;
margin-top: -.8125rem;
max-width: 60%;
width: 14.125rem;
}
@media only all and (max-width: 59.999rem) {
a#R-logo {
font-size: 1.5625rem;
margin-top: -.1875rem;
}
}
#R-logo svg,
#R-logo svg * {
opacity: .945;
}
#R-logo svg {
margin-bottom: -1.25rem;
margin-inline-start: -1.47rem;
margin-inline-end: .5rem;
width: 40.5%;
}
@media only all and (max-width: 59.999rem) {
#R-logo svg {
margin-bottom: -.75rem;
margin-inline-start: -1.47rem;
margin-inline-end: .5rem;
}
}
</style>
<a id="R-logo" href="/hugo-theme-relearn/pir/index.html">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64.044 64.044">
<path d="M46.103 136.34c-.642-.394-1.222-2.242-1.98-2.358-.76-.117-1.353.506-1.618 1.519-.266 1.012-.446 4.188.173 5.538.213.435.482.787 1.03.845.547.057.967-.504 1.45-1.027.482-.523.437-.9 1.142-.612.705.289 1.051.4 1.586 1.229.535.828 1.085 4.043.868 5.598-.241 1.458-.531 2.8-.59 4.088.26.075.517.148.772.217 2.68.724 5.373 1.037 7.873.02.001-.028.01-.105.008-.11-.048-.165-.18-.41-.36-.698-.18-.29-.414-.645-.586-1.114a3.212 3.212 0 0 1-.125-1.735c.056-.21.153-.342.249-.475 1.237-1.193 2.932-1.373 4.244-1.384.557-.004 1.389.016 2.198.255.809.239 1.706.724 2.068 1.843.187.578.114 1.17-.043 1.623-.153.438-.369.783-.545 1.091-.178.31-.329.6-.401.821-.007.02-.003.071-.005.094 2.256 1.008 4.716.91 7.189.398.55-.114 1.11-.247 1.673-.377.344-1.085.678-2.145.852-3.208.124-.752.158-2.311-.078-3.538-.118-.613-.306-1.15-.52-1.489-.221-.349-.413-.501-.747-.538-.243-.027-.51.013-.796.098-.67.223-1.33.606-1.966.76l-.008.002-.109.032c-.556.152-1.233.158-1.797-.36-.556-.51-.89-1.367-1.117-2.596-.283-1.528-.075-3.279.89-4.518l.071-.09h.07c.65-.71 1.485-.802 2.16-.599.706.213 1.333.629 1.772.84.736.354 1.185.319 1.475.171.291-.148.5-.439.668-.955.332-1.017.301-2.819.022-4.106-.148-.684-.13-1.292-.13-1.883-1.558-.463-3.067-.982-4.574-1.208-1.128-.169-2.263-.173-3.298.164-.13.046-.256.095-.38.15-.373.164-.633.342-.805.52-.077.098-.081.105-.087.21-.004.068.031.289.13.571.1.282.256.634.467 1.03.279.524.448 1.063.431 1.618a2.12 2.12 0 0 1-.499 1.309 1.757 1.757 0 0 1-.62.51h-.002c-.515.291-1.107.404-1.723.464-.86.083-1.787.026-2.598-.097-.806-.123-1.47-.28-1.948-.555-.444-.256-.79-.547-1.037-.925a2.273 2.273 0 0 1-.356-1.301c.029-.837.403-1.437.625-1.897.111-.23.191-.433.236-.583.045-.15.044-.25.046-.24-.005-.029-.127-.355-1.015-.741-1.138-.495-2.322-.673-3.533-.668h-.015a9.711 9.711 0 0 0-.521.016h-.002c-1.163.057-2.35.308-3.541.569.383 1.531.79 2.753.818 4.502-.096 1.297.158 2.114-1.03 2.935-.85.588-1.508.729-2.15.335" style="fill:#282828;fill-opacity:1;stroke:none;stroke-width:1.03763;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" transform="translate(-40.698 -95.175)"/>
<path d="M61.472 101.34v.002c-.3-.003-.603.01-.894.04-.544.055-1.39.165-1.778.306-1.238.364.13 2.344.41 2.913.28.569.285 2.03.14 2.134-.144.103-.375.261-.934.345-.56.084.03-.037-1.589.086-1.62.122-5.506.29-8.265.248-.022.26-.036.521-.097.808-.309 1.442-.63 3.163-.494 4.074.071.473.168.65.414.8.23.14.737.235 1.62-.004.834-.227 1.3-.442 1.887-.456.595-.016 1.555.472 1.965.717.411.245-.03-.008.002 0s.128.05.176.102c.049.053-.276-.523.104.199.379.721.72 3.256.002 4.68-.46.913-1.01 1.49-1.64 1.711-.63.22-1.229.067-1.734-.135-.881-.353-1.584-.7-2.205-.647-1.199 1.94-1.186 4.17-.6 6.602.097.397.212.814.327 1.23 2.68-.556 5.542-1.016 8.337.132 1.064.437 1.73 1.015 1.902 1.857.169.831-.193 1.508-.438 1.986-.122.238-.23.46-.307.642-.07.164-.096.28-.104.324.069.429.309.723.686.945.385.227.89.355 1.35.423.723.104 1.567.152 2.287.086.693-.064 1.032-.338 1.241-.544a2.447 2.447 0 0 0 .303-.437.175.175 0 0 0 .013-.035c-.004-.066-.037-.246-.195-.527-.46-.816-.87-1.595-.817-2.51.028-.476.218-.938.529-1.288.304-.343.698-.586 1.186-.79 1.442-.606 2.96-.609 4.372-.409 1.525.216 2.963.679 4.378 1.083.226-2.09.784-3.9.592-5.77-.058-.565-.287-1.333-.598-1.827-.32-.508-.59-.717-1.036-.642-.648.11-1.472.935-2.707 1.078-.791.092-1.494-.267-1.95-.86-.45-.583-.678-1.335-.78-2.101-.202-1.525.031-3.229.89-4.27.615-.747 1.45-.887 2.15-.74.687.145 1.307.492 1.857.745v-.002c.546.252 1.033.388 1.281.344a.547.547 0 0 0 .353-.188c.113-.124.242-.35.384-.75.604-1.712.206-3.68-.303-5.654-.667.145-1.336.293-2.018.413-1.341.236-2.73.392-4.136.273-.656-.055-1.695-.085-2.58-.476-.442-.195-.903-.514-1.157-1.093-.259-.591-.205-1.313.08-2.014.223-.64 1.082-2.178.692-2.585-.391-.407-1.651-.56-2.554-.571z" style="fill:#282828;fill-opacity:1;stroke:none;stroke-width:.992837;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" transform="translate(-40.698 -95.175)"/>
<path d="M83.128 98.116c-.484 1.875-1.057 3.757-2.486 5.033-.638.57-1.13.666-1.483.548-.401-.134-.715-.506-1.058-.973-.338-.461-.655-.97-1.076-1.332-.192-.165-.404-.315-.683-.38-.279-.066-.599-.02-.9.102-.489.196-.89.58-1.28 1.047a6.1 6.1 0 0 0-.985 1.632c-.234.591-.356 1.174-.277 1.713.072.487.392.977.905 1.185.463.187.926.156 1.36.154.433 0 .843.01 1.242.147.55.189.79.736.822 1.368.034.66-.145 1.412-.393 1.988l-.008.021c-.74 1.705-1.946 2.893-3.004 4.349l-.664.915.979.099c.924.092 1.788.26 2.468.675.46.281 1.806 1.205 2.794 2.222.497.513.888 1.031 1.047 1.502.078.231.095.422.05.6a.93.93 0 0 1-.345.474c-.301.223-.606.395-.864.532l-.354.186c-.107.058-.189.087-.345.228a.637.637 0 0 1 .062-.045l-.064.041-.209.236-.103.343s.003.126.007.152c.003.017.003.007.004.015v.002c.016.195.061.307.133.476a4.1 4.1 0 0 0 .32.596 5.7 5.7 0 0 0 2.8 2.258c.284.108.908.321 1.548.36.33.02.59.015.912-.13h.002c.08-.037.228-.095.382-.281.153-.186.19-.355.212-.445l.019-.075.003-.078c.023-.585-.037-1.296.072-1.899.153-.657.435-.956 1.009-.909 2.771.239 4.74 1.955 6.693 3.83l.742.714.279-1.155c.55-2.29 1.093-4.464 2.928-5.977.692-.57 1.184-.642 1.527-.509.39.151.676.536.996.995.319.458.605.926 1.07 1.212.194.119.464.232.784.209.32-.024.638-.163.988-.384 1.022-.645 1.778-1.756 2.086-2.942.136-.522.102-.991-.046-1.301-.158-.334-.433-.553-.754-.707-.653-.314-1.468-.373-2.094-.486-.825-.15-1.22-.475-1.345-.878-.13-.417 0-.953.335-1.61.6-1.173 1.887-2.602 3.13-3.911l.498-.526-.449-.432c-1.545-1.49-3.163-3.01-5.252-3.715h-.002c-.473-.16-1.097-.413-1.73-.424h-.003c-.311-.004-.596.04-.883.24v.002c-.22.155-.483.537-.583.937l-.008.036-.006.038c-.116.773-.06 1.467-.217 1.995-.063.212-.198.418-.359.507-.202.111-.492.153-.976.072-.582-.097-1.978-.69-3.021-1.503-.523-.407-.934-.85-1.117-1.3a1.153 1.153 0 0 1-.083-.63c.03-.184.1-.477.308-.593.21-.116.941-.32 1.377-.642h.002c.192-.141.403-.367.518-.64.114-.275.127-.526.123-.774-.006-.142-.036-.192-.08-.3a8.417 8.417 0 0 0-3-3.027c-1.226-.725-2.585-1.135-3.927-1.539-.434-.12-.844-.111-1.02.466zm.912.947c1.186.364 2.357.718 3.345 1.303 1.035.612 1.864 1.488 2.507 2.528-.514.263-1.095.5-1.44.79-.345.29-.729.914-.815 1.434-.084.509 0 .968.155 1.347.301.74.85 1.276 1.44 1.735 1.18.92 2.554 1.545 3.47 1.698.604.1 1.186.088 1.739-.216.594-.327.935-.911 1.088-1.427.264-.884.193-1.664.262-2.17h.1c.3.006.926.206 1.417.371 1.646.554 3.044 1.773 4.431 3.089-1.102 1.174-2.222 2.423-2.888 3.73-.42.823-.73 1.789-.453 2.687.283.913 1.1 1.415 2.138 1.603.691.126 1.472.226 1.84.403.19.091.258.182.278.223.03.064.058.075-.023.387-.21.804-.761 1.598-1.413 2.01-.247.155-.365.183-.407.187-.042.003-.061.002-.172-.066-.144-.088-.455-.473-.772-.929-.317-.454-.714-1.07-1.452-1.356-.783-.304-1.776-.022-2.713.75-1.942 1.6-2.626 3.764-3.146 5.8-1.802-1.676-3.772-3.138-6.589-3.517h-.002c-.346-.095-1.013-.031-1.293.143-.735.501-1.005 1.132-1.168 2.007-.125.69-.082 1.216-.074 1.659-.055.006-.046.01-.104.006-.42-.026-1.035-.215-1.244-.295-.947-.361-1.774-1.006-2.314-1.857-.054-.085-.072-.132-.109-.2l.027-.016c.284-.15.656-.36 1.045-.648.44-.327.789-.798.93-1.35a2.4 2.4 0 0 0-.068-1.379c-.254-.751-.753-1.353-1.295-1.911-1.09-1.124-2.452-2.049-2.99-2.378-.609-.372-1.303-.44-1.981-.56.875-1.094 1.878-2.251 2.596-3.921.294-.823.543-1.907.513-2.658-.049-.97-.489-2.013-1.52-2.367-.579-.2-1.131-.204-1.58-.203-.45.002-.786-.006-.97-.08h-.002c-.264-.107-.236-.108-.268-.33-.025-.17.021-.553.183-.962a4.67 4.67 0 0 1 .725-1.192c.29-.348.617-.59.705-.626.142-.057.176-.05.22-.04.045.011.127.052.263.17.235.201.56.671.92 1.161.354.484.791 1.08 1.543 1.33.8.267 1.784-.052 2.671-.846 1.594-1.424 2.235-3.317 2.714-5.051zm11.705 7.023c-.02.014.042-.002.042 0l-.008.035c.05-.2-.028-.04-.034-.035zM79.472 122.45a.198.198 0 0 1 .005.023v.014c-.002-.01-.003-.03-.005-.037zm-.29.732-.006.01-.044.027c.016-.01.033-.024.05-.036z" style="color:#000;fill:#282828;stroke-width:1.02352;-inkscape-stroke:none" transform="translate(-40.698 -95.175)"/>
<path d="M76.694 128.845c-.85-.012-1.668.253-2.434.67-.01.592-.015 1.17.109 1.772.323 1.573.422 3.553-.07 5.147-.247.804-.684 1.535-1.347 1.891-.663.356-1.467.296-2.362-.159-.522-.266-1.059-.62-1.487-.757-.223-.072-.392-.096-.522-.069-.13.027-.232.094-.362.27-.53.719-.681 1.823-.497 2.876.177 1.012.418 1.438.543 1.56.143.137.26.154.604.055.548-.158 1.523-.857 2.573-.972l.02-.002.5.058c.686.081 1.247.562 1.622 1.19.372.62.591 1.37.73 2.136.279 1.532.25 3.16.083 4.232-.14.91-.394 1.72-.632 2.53 1.719-.385 3.485-.692 5.307-.36 1.174.214 2.749.574 3.762 1.977l.088.122.046.159c.162.551.16 1.114.024 1.578-.13.45-.348.772-.533 1.023-.181.246-.336.444-.437.606-.102.16-.141.275-.145.336-.01.17 0 .197.07.315.057.1.186.242.39.366.408.246 1.106.414 1.843.45a7.842 7.842 0 0 0 2.174-.21 4.28 4.28 0 0 0 .822-.296c.218-.106.385-.242.377-.233l.029-.031c.025-.035.05-.072.05-.068 0-.004 0-.017-.003-.05a2.733 2.733 0 0 0-.21-.579c-.26-.548-.839-1.333-.822-2.46.01-.657.27-1.21.598-1.576.32-.357.696-.575 1.074-.736.759-.323 1.57-.418 2.054-.458 1.653-.136 3.252.296 4.755.765.457.142.905.29 1.352.434.325-2.258.902-4.247.598-6.217-.071-.46-.25-1.169-.486-1.684-.238-.518-.495-.762-.675-.779-.351-.032-.716.14-1.174.418-.457.277-1.005.665-1.695.742-.745.082-1.406-.291-1.84-.908-.428-.608-.653-1.394-.754-2.196-.203-1.596.016-3.377.794-4.493.568-.813 1.358-.984 2.024-.835.65.146 1.243.51 1.769.779.524.267.99.413 1.237.365a.527.527 0 0 0 .346-.2c.11-.132.235-.373.37-.798.612-1.918.27-3.894-.246-6.054-2.815-.851-5.49-1.534-8.089-.267a.727.727 0 0 0-.223.148c-.024.028-.018.021-.026.056.001-.003-.01.178.07.44.162.522.611 1.29.911 1.978l.004.009.029.063.024.084V133c.162.635.016 1.297-.274 1.727-.272.404-.618.636-.952.81-.675.353-1.399.484-1.724.533a5.888 5.888 0 0 1-3.973-.795c-.512-.311-.876-.594-1.133-1.02-.282-.466-.318-1.084-.172-1.557.252-.814.715-1.266.971-1.89a.663.663 0 0 0 .047-.14c.001-.013 0-.006-.007-.037a.761.761 0 0 0-.184-.268c-.264-.267-.865-.595-1.54-.826-1.356-.462-3.07-.659-3.583-.686-.062-.002-.121-.006-.178-.006z" style="fill:#282828;fill-opacity:1;stroke:none;stroke-width:.991342;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" transform="translate(-40.698 -95.175)"/>
</svg>Relearn
</a>
</div>
<script>
window.index_js_url="/hugo-theme-relearn/searchindex.pir.js?1735854108";
</script>
<search><form action="/hugo-theme-relearn/pir/search/index.html" method="get">
<div class="searchbox default-animation">
<button class="search-detail" type="submit" title="Searrrch (CTRL+ALT+f)"><i class="fas fa-search"></i></button>
<label class="a11y-only" for="R-search-by">Searrrch</label>
<input data-search-input id="R-search-by" name="search-by" class="search-by" type="search" placeholder="Searrrch...">
<button class="search-clear" type="button" data-search-clear="" title="Clearrr searrrch"><i class="fas fa-times" title="Clearrr searrrch"></i></button>
</div>
</form></search>
<script>
var contentLangs=['en'];
</script>
<script src="/hugo-theme-relearn/js/auto-complete.js?1735854108" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.min.js?1735854108" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.stemmer.support.min.js?1735854108" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.multi.min.js?1735854108" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.en.min.js?1735854108" defer></script>
<script src="/hugo-theme-relearn/js/search.js?1735854108" defer></script>
</div>
<div id="R-homelinks" class="default-animation">
<hr class="padding">
</div>
<div id="R-content-wrapper" class="highlightable">
<div id="R-shortcutmenu-home" class="R-sidebarmenu">
<ul class="enlarge morespace collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/index.html"><input type="checkbox" id="R-section-e1ed3a04f1f57a27be4a8d0eb274be18" aria-controls="R-subsections-e1ed3a04f1f57a27be4a8d0eb274be18"><label for="R-section-e1ed3a04f1f57a27be4a8d0eb274be18"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Introduction</span></label><a class="padding" href="/hugo-theme-relearn/pir/introduction/index.html"><i class='fa-fw fas fa-star'></i> Introduction<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-e1ed3a04f1f57a27be4a8d0eb274be18" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/quickstart/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/quickstart/index.html">Gettin&#39; started<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/upgrade/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/upgrade/index.html">Upgrade<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/tools/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/tools/index.html">Tool Integration<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/releasenotes/index.html"><input type="checkbox" id="R-section-f5041d5a50403ef230e5b3d632ef5b5e" aria-controls="R-subsections-f5041d5a50403ef230e5b3d632ef5b5e"><label for="R-section-f5041d5a50403ef230e5b3d632ef5b5e"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu What&#39;s New</span></label><a class="padding" href="/hugo-theme-relearn/pir/introduction/releasenotes/index.html">What&#39;s New<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-f5041d5a50403ef230e5b3d632ef5b5e" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/releasenotes/5/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/releasenotes/5/index.html">Version 5<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/releasenotes/4/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/releasenotes/4/index.html">Version 4<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/releasenotes/3/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/releasenotes/3/index.html">Version 3<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/releasenotes/2/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/releasenotes/2/index.html">Version 2<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/releasenotes/1/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/releasenotes/1/index.html">Version 1<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/changelog/index.html"><input type="checkbox" id="R-section-4c8f9a0e787a57f2acea75c8c8f09920" aria-controls="R-subsections-4c8f9a0e787a57f2acea75c8c8f09920"><label for="R-section-4c8f9a0e787a57f2acea75c8c8f09920"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Changelog</span></label><a class="padding" href="/hugo-theme-relearn/pir/introduction/changelog/index.html">Changelog<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-4c8f9a0e787a57f2acea75c8c8f09920" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/changelog/5/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/changelog/5/index.html">Version 5<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/changelog/4/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/changelog/4/index.html">Version 4<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/changelog/3/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/changelog/3/index.html">Version 3<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/changelog/2/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/changelog/2/index.html">Version 2<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/introduction/changelog/1/index.html"><a class="padding" href="/hugo-theme-relearn/pir/introduction/changelog/1/index.html">Version 1<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li></ul></li>
<li class="parent " data-nav-id="/hugo-theme-relearn/pir/configuration/index.html"><input type="checkbox" id="R-section-6f6dce359ca8d596b5b1de1969a0aca2" aria-controls="R-subsections-6f6dce359ca8d596b5b1de1969a0aca2" checked><label for="R-section-6f6dce359ca8d596b5b1de1969a0aca2"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Configurrrat&#39;n</span></label><a class="padding" href="/hugo-theme-relearn/pir/configuration/index.html"><i class='fa-fw fas fa-gears'></i> Configurrrat&#39;n<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-6f6dce359ca8d596b5b1de1969a0aca2" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sitemanagement/index.html"><input type="checkbox" id="R-section-30019b7214c19b7e47568868fc6b6f47" aria-controls="R-subsections-30019b7214c19b7e47568868fc6b6f47"><label for="R-section-30019b7214c19b7e47568868fc6b6f47"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Site Management</span></label><a class="padding" href="/hugo-theme-relearn/pir/configuration/sitemanagement/index.html">Site Management<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-30019b7214c19b7e47568868fc6b6f47" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sitemanagement/structure/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sitemanagement/structure/index.html">Directory Structure<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sitemanagement/multilingual/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sitemanagement/multilingual/index.html">Multilingual<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sitemanagement/meta/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sitemanagement/meta/index.html">Meta Information<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sitemanagement/deployment/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sitemanagement/deployment/index.html">Deployment Scenarios<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sitemanagement/outputformats/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sitemanagement/outputformats/index.html">Available Output Formats<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sitemanagement/stableoutput/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sitemanagement/stableoutput/index.html">Stable Output<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/branding/index.html"><input type="checkbox" id="R-section-f4b18c0bbd92c3635c0cb3ea3fa97f55" aria-controls="R-subsections-f4b18c0bbd92c3635c0cb3ea3fa97f55"><label for="R-section-f4b18c0bbd92c3635c0cb3ea3fa97f55"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Brrrand&#39;n</span></label><a class="padding" href="/hugo-theme-relearn/pir/configuration/branding/index.html">Brrrand&#39;n<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-f4b18c0bbd92c3635c0cb3ea3fa97f55" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/branding/logo/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/branding/logo/index.html">Logo<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/branding/colors/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/branding/colors/index.html">Brrrand&#39;n<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/branding/modules/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/branding/modules/index.html">Module Theming<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/branding/generator/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/branding/generator/index.html">Stylesheet Generrrat&#39;r<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sidebar/index.html"><input type="checkbox" id="R-section-8a12d8e45be5abcac33050ee02bdb0dc" aria-controls="R-subsections-8a12d8e45be5abcac33050ee02bdb0dc"><label for="R-section-8a12d8e45be5abcac33050ee02bdb0dc"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Sidebar</span></label><a class="padding" href="/hugo-theme-relearn/pir/configuration/sidebar/index.html">Sidebar<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-8a12d8e45be5abcac33050ee02bdb0dc" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sidebar/width/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sidebar/width/index.html">Width<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sidebar/headerfooter/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sidebar/headerfooter/index.html">Header &amp; Footer<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sidebar/search/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sidebar/search/index.html">Search<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/sidebar/menus/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sidebar/menus/index.html">Menus<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/content/index.html"><input type="checkbox" id="R-section-2a87e0c002948b04af017faf43e5f0cd" aria-controls="R-subsections-2a87e0c002948b04af017faf43e5f0cd"><label for="R-section-2a87e0c002948b04af017faf43e5f0cd"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Content</span></label><a class="padding" href="/hugo-theme-relearn/pir/configuration/content/index.html">Content<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-2a87e0c002948b04af017faf43e5f0cd" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/content/width/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/content/width/index.html">Width<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/content/titles/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/content/titles/index.html">Titles &amp; Breadcrumbs<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/content/headings/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/content/headings/index.html">Headings<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/content/linking/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/content/linking/index.html">Linking<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/content/hidden/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/content/hidden/index.html">Hidden Pages<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="parent " data-nav-id="/hugo-theme-relearn/pir/configuration/customization/index.html"><input type="checkbox" id="R-section-19858c09ec2f1c50e3d9de05671968f7" aria-controls="R-subsections-19858c09ec2f1c50e3d9de05671968f7" checked><label for="R-section-19858c09ec2f1c50e3d9de05671968f7"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Customization</span></label><a class="padding" href="/hugo-theme-relearn/pir/configuration/customization/index.html">Customization<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-19858c09ec2f1c50e3d9de05671968f7" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/customization/partials/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/customization/partials/index.html">Partials<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/customization/extending/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/customization/extending/index.html">Extending Scripts<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/customization/imageeffects/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/customization/imageeffects/index.html">Image Effects<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/customization/topbar/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/customization/topbar/index.html">Topbarrr<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/customization/designs/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/customization/designs/index.html">Page Designs<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="active " data-nav-id="/hugo-theme-relearn/pir/configuration/customization/outputformats/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/customization/outputformats/index.html">Output Formats<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/customization/taxonomy/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/customization/taxonomy/index.html">Taxonomies<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/configuration/reference/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/reference/index.html">Options Reference<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/index.html"><input type="checkbox" id="R-section-8b31cad8bcabec610b76d42ea98e772d" aria-controls="R-subsections-8b31cad8bcabec610b76d42ea98e772d"><label for="R-section-8b31cad8bcabec610b76d42ea98e772d"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Rambl&#39;n</span></label><a class="padding" href="/hugo-theme-relearn/pir/authoring/index.html"><i class='fa-fw fab fa-markdown'></i> Rambl&#39;n<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-8b31cad8bcabec610b76d42ea98e772d" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/structure/index.html"><a class="padding" href="/hugo-theme-relearn/pir/authoring/structure/index.html">Directory Structure<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/frontmatter/index.html"><input type="checkbox" id="R-section-825d31d37330c362736813c7d9e192f9" aria-controls="R-subsections-825d31d37330c362736813c7d9e192f9"><label for="R-section-825d31d37330c362736813c7d9e192f9"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Front Matter</span></label><a class="padding" href="/hugo-theme-relearn/pir/authoring/frontmatter/index.html">Front Matter<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-825d31d37330c362736813c7d9e192f9" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/frontmatter/designs/index.html"><a class="padding" href="/hugo-theme-relearn/pir/authoring/frontmatter/designs/index.html">Page Designs<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="crosslink " data-nav-id="/hugo-theme-relearn/pir/configuration/sidebar/menus/index.html"><a class="padding" href="/hugo-theme-relearn/pir/configuration/sidebar/menus/index.html">Menus<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/frontmatter/linking/index.html"><a class="padding" href="/hugo-theme-relearn/pir/authoring/frontmatter/linking/index.html">Linking<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/frontmatter/topbar/index.html"><a class="padding" href="/hugo-theme-relearn/pir/authoring/frontmatter/topbar/index.html">Topbarrr<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/frontmatter/reference/index.html"><a class="padding" href="/hugo-theme-relearn/pir/authoring/frontmatter/reference/index.html">Reference<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/meta/index.html"><a class="padding" href="/hugo-theme-relearn/pir/authoring/meta/index.html">Meta Information<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/markdown/index.html"><a class="padding" href="/hugo-theme-relearn/pir/authoring/markdown/index.html">Marrrkdown Rules<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/authoring/imageeffects/index.html"><a class="padding" href="/hugo-theme-relearn/pir/authoring/imageeffects/index.html">Image Effects<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/index.html"><input type="checkbox" id="R-section-d1d72bec74e5a90c315283c9c8d23f10" aria-controls="R-subsections-d1d72bec74e5a90c315283c9c8d23f10"><label for="R-section-d1d72bec74e5a90c315283c9c8d23f10"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Shorrrtcodes</span></label><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/index.html"><i class='fa-fw fas fa-shapes'></i> Shorrrtcodes<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-d1d72bec74e5a90c315283c9c8d23f10" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/badge/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/badge/index.html">Badge<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/button/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/button/index.html">Button<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/index.html"><input type="checkbox" id="R-section-fe0c5ca44d2308c87cd4ce4b0f5b840c" aria-controls="R-subsections-fe0c5ca44d2308c87cd4ce4b0f5b840c"><label for="R-section-fe0c5ca44d2308c87cd4ce4b0f5b840c"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu Children</span></label><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/index.html">Children<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-fe0c5ca44d2308c87cd4ce4b0f5b840c" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/test/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/test/index.html">plank X<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/children-1/index.html"><input type="checkbox" id="R-section-3a684958d7eda0d20aafd9ea9a702f88" aria-controls="R-subsections-3a684958d7eda0d20aafd9ea9a702f88"><label for="R-section-3a684958d7eda0d20aafd9ea9a702f88"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu plank 1</span></label><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/index.html">plank 1<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-3a684958d7eda0d20aafd9ea9a702f88" class="collapsible-menu">
<li class="alwaysopen " data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/index.html"><input type="checkbox" id="R-section-2727dc6e08fcb96a079be91aa7704ea4" aria-controls="R-subsections-2727dc6e08fcb96a079be91aa7704ea4" checked><label for="R-section-2727dc6e08fcb96a079be91aa7704ea4"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu plank 1-1</span></label><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/index.html">plank 1-1<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-2727dc6e08fcb96a079be91aa7704ea4" class="collapsible-menu">
<li class="headless alwaysopen " data-nav-id=""><input type="checkbox" id="R-section-c58ec1ea7ddbdef134eb892a5c569711" aria-controls="R-subsections-c58ec1ea7ddbdef134eb892a5c569711" checked><label for="R-section-c58ec1ea7ddbdef134eb892a5c569711"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu plank 1-1-2 (headless)</span></label><span class="padding">plank 1-1-2 (headless)</span><ul id="R-subsections-c58ec1ea7ddbdef134eb892a5c569711" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-1/index.html">plank 1-1-2-1<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-2/children-1-1-2-2/index.html">plank 1-1-2-2<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/children-1/children-1-1/children-1-1-3/index.html">plank 1-1-3<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/children-2/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/children-2/index.html">plank 2<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/children-3/index.html"><input type="checkbox" id="R-section-f00fb288327406c804f8936fa36d260b" aria-controls="R-subsections-f00fb288327406c804f8936fa36d260b"><label for="R-section-f00fb288327406c804f8936fa36d260b"><i class="fa-fw fas fa-chevron-right"></i><span class="a11y-only">Submenu plank 3</span></label><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/children-3/index.html">plank 3<i class="fa-fw fas fa-check read-icon"></i></a><ul id="R-subsections-f00fb288327406c804f8936fa36d260b" class="collapsible-menu">
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/children/children-3/test3/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/children/children-3/test3/index.html">plank 3-1<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li></ul></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/expand/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/expand/index.html">Expand<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/highlight/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/highlight/index.html">Highlight<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/icon/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/icon/index.html">Icon<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/include/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/include/index.html">Include<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/math/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/math/index.html">Math<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/mermaid/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/mermaid/index.html">Merrrmaid<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/notice/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/notice/index.html">Notice<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/openapi/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/openapi/index.html">OpenAPI<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/resources/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/resources/index.html">Resources<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/siteparam/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/siteparam/index.html">SiteParam<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/tab/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/tab/index.html">Tab<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/shortcodes/tabs/index.html"><a class="padding" href="/hugo-theme-relearn/pir/shortcodes/tabs/index.html">Tabs<i class="fa-fw fas fa-check read-icon"></i></a></li></ul></li>
</ul>
</div>
<div id="R-shortcutmenu-shortcuts" class="R-sidebarmenu">
<div class="nav-title padding">Morrre</div>
<ul class="space collapsible-menu">
<li class="" data-nav-id="https://github.com/McShelby/hugo-theme-relearn"><a class="padding" href="https://github.com/McShelby/hugo-theme-relearn" target="_self"><i class="fa-fw fab fa-github"></i> GitHub Repo<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/showcase/index.html"><a class="padding" href="/hugo-theme-relearn/pir/showcase/index.html"><i class="fa-fw fas fa-camera"></i> Showcases<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/more/credits/index.html"><a class="padding" href="/hugo-theme-relearn/pir/more/credits/index.html"><i class='fa-fw fas fa-bullhorn'></i> Crrredits<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/tags/index.html"><a class="padding" href="/hugo-theme-relearn/pir/tags/index.html">Arrr! Tags<i class="fa-fw fas fa-check read-icon"></i></a></li>
<li class="" data-nav-id="/hugo-theme-relearn/pir/categories/index.html"><a class="padding" href="/hugo-theme-relearn/pir/categories/index.html"><i class="fa-fw fas fa-layer-group"></i> Categorrries<i class="fa-fw fas fa-check read-icon"></i></a></li>
</ul>
</div>
<div class="padding footermargin footerLangSwitch footerVariantSwitch footerVisitedLinks footerFooter showLangSwitch showVariantSwitch showVisitedLinks showFooter"></div>
<div id="R-menu-footer">
<hr class="padding default-animation footerLangSwitch footerVariantSwitch footerVisitedLinks footerFooter showLangSwitch showVariantSwitch showVisitedLinks showFooter">
<div id="R-prefooter" class="footerLangSwitch footerVariantSwitch footerVisitedLinks showLangSwitch showVariantSwitch showVisitedLinks">
<ul>
<li id="R-select-language-container" class="footerLangSwitch showLangSwitch">
<div class="padding menu-control">
<i class="fa-fw fas fa-language"></i>
<span>&nbsp;</span>
<div class="control-style">
<label class="a11y-only" for="R-select-language">Language</label>
<select id="R-select-language" onchange="location = this.querySelector( this.value ).dataset.url;">
<option id="R-select-language-en" value="#R-select-language-en" data-url="/hugo-theme-relearn/configuration/customization/outputformats/index.html" lang="en">English</option>
<option id="R-select-language-pir" value="#R-select-language-pir" data-url="/hugo-theme-relearn/pir/configuration/customization/outputformats/index.html" lang="art-x-pir" selected>Arrr! ☠ Pirrratish ☠</option>
</select>
</div>
<div class="clear"></div>
</div>
</li>
<li id="R-select-variant-container" class="footerVariantSwitch showVariantSwitch">
<div class="padding menu-control">
<i class="fa-fw fas fa-paint-brush"></i>
<span>&nbsp;</span>
<div class="control-style">
<label class="a11y-only" for="R-select-variant">Theme</label>
<select id="R-select-variant" onchange="window.relearn.changeVariant( this.value );">
<option id="R-select-variant-relearn-auto" value="relearn-auto" selected>Relearn Light/Dark</option>
<option id="R-select-variant-relearn-light" value="relearn-light">Relearn Light</option>
<option id="R-select-variant-relearn-dark" value="relearn-dark">Relearn Dark</option>
<option id="R-select-variant-relearn-bright" value="relearn-bright">Relearn Bright</option>
<option id="R-select-variant-zen-auto" value="zen-auto">Zen Light/Dark</option>
<option id="R-select-variant-zen-light" value="zen-light">Zen Light</option>
<option id="R-select-variant-zen-dark" value="zen-dark">Zen Dark</option>
<option id="R-select-variant-retro-auto" value="retro-auto">Retro Learn/Neon</option>
<option id="R-select-variant-neon" value="neon">Neon</option>
<option id="R-select-variant-learn" value="learn">Learn</option>
<option id="R-select-variant-blue" value="blue">Blue</option>
<option id="R-select-variant-green" value="green">Green</option>
<option id="R-select-variant-red" value="red">Red</option>
</select>
</div>
<div class="clear"></div>
</div>
<script>window.relearn.markVariant();</script>
</li>
<li class="footerVisitedLinks showVisitedLinks">
<div class="padding menu-control">
<i class="fa-fw fas fa-history"></i>
<span>&nbsp;</span>
<div class="control-style">
<button onclick="clearHistory();">Clearrr Historrry</button>
</div>
<div class="clear"></div>
</div>
</li>
</ul>
</div>
<div id="R-footer" class="footerFooter showFooter">
<span class="github-buttons"></span>
<p>Built with <a href="https://github.com/McShelby/hugo-theme-relearn" title="love"><i class="fas fa-heart"></i></a> by <a href="https://gohugo.io/">Hugo</a></p>
<script>
function githubButtonsScheme(){
var scheme = 'light';
var colorPropertyValue = window.getComputedStyle( document.querySelector( '#R-sidebar' ) ).getPropertyValue( 'background-color' );
var colorValues = colorPropertyValue.match( /\d+/g ).map( function( e ){ return parseInt(e,10); });
if( colorValues.length === 3 && ((0.2126 * colorValues[0]) + (0.7152 * colorValues[1]) + (0.0722 * colorValues[2]) < 165) ){
scheme = 'dark';
}
return scheme;
}
function githubButtonsInit(){
if( !window.githubButtons ){
setTimeout( githubButtonsInit, 50 );
return;
}
var scheme = githubButtonsScheme();
var githubButtonsHTML = `
<a class="github-button" href="https://github.com/McShelby/hugo-theme-relearn/archive/main.zip" data-color-scheme="${scheme}" data-icon="octicon-cloud-download" aria-label="Download McShelby/hugo-theme-relearn on GitHub">Download</a>
<a class="github-button" href="https://github.com/McShelby/hugo-theme-relearn" data-color-scheme="${scheme}" data-icon="octicon-star" data-show-count="true" aria-label="Star McShelby/hugo-theme-relearn on GitHub">Star</a>
<a class="github-button" href="https://github.com/McShelby/hugo-theme-relearn/fork" data-color-scheme="${scheme}" data-icon="octicon-repo-forked" data-show-count="true" aria-label="Fork McShelby/hugo-theme-relearn on GitHub">Fork</a>
`;
document.querySelector( '.github-buttons' ).innerHTML = githubButtonsHTML;
document.querySelectorAll( '.github-button' ).forEach( function( anchor ){
anchor.dataset.colorScheme = scheme;
window.githubButtons.render( anchor, function( el ){
anchor.parentNode.replaceChild( el, anchor );
});
});
}
document.addEventListener( 'themeVariantLoaded', function( e ){
setTimeout( githubButtonsInit, 400 );
});
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
setTimeout( githubButtonsInit, 400 );
});
</script>
<script async src="/hugo-theme-relearn/js/github-buttons.js?1735854108"></script>
</div>
</div>
</div>
</aside>
<script src="/hugo-theme-relearn/js/clipboard.min.js?1735854108" defer></script>
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1735854108" defer></script>
<script src="/hugo-theme-relearn/js/theme.js?1735854108" defer></script>
</body>
</html>