nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2025-06-10 19:04:03 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

deploy: 46e7e5e4cd

Browse source
This commit is contained in:
McShelby 2024-04-07 11:45:38 +00:00
parent ff6d64bc31
commit 2611a9597c
264 changed files with 12648 additions and 12648 deletions
basics/customization
index.htmlindex.print.html

78
basics/customization/index.html
View file

@ -23,21 +23,21 @@
<link href="https://mcshelby.github.io/hugo-theme-relearn/pir/basics/customization/index.html" rel="alternate" hreflang="art-pir">
<link href="/hugo-theme-relearn/basics/customization/index.xml" rel="alternate" type="application/rss+xml" title="Customization :: Hugo Relearn Theme">
<link href="/hugo-theme-relearn/basics/customization/index.print.html" rel="alternate" type="text/html" title="Customization :: Hugo Relearn Theme">
<link href="/hugo-theme-relearn/images/logo.svg?1712490231" rel="icon" type="image/svg+xml">
<link href="/hugo-theme-relearn/images/logo.svg?1712490332" rel="icon" type="image/svg+xml">
<!-- https://github.com/filamentgroup/loadCSS/blob/master/README.md#how-to-use -->
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1712490231" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1712490231" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/nucleus.css?1712490231" rel="stylesheet">
<link href="/hugo-theme-relearn/css/auto-complete.css?1712490231" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1712490231" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1712490231" rel="stylesheet">
<link href="/hugo-theme-relearn/css/fonts.css?1712490231" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fonts.css?1712490231" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/theme.css?1712490231" rel="stylesheet">
<link href="/hugo-theme-relearn/css/theme-relearn-auto.css?1712490231" rel="stylesheet" id="R-variant-style">
<link href="/hugo-theme-relearn/css/chroma-relearn-auto.css?1712490231" rel="stylesheet" id="R-variant-chroma-style">
<link href="/hugo-theme-relearn/css/variant.css?1712490231" rel="stylesheet">
<link href="/hugo-theme-relearn/css/print.css?1712490231" rel="stylesheet" media="print">
<link href="/hugo-theme-relearn/css/ie.css?1712490231" rel="stylesheet">
<script src="/hugo-theme-relearn/js/url.js?1712490231"></script>
<script src="/hugo-theme-relearn/js/variant.js?1712490231"></script>
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1712490333" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1712490333" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/nucleus.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/auto-complete.css?1712490333" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1712490333" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/fonts.css?1712490333" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fonts.css?1712490333" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/theme.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/theme-relearn-auto.css?1712490333" rel="stylesheet" id="R-variant-style">
<link href="/hugo-theme-relearn/css/chroma-relearn-auto.css?1712490333" rel="stylesheet" id="R-variant-chroma-style">
<link href="/hugo-theme-relearn/css/variant.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/print.css?1712490333" rel="stylesheet" media="print">
<link href="/hugo-theme-relearn/css/ie.css?1712490333" rel="stylesheet">
<script src="/hugo-theme-relearn/js/url.js?1712490333"></script>
<script src="/hugo-theme-relearn/js/variant.js?1712490333"></script>
<script>
window.relearn = window.relearn || {};
window.relearn.relBasePath='..\/..';
@ -366,7 +366,7 @@
<div class="box-label"><i class="fa-fw fas fa-exclamation-triangle"></i> Warning</div>
<div class="box-content">
<p>Using a <code>baseURL</code> with a subdirectory and <code>relativeURLs=true</code> are mutally exclusive due to the fact, that <a href="https://github.com/gohugoio/hugo/issues/12130" target="_blank">Hugo does not apply the <code>baseURL</code> correctly</a>.</p>
<p>Using a <code>baseURL</code> with a subdirectory and <code>relativeURLs=true</code> are mutally exclusive due to the fact, that <a href="https://github.com/gohugoio/hugo/issues/12130" rel="external" target="_blank">Hugo does not apply the <code>baseURL</code> correctly</a>.</p>
<p>If you need both, you have to generate your site twice but with different settings into separate directories.</p>
</div>
</div>
@ -580,8 +580,8 @@
</div>
</div>
<p>You can access this page by either clicking on the magnifier glass or by typing some search term and pressing <code>ENTER</code> inside of the menu&rsquo;s search box .</p>
<p><a href="#R-image-67f4c45ae974a669aac78386e159e059" class="lightbox-link"><img alt="Screenshot of the dedicated search page" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/search_page.png?&width=60pc" style=" height: auto; width: 60pc;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-67f4c45ae974a669aac78386e159e059"><img alt="Screenshot of the dedicated search page" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/search_page.png?&width=60pc"></a></p>
<p><a href="#R-image-571744e2ff0cfada534f8dba93fea805" class="lightbox-link"><img alt="Screenshot of the dedicated search page" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/search_page.png?&width=60pc" style=" height: auto; width: 60pc;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-571744e2ff0cfada534f8dba93fea805"><img alt="Screenshot of the dedicated search page" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/search_page.png?&width=60pc"></a></p>
<div class="box notices cstyle note">
<div class="box-label"><i class="fa-fw fas fa-exclamation-circle"></i> Note</div>
@ -684,7 +684,7 @@
<div class="box-label"><i class="fa-fw fas fa-exclamation-circle"></i> Note</div>
<div class="box-content">
<p>The resulting URL will not be <a href="https://gohugo.io/templates/output-formats/#configure-output-formats" target="_blank">configured ugly</a> in terms of <a href="https://gohugo.io/content-management/urls/#ugly-urls" target="_blank">Hugo&rsquo;s URL handling</a> even if you&rsquo;ve set <code>uglyURLs=true</code> in your <code>hugo.toml</code>. This is due to the fact that for one mime type only one suffix can be configured.</p>
<p>The resulting URL will not be <a href="https://gohugo.io/templates/output-formats/#configure-output-formats" rel="external" target="_blank">configured ugly</a> in terms of <a href="https://gohugo.io/content-management/urls/#ugly-urls" rel="external" target="_blank">Hugo&rsquo;s URL handling</a> even if you&rsquo;ve set <code>uglyURLs=true</code> in your <code>hugo.toml</code>. This is due to the fact that for one mime type only one suffix can be configured.</p>
<p>Nevertheless, if you&rsquo;re unhappy with the resulting URLs you can manually redefine <code>outputFormats.print</code> in your own <code>hugo.toml</code> to your liking.</p>
</div>
</div>
@ -822,10 +822,10 @@ appearance, you will have to configure the <code>landingPageName</code> for the
</div>
</div>
<p>The home button is going to look like this:</p>
<p><a href="#R-image-685ec42a8dd682ba5fa2745e642ca496" class="lightbox-link"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/home_button_defaults.png?width=18.75rem" style=" height: auto; width: 18.75rem;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-685ec42a8dd682ba5fa2745e642ca496"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/home_button_defaults.png?width=18.75rem"></a></p>
<p><a href="#R-image-eab7f233a90a3e575e52a0feb64d32ce" class="lightbox-link"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/home_button_defaults.png?width=18.75rem" style=" height: auto; width: 18.75rem;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-eab7f233a90a3e575e52a0feb64d32ce"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/home_button_defaults.png?width=18.75rem"></a></p>
<h2 id="social-media-meta-tags">Social Media Meta Tags</h2>
<p>You can add social media meta tags for the <a href="https://gohugo.io/templates/internal/#open-graph" target="_blank">Open Graph</a> protocol and <a href="https://gohugo.io/templates/internal/#twitter-cards" target="_blank">Twitter Cards</a> to your site. These are configured as mentioned in the Hugo docs.</p>
<p>You can add social media meta tags for the <a href="https://gohugo.io/templates/internal/#open-graph" rel="external" target="_blank">Open Graph</a> protocol and <a href="https://gohugo.io/templates/internal/#twitter-cards" rel="external" target="_blank">Twitter Cards</a> to your site. These are configured as mentioned in the Hugo docs.</p>
<h2 id="change-the-menu-width">Change the Menu Width</h2>
<p>The menu width adjusts automatically for different screen sizes.</p>
<table>
@ -872,13 +872,13 @@ appearance, you will have to configure the <code>landingPageName</code> for the
<li>
<p>Write the shortcode file <code>layouts/shortcodes/myshortcode.html</code> and add the following line</p>
<div class="tab-panel" data-tab-group="7ec7f4aff1a5a1c3f3c1e8f13f71de83">
<div class="tab-panel" data-tab-group="872aed442bcef6f91c61a4ab064f2b9f">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutsshortcodesmyshortcodehtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('7ec7f4aff1a5a1c3f3c1e8f13f71de83','layoutsshortcodesmyshortcodehtml')"
onclick="switchTab('872aed442bcef6f91c61a4ab064f2b9f','layoutsshortcodesmyshortcodehtml')"
>
<span class="tab-nav-text">layouts/shortcodes/myshortcode.html</span>
</button>
@ -965,19 +965,19 @@ appearance, you will have to configure the <code>landingPageName</code> for the
</div>
</li>
<li>
<p>Add the dependency loader file <code>layouts/partials/dependencies/myshortcode.html</code>. The loader file will be called from multiple locations inside of the theme with the parameter <code>page</code> containing the current <a href="https://gohugo.io/methods/page/" target="_blank">page</a> variable and <code>location</code> with one of the currently defined locations</p>
<p>Add the dependency loader file <code>layouts/partials/dependencies/myshortcode.html</code>. The loader file will be called from multiple locations inside of the theme with the parameter <code>page</code> containing the current <a href="https://gohugo.io/methods/page/" rel="external" target="_blank">page</a> variable and <code>location</code> with one of the currently defined locations</p>
<ul>
<li><code>header</code>: if called at the end of the HTML <code>head</code> element</li>
<li><code>footer</code>: if called at the end of the HTML <code>body</code> element</li>
</ul>
<div class="tab-panel" data-tab-group="24b6fa8f7c11c2f66b1f4b5ab7fccfe0">
<div class="tab-panel" data-tab-group="8d482378d30223a4a63d6c974da093e7">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialsdependenciesmyshortcodehtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('24b6fa8f7c11c2f66b1f4b5ab7fccfe0','layoutspartialsdependenciesmyshortcodehtml')"
onclick="switchTab('8d482378d30223a4a63d6c974da093e7','layoutspartialsdependenciesmyshortcodehtml')"
>
<span class="tab-nav-text">layouts/partials/dependencies/myshortcode.html</span>
</button>
@ -1010,14 +1010,14 @@ appearance, you will have to configure the <code>landingPageName</code> for the
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span><span class="o">-</span> <span class="nx">partial</span> <span class="s">&#34;dependencies.html&#34;</span> <span class="p">(</span><span class="nx">dict</span> <span class="s">&#34;page&#34;</span> <span class="p">.</span> <span class="s">&#34;location&#34;</span> <span class="s">&#34;mylocation&#34;</span><span class="p">)</span> <span class="p">}}</span></span></span></code></pre></div></div>
</div>
<h2 id="output-formats">Output Formats</h2>
<p>Certain parts of the theme can be changed for support of your own <a href="https://gohugo.io/templates/output-formats/" target="_blank">output formats</a>. Eg. if you define a new output format <code>PLAINTEXT</code> in your <code>hugo.toml</code>, you can add a file <code>layouts/partials/header.plaintext.html</code> to change the way, the page header should look like for that output format.</p>
<p>Certain parts of the theme can be changed for support of your own <a href="https://gohugo.io/templates/output-formats/" rel="external" target="_blank">output formats</a>. Eg. if you define a new output format <code>PLAINTEXT</code> in your <code>hugo.toml</code>, you can add a file <code>layouts/partials/header.plaintext.html</code> to change the way, the page header should look like for that output format.</p>
<h2 id="react-to-variant-switches-in-javascript">React to Variant Switches in JavaScript</h2>
<p>Once a color variant is fully loaded, either initially or by switching the color variant manually with the variant selector, the custom event <code>themeVariantLoaded</code> on the <code>document</code> will be dispatched. You can add an event listener and react to changes.</p>
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-javascript" data-lang="javascript"><span class="line"><span class="cl"><span class="nb">document</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span> <span class="s1">&#39;themeVariantLoaded&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span> <span class="nx">e</span> <span class="p">){</span>
</span></span><span class="line"><span class="cl"> <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span> <span class="nx">e</span><span class="p">.</span><span class="nx">detail</span><span class="p">.</span><span class="nx">variant</span> <span class="p">);</span> <span class="c1">// `relearn-light`
</span></span></span><span class="line"><span class="cl"><span class="c1"></span><span class="p">});</span></span></span></code></pre></div><h2 id="partials">Partials</h2>
<p>The Relearn theme has been built to be as configurable as possible by defining multiple <a href="https://gohugo.io/templates/partials/" target="_blank">partials</a></p>
<p>In <code>themes/hugo-theme-relearn/layouts/partials/</code>, you will find all the partials defined for this theme. If you need to overwrite something, don&rsquo;t change the code directly. Instead <a href="https://gohugo.io/themes/customizing/" target="_blank">follow this page</a>. You&rsquo;d create a new partial in the <code>layouts/partials</code> folder of your local project. This partial will have the priority.</p>
<p>The Relearn theme has been built to be as configurable as possible by defining multiple <a href="https://gohugo.io/templates/partials/" rel="external" target="_blank">partials</a></p>
<p>In <code>themes/hugo-theme-relearn/layouts/partials/</code>, you will find all the partials defined for this theme. If you need to overwrite something, don&rsquo;t change the code directly. Instead <a href="https://gohugo.io/themes/customizing/" rel="external" target="_blank">follow this page</a>. You&rsquo;d create a new partial in the <code>layouts/partials</code> folder of your local project. This partial will have the priority.</p>
<p>This theme defines the following partials :</p>
<ul>
<li><code>header.html</code>: the header of the page. See <a href="/hugo-theme-relearn/basics/customization/index.html#output-formats">output-formats</a></li>
@ -1134,12 +1134,12 @@ appearance, you will have to configure the <code>landingPageName</code> for the
<script>
var contentLangs=['en'];
</script>
<script src="/hugo-theme-relearn/js/auto-complete.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.min.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.stemmer.support.min.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.multi.min.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.en.min.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/search.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/auto-complete.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.min.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.stemmer.support.min.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.multi.min.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/lunr/lunr.en.min.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/search.js?1712490333" defer></script>
</div>
<div id="R-homelinks" class="default-animation">
<hr class="padding">
@ -1302,13 +1302,13 @@ appearance, you will have to configure the <code>landingPageName</code> for the
setTimeout( githubButtonsInit, 400 );
});
</script>
<script async src="/hugo-theme-relearn/js/github-buttons.js?1712490231"></script>
<script async src="/hugo-theme-relearn/js/github-buttons.js?1712490333"></script>
</div>
</div>
</div>
</aside>
<script src="/hugo-theme-relearn/js/clipboard.min.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/theme.js?1712490231" defer></script>
<script src="/hugo-theme-relearn/js/clipboard.min.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/theme.js?1712490333" defer></script>
</body>
</html>

66
basics/customization/index.print.html
View file

@ -23,22 +23,22 @@
<link href="https://mcshelby.github.io/hugo-theme-relearn/pir/basics/customization/index.html" rel="alternate" hreflang="art-pir">
<link href="https://mcshelby.github.io/hugo-theme-relearn/basics/customization/index.html" rel="canonical" type="text/html" title="Customization :: Hugo Relearn Theme">
<link href="/hugo-theme-relearn/basics/customization/index.xml" rel="alternate" type="application/rss+xml" title="Customization :: Hugo Relearn Theme">
<link href="/hugo-theme-relearn/images/logo.svg?1712490231" rel="icon" type="image/svg+xml">
<link href="/hugo-theme-relearn/images/logo.svg?1712490332" rel="icon" type="image/svg+xml">
<!-- https://github.com/filamentgroup/loadCSS/blob/master/README.md#how-to-use -->
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1712490232" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1712490232" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/nucleus.css?1712490232" rel="stylesheet">
<link href="/hugo-theme-relearn/css/auto-complete.css?1712490232" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1712490232" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1712490232" rel="stylesheet">
<link href="/hugo-theme-relearn/css/fonts.css?1712490232" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fonts.css?1712490232" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/theme.css?1712490232" rel="stylesheet">
<link href="/hugo-theme-relearn/css/theme-relearn-auto.css?1712490232" rel="stylesheet" id="R-variant-style">
<link href="/hugo-theme-relearn/css/chroma-relearn-auto.css?1712490232" rel="stylesheet" id="R-variant-chroma-style">
<link href="/hugo-theme-relearn/css/variant.css?1712490232" rel="stylesheet">
<link href="/hugo-theme-relearn/css/print.css?1712490232" rel="stylesheet" media="print">
<link href="/hugo-theme-relearn/css/format-print.css?1712490232" rel="stylesheet">
<link href="/hugo-theme-relearn/css/ie.css?1712490232" rel="stylesheet">
<script src="/hugo-theme-relearn/js/url.js?1712490232"></script>
<script src="/hugo-theme-relearn/js/variant.js?1712490232"></script>
<link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1712490333" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fontawesome-all.min.css?1712490333" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/nucleus.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/auto-complete.css?1712490333" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/auto-complete.css?1712490333" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/perfect-scrollbar.min.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/fonts.css?1712490333" rel="stylesheet" media="print" onload="this.media='all';this.onload=null;"><noscript><link href="/hugo-theme-relearn/css/fonts.css?1712490333" rel="stylesheet"></noscript>
<link href="/hugo-theme-relearn/css/theme.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/theme-relearn-auto.css?1712490333" rel="stylesheet" id="R-variant-style">
<link href="/hugo-theme-relearn/css/chroma-relearn-auto.css?1712490333" rel="stylesheet" id="R-variant-chroma-style">
<link href="/hugo-theme-relearn/css/variant.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/print.css?1712490333" rel="stylesheet" media="print">
<link href="/hugo-theme-relearn/css/format-print.css?1712490333" rel="stylesheet">
<link href="/hugo-theme-relearn/css/ie.css?1712490333" rel="stylesheet">
<script src="/hugo-theme-relearn/js/url.js?1712490333"></script>
<script src="/hugo-theme-relearn/js/variant.js?1712490333"></script>
<script>
window.relearn = window.relearn || {};
window.relearn.relBasePath='..\/..';
@ -319,7 +319,7 @@
<div class="box-label"><i class="fa-fw fas fa-exclamation-triangle"></i> Warning</div>
<div class="box-content">
<p>Using a <code>baseURL</code> with a subdirectory and <code>relativeURLs=true</code> are mutally exclusive due to the fact, that <a href="https://github.com/gohugoio/hugo/issues/12130" target="_blank">Hugo does not apply the <code>baseURL</code> correctly</a>.</p>
<p>Using a <code>baseURL</code> with a subdirectory and <code>relativeURLs=true</code> are mutally exclusive due to the fact, that <a href="https://github.com/gohugoio/hugo/issues/12130" rel="external" target="_blank">Hugo does not apply the <code>baseURL</code> correctly</a>.</p>
<p>If you need both, you have to generate your site twice but with different settings into separate directories.</p>
</div>
</div>
@ -533,8 +533,8 @@
</div>
</div>
<p>You can access this page by either clicking on the magnifier glass or by typing some search term and pressing <code>ENTER</code> inside of the menu&rsquo;s search box .</p>
<p><a href="#R-image-67f4c45ae974a669aac78386e159e059" class="lightbox-link"><img alt="Screenshot of the dedicated search page" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/search_page.png?&width=60pc" style=" height: auto; width: 60pc;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-67f4c45ae974a669aac78386e159e059"><img alt="Screenshot of the dedicated search page" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/search_page.png?&width=60pc"></a></p>
<p><a href="#R-image-571744e2ff0cfada534f8dba93fea805" class="lightbox-link"><img alt="Screenshot of the dedicated search page" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/search_page.png?&width=60pc" style=" height: auto; width: 60pc;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-571744e2ff0cfada534f8dba93fea805"><img alt="Screenshot of the dedicated search page" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/search_page.png?&width=60pc"></a></p>
<div class="box notices cstyle note">
<div class="box-label"><i class="fa-fw fas fa-exclamation-circle"></i> Note</div>
@ -637,7 +637,7 @@
<div class="box-label"><i class="fa-fw fas fa-exclamation-circle"></i> Note</div>
<div class="box-content">
<p>The resulting URL will not be <a href="https://gohugo.io/templates/output-formats/#configure-output-formats" target="_blank">configured ugly</a> in terms of <a href="https://gohugo.io/content-management/urls/#ugly-urls" target="_blank">Hugo&rsquo;s URL handling</a> even if you&rsquo;ve set <code>uglyURLs=true</code> in your <code>hugo.toml</code>. This is due to the fact that for one mime type only one suffix can be configured.</p>
<p>The resulting URL will not be <a href="https://gohugo.io/templates/output-formats/#configure-output-formats" rel="external" target="_blank">configured ugly</a> in terms of <a href="https://gohugo.io/content-management/urls/#ugly-urls" rel="external" target="_blank">Hugo&rsquo;s URL handling</a> even if you&rsquo;ve set <code>uglyURLs=true</code> in your <code>hugo.toml</code>. This is due to the fact that for one mime type only one suffix can be configured.</p>
<p>Nevertheless, if you&rsquo;re unhappy with the resulting URLs you can manually redefine <code>outputFormats.print</code> in your own <code>hugo.toml</code> to your liking.</p>
</div>
</div>
@ -775,10 +775,10 @@ appearance, you will have to configure the <code>landingPageName</code> for the
</div>
</div>
<p>The home button is going to look like this:</p>
<p><a href="#R-image-685ec42a8dd682ba5fa2745e642ca496" class="lightbox-link"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/home_button_defaults.png?width=18.75rem" style=" height: auto; width: 18.75rem;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-685ec42a8dd682ba5fa2745e642ca496"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/home_button_defaults.png?width=18.75rem"></a></p>
<p><a href="#R-image-eab7f233a90a3e575e52a0feb64d32ce" class="lightbox-link"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow figure-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/home_button_defaults.png?width=18.75rem" style=" height: auto; width: 18.75rem;"></a>
<a href="javascript:history.back();" class="lightbox-back" id="R-image-eab7f233a90a3e575e52a0feb64d32ce"><img alt="Default Home Button" class="bg-white border lazy lightbox noshadow lightbox-image" loading="lazy" src="/hugo-theme-relearn/basics/customization/home_button_defaults.png?width=18.75rem"></a></p>
<h2 id="social-media-meta-tags">Social Media Meta Tags</h2>
<p>You can add social media meta tags for the <a href="https://gohugo.io/templates/internal/#open-graph" target="_blank">Open Graph</a> protocol and <a href="https://gohugo.io/templates/internal/#twitter-cards" target="_blank">Twitter Cards</a> to your site. These are configured as mentioned in the Hugo docs.</p>
<p>You can add social media meta tags for the <a href="https://gohugo.io/templates/internal/#open-graph" rel="external" target="_blank">Open Graph</a> protocol and <a href="https://gohugo.io/templates/internal/#twitter-cards" rel="external" target="_blank">Twitter Cards</a> to your site. These are configured as mentioned in the Hugo docs.</p>
<h2 id="change-the-menu-width">Change the Menu Width</h2>
<p>The menu width adjusts automatically for different screen sizes.</p>
<table>
@ -825,13 +825,13 @@ appearance, you will have to configure the <code>landingPageName</code> for the
<li>
<p>Write the shortcode file <code>layouts/shortcodes/myshortcode.html</code> and add the following line</p>
<div class="tab-panel" data-tab-group="7ec7f4aff1a5a1c3f3c1e8f13f71de83">
<div class="tab-panel" data-tab-group="872aed442bcef6f91c61a4ab064f2b9f">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutsshortcodesmyshortcodehtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('7ec7f4aff1a5a1c3f3c1e8f13f71de83','layoutsshortcodesmyshortcodehtml')"
onclick="switchTab('872aed442bcef6f91c61a4ab064f2b9f','layoutsshortcodesmyshortcodehtml')"
>
<span class="tab-nav-text">layouts/shortcodes/myshortcode.html</span>
</button>
@ -918,19 +918,19 @@ appearance, you will have to configure the <code>landingPageName</code> for the
</div>
</li>
<li>
<p>Add the dependency loader file <code>layouts/partials/dependencies/myshortcode.html</code>. The loader file will be called from multiple locations inside of the theme with the parameter <code>page</code> containing the current <a href="https://gohugo.io/methods/page/" target="_blank">page</a> variable and <code>location</code> with one of the currently defined locations</p>
<p>Add the dependency loader file <code>layouts/partials/dependencies/myshortcode.html</code>. The loader file will be called from multiple locations inside of the theme with the parameter <code>page</code> containing the current <a href="https://gohugo.io/methods/page/" rel="external" target="_blank">page</a> variable and <code>location</code> with one of the currently defined locations</p>
<ul>
<li><code>header</code>: if called at the end of the HTML <code>head</code> element</li>
<li><code>footer</code>: if called at the end of the HTML <code>body</code> element</li>
</ul>
<div class="tab-panel" data-tab-group="24b6fa8f7c11c2f66b1f4b5ab7fccfe0">
<div class="tab-panel" data-tab-group="8d482378d30223a4a63d6c974da093e7">
<div class="tab-nav">
<div class="tab-nav-title">&#8203;</div>
<button
data-tab-item="layoutspartialsdependenciesmyshortcodehtml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('24b6fa8f7c11c2f66b1f4b5ab7fccfe0','layoutspartialsdependenciesmyshortcodehtml')"
onclick="switchTab('8d482378d30223a4a63d6c974da093e7','layoutspartialsdependenciesmyshortcodehtml')"
>
<span class="tab-nav-text">layouts/partials/dependencies/myshortcode.html</span>
</button>
@ -963,14 +963,14 @@ appearance, you will have to configure the <code>landingPageName</code> for the
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-go" data-lang="go"><span class="line"><span class="cl"><span class="p">{{</span><span class="o">-</span> <span class="nx">partial</span> <span class="s">&#34;dependencies.html&#34;</span> <span class="p">(</span><span class="nx">dict</span> <span class="s">&#34;page&#34;</span> <span class="p">.</span> <span class="s">&#34;location&#34;</span> <span class="s">&#34;mylocation&#34;</span><span class="p">)</span> <span class="p">}}</span></span></span></code></pre></div></div>
</div>
<h2 id="output-formats">Output Formats</h2>
<p>Certain parts of the theme can be changed for support of your own <a href="https://gohugo.io/templates/output-formats/" target="_blank">output formats</a>. Eg. if you define a new output format <code>PLAINTEXT</code> in your <code>hugo.toml</code>, you can add a file <code>layouts/partials/header.plaintext.html</code> to change the way, the page header should look like for that output format.</p>
<p>Certain parts of the theme can be changed for support of your own <a href="https://gohugo.io/templates/output-formats/" rel="external" target="_blank">output formats</a>. Eg. if you define a new output format <code>PLAINTEXT</code> in your <code>hugo.toml</code>, you can add a file <code>layouts/partials/header.plaintext.html</code> to change the way, the page header should look like for that output format.</p>
<h2 id="react-to-variant-switches-in-javascript">React to Variant Switches in JavaScript</h2>
<p>Once a color variant is fully loaded, either initially or by switching the color variant manually with the variant selector, the custom event <code>themeVariantLoaded</code> on the <code>document</code> will be dispatched. You can add an event listener and react to changes.</p>
<div class="highlight wrap-code"><pre tabindex="0" class="chroma"><code class="language-javascript" data-lang="javascript"><span class="line"><span class="cl"><span class="nb">document</span><span class="p">.</span><span class="nx">addEventListener</span><span class="p">(</span> <span class="s1">&#39;themeVariantLoaded&#39;</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span> <span class="nx">e</span> <span class="p">){</span>
</span></span><span class="line"><span class="cl"> <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span> <span class="nx">e</span><span class="p">.</span><span class="nx">detail</span><span class="p">.</span><span class="nx">variant</span> <span class="p">);</span> <span class="c1">// `relearn-light`
</span></span></span><span class="line"><span class="cl"><span class="c1"></span><span class="p">});</span></span></span></code></pre></div><h2 id="partials">Partials</h2>
<p>The Relearn theme has been built to be as configurable as possible by defining multiple <a href="https://gohugo.io/templates/partials/" target="_blank">partials</a></p>
<p>In <code>themes/hugo-theme-relearn/layouts/partials/</code>, you will find all the partials defined for this theme. If you need to overwrite something, don&rsquo;t change the code directly. Instead <a href="https://gohugo.io/themes/customizing/" target="_blank">follow this page</a>. You&rsquo;d create a new partial in the <code>layouts/partials</code> folder of your local project. This partial will have the priority.</p>
<p>The Relearn theme has been built to be as configurable as possible by defining multiple <a href="https://gohugo.io/templates/partials/" rel="external" target="_blank">partials</a></p>
<p>In <code>themes/hugo-theme-relearn/layouts/partials/</code>, you will find all the partials defined for this theme. If you need to overwrite something, don&rsquo;t change the code directly. Instead <a href="https://gohugo.io/themes/customizing/" rel="external" target="_blank">follow this page</a>. You&rsquo;d create a new partial in the <code>layouts/partials</code> folder of your local project. This partial will have the priority.</p>
<p>This theme defines the following partials :</p>
<ul>
<li><code>header.html</code>: the header of the page. See <a href="/hugo-theme-relearn/basics/customization/index.html#output-formats">output-formats</a></li>
@ -1003,8 +1003,8 @@ appearance, you will have to configure the <code>landingPageName</code> for the
</div>
</main>
</div>
<script src="/hugo-theme-relearn/js/clipboard.min.js?1712490232" defer></script>
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1712490232" defer></script>
<script src="/hugo-theme-relearn/js/theme.js?1712490232" defer></script>
<script src="/hugo-theme-relearn/js/clipboard.min.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/perfect-scrollbar.min.js?1712490333" defer></script>
<script src="/hugo-theme-relearn/js/theme.js?1712490333" defer></script>
</body>
</html>