2022-04-02 13:30:16 +00:00
<!DOCTYPE html>
2024-04-27 13:29:53 +00:00
< html lang = "en" dir = "ltr" itemscope itemtype = "http://schema.org/Article" >
2022-04-02 13:30:16 +00:00
< head >
< meta charset = "utf-8" >
< meta name = "viewport" content = "height=device-height, width=device-width, initial-scale=1.0, minimum-scale=1.0" >
2024-10-24 17:57:32 +00:00
< meta name = "generator" content = "Hugo 0.136.5" >
2024-10-25 06:34:40 +00:00
< meta name = "generator" content = "Relearn 7.1.1" >
2024-10-13 14:26:50 +00:00
< meta name = "description" content = "Learn how to create and organize your content pages .
Directory StructureYour content' s directory structure">
2023-10-10 21:22:41 +00:00
< meta name = "author" content = "Sören Weber" >
2023-10-11 16:03:03 +00:00
< meta name = "twitter:card" content = "summary_large_image" >
2024-02-24 13:03:50 +00:00
< meta name = "twitter:image" content = "https://mcshelby.github.io/hugo-theme-relearn/images/hero.png" >
2024-10-13 14:26:50 +00:00
< meta name = "twitter:title" content = "Authoring :: Hugo Relearn Theme" >
< meta name = "twitter:description" content = "Learn how to create and organize your content pages .
Directory StructureYour content' s directory structure">
< meta property = "og:url" content = "https://mcshelby.github.io/hugo-theme-relearn/authoring/index.html" >
2024-04-07 13:13:19 +00:00
< meta property = "og:site_name" content = "Hugo Relearn Theme" >
2024-10-13 14:26:50 +00:00
< meta property = "og:title" content = "Authoring :: Hugo Relearn Theme" >
< meta property = "og:description" content = "Learn how to create and organize your content pages .
Directory StructureYour content' s directory structure">
2024-04-07 13:13:19 +00:00
< meta property = "og:locale" content = "en" >
2023-10-11 15:32:39 +00:00
< meta property = "og:type" content = "website" >
2024-02-24 13:03:50 +00:00
< meta property = "og:image" content = "https://mcshelby.github.io/hugo-theme-relearn/images/hero.png" >
2024-10-13 14:26:50 +00:00
< meta itemprop = "name" content = "Authoring :: Hugo Relearn Theme" >
< meta itemprop = "description" content = "Learn how to create and organize your content pages .
Directory StructureYour content' s directory structure">
< meta itemprop = "wordCount" content = "42" >
2024-04-24 19:38:41 +00:00
< meta itemprop = "image" content = "https://mcshelby.github.io/hugo-theme-relearn/images/hero.png" >
2024-10-13 14:26:50 +00:00
< meta itemprop = "keywords" content = "Reference" >
< title > Authoring :: Hugo Relearn Theme< / title >
< link href = "https://mcshelby.github.io/hugo-theme-relearn/authoring/index.html" rel = "alternate" hreflang = "x-default" >
< link href = "https://mcshelby.github.io/hugo-theme-relearn/authoring/index.html" rel = "alternate" hreflang = "en" >
< link href = "https://mcshelby.github.io/hugo-theme-relearn/pir/authoring/index.html" rel = "alternate" hreflang = "art-x-pir" >
< link href = "https://mcshelby.github.io/hugo-theme-relearn/authoring/index.html" rel = "canonical" type = "text/html" title = "Authoring :: Hugo Relearn Theme" >
< link href = "/hugo-theme-relearn/authoring/index.xml" rel = "alternate" type = "application/rss+xml" title = "Authoring :: Hugo Relearn Theme" >
2024-10-25 06:34:40 +00:00
< link href = "/hugo-theme-relearn/images/logo.svg?1729838068" rel = "icon" type = "image/svg+xml" >
< link href = "/hugo-theme-relearn/css/fontawesome-all.min.css?1729838068" rel = "stylesheet" media = "print" onload = "this.media='all';this.onload=null;" > < noscript > < link href = "/hugo-theme-relearn/css/fontawesome-all.min.css?1729838068" rel = "stylesheet" > < / noscript >
< link href = "/hugo-theme-relearn/css/nucleus.css?1729838068" rel = "stylesheet" >
< link href = "/hugo-theme-relearn/css/auto-complete.css?1729838068" rel = "stylesheet" media = "print" onload = "this.media='all';this.onload=null;" > < noscript > < link href = "/hugo-theme-relearn/css/auto-complete.css?1729838068" rel = "stylesheet" > < / noscript >
< link href = "/hugo-theme-relearn/css/perfect-scrollbar.min.css?1729838068" rel = "stylesheet" >
< link href = "/hugo-theme-relearn/css/fonts.css?1729838068" rel = "stylesheet" media = "print" onload = "this.media='all';this.onload=null;" > < noscript > < link href = "/hugo-theme-relearn/css/fonts.css?1729838068" rel = "stylesheet" > < / noscript >
< link href = "/hugo-theme-relearn/css/theme.css?1729838068" rel = "stylesheet" >
< link href = "/hugo-theme-relearn/css/theme-relearn-auto.css?1729838068" rel = "stylesheet" id = "R-variant-style" >
< link href = "/hugo-theme-relearn/css/chroma-relearn-auto.css?1729838068" rel = "stylesheet" id = "R-variant-chroma-style" >
< link href = "/hugo-theme-relearn/css/print.css?1729838068" rel = "stylesheet" media = "print" >
< link href = "/hugo-theme-relearn/css/format-print.css?1729838068" rel = "stylesheet" >
< script src = "/hugo-theme-relearn/js/variant.js?1729838068" > < / script >
2024-03-16 13:44:28 +00:00
< script >
2023-11-16 22:53:34 +00:00
window.relearn = window.relearn || {};
2024-03-18 20:59:19 +00:00
window.relearn.relBasePath='..';
window.relearn.relBaseUri='..\/..';
window.relearn.absBaseUri='https:\/\/mcshelby.github.io\/hugo-theme-relearn';
2024-08-22 16:34:04 +00:00
window.relearn.disableAnchorCopy=false;
window.relearn.disableAnchorScrolling=false;
2023-11-16 22:53:34 +00:00
// variant stuff
2024-04-19 06:38:17 +00:00
window.variants & & variants.init( [ 'relearn-auto', 'relearn-light', 'relearn-dark', 'relearn-bright', 'zen-auto', 'zen-light', 'zen-dark', 'retro-auto', 'neon', 'learn', 'blue', 'green', 'red' ] );
2023-11-16 22:53:34 +00:00
// translations
window.T_Copy_to_clipboard = `Copy to clipboard`;
window.T_Copied_to_clipboard = `Copied to clipboard!`;
window.T_Copy_link_to_clipboard = `Copy link to clipboard`;
window.T_Link_copied_to_clipboard = `Copied link to clipboard!`;
window.T_Reset_view = `Reset view`;
window.T_View_reset = `View reset!`;
window.T_No_results_found = `No results found for "{0}"`;
window.T_N_results_found = `{1} results found for "{0}"`;
2022-04-02 13:30:16 +00:00
< / script >
2022-12-02 15:05:54 +00:00
< style >
2023-09-23 08:19:35 +00:00
#R-body img.bg-white {
2022-12-02 15:05:54 +00:00
background-color: white;
}
< / style >
2022-04-02 13:30:16 +00:00
< / head >
2024-10-13 14:26:50 +00:00
< body class = "mobile-support print disableInlineCopyToClipboard" data-url = "/hugo-theme-relearn/authoring/index.html" >
2023-09-23 08:19:35 +00:00
< div id = "R-body" class = "default-animation" >
< div id = "R-body-overlay" > < / div >
< nav id = "R-topbar" >
2023-09-18 18:49:44 +00:00
< div class = "topbar-wrapper" >
2023-09-13 21:30:04 +00:00
< div class = "topbar-sidebar-divider" > < / div >
2023-09-18 18:49:44 +00:00
< div class = "topbar-area topbar-area-start" data-area = "start" >
2023-12-05 07:41:41 +00:00
< div class = "topbar-button topbar-button-sidebar" data-content-empty = "disable" data-width-s = "show" data-width-m = "hide" data-width-l = "hide" > < button class = "topbar-control" onclick = "toggleNav()" type = "button" title = "Menu (CTRL+ALT+n)" > < i class = "fa-fw fas fa-bars" > < / i > < / button >
2023-09-12 21:10:21 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "topbar-button topbar-button-toc" data-content-empty = "hide" data-width-s = "show" data-width-m = "show" data-width-l = "show" > < button class = "topbar-control" onclick = "toggleTopbarFlyout(this)" type = "button" title = "Table of Contents (CTRL+ALT+t)" > < i class = "fa-fw fas fa-list-alt" > < / i > < / button >
< div class = "topbar-content" >
< div class = "topbar-content-wrapper" >
< / div >
< / div >
< / div >
2023-09-13 21:30:04 +00:00
< / div >
2023-09-20 22:28:27 +00:00
< ol class = "topbar-breadcrumbs breadcrumbs highlightable" itemscope itemtype = "http://schema.org/BreadcrumbList" > < li
2024-10-13 14:26:50 +00:00
itemscope itemtype="https://schema.org/ListItem" itemprop="itemListElement">< span itemprop = "name" > Authoring< / span > < meta itemprop = "position" content = "1" > < / li >
2023-09-13 21:30:04 +00:00
< / ol >
2023-09-18 18:49:44 +00:00
< div class = "topbar-area topbar-area-end" data-area = "end" >
2024-10-13 14:26:50 +00:00
< 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/authoring/_index.en.md" target = "_self" title = "Edit (CTRL+ALT+w)" > < i class = "fa-fw fas fa-pen" > < / i > < / a >
< / div >
< div class = "topbar-button topbar-button-print" data-content-empty = "disable" data-width-s = "area-more" data-width-m = "show" data-width-l = "show" > < a class = "topbar-control" href = "/hugo-theme-relearn/authoring/index.print.html" title = "Print whole chapter (CTRL+ALT+p)" > < i class = "fa-fw fas fa-print" > < / i > < / a >
< / div >
< div class = "topbar-button topbar-button-prev" data-content-empty = "disable" data-width-s = "show" data-width-m = "show" data-width-l = "show" > < a class = "topbar-control" href = "/hugo-theme-relearn/configuration/reference/index.html" title = "Options Reference (🡐)" > < 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/authoring/structure/index.html" title = "Directory Structure (🡒)" > < i class = "fa-fw fas fa-chevron-right" > < / i > < / a >
2024-04-07 19:58:38 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "topbar-button topbar-button-more" data-content-empty = "hide" data-width-s = "show" data-width-m = "show" data-width-l = "show" > < button class = "topbar-control" onclick = "toggleTopbarFlyout(this)" type = "button" title = "More" > < i class = "fa-fw fas fa-ellipsis-v" > < / i > < / button >
< div class = "topbar-content" >
< div class = "topbar-content-wrapper" >
< div class = "topbar-area topbar-area-more" data-area = "more" >
< / div >
< / div >
< / div >
2024-04-07 19:58:38 +00:00
< / div >
2023-09-12 21:19:47 +00:00
< / div >
2022-04-02 13:30:16 +00:00
< / div >
< / nav >
2023-09-23 08:19:35 +00:00
< div id = "R-main-overlay" > < / div >
2024-10-13 14:26:50 +00:00
< main id = "R-body-inner" class = "highlightable chapter" tabindex = "-1" >
2022-04-02 13:30:16 +00:00
< div class = "flex-block-wrapper" >
2024-10-13 14:26:50 +00:00
< article class = "chapter narrow" >
< header class = "headline" >
< / header >
< div class = "article-subheading" > Chapter 3< / div >
2024-04-07 19:58:38 +00:00
2024-10-13 14:26:50 +00:00
< h1 id = "authoring" > Authoring< / h1 >
2022-04-02 13:30:16 +00:00
2024-10-13 14:26:50 +00:00
< p > Learn how to create and organize your content pages.< / p >
< div class = "children children-h2 children-sort-" >
< h2 > < a href = "/hugo-theme-relearn/authoring/structure/index.html" > Directory Structure< / a > < / h2 > < p > Your content' s directory structure< / p >
< h2 > < a href = "/hugo-theme-relearn/authoring/frontmatter/index.html" > Front Matter< / a > < / h2 > < p > All things front matter< / p >
< h2 > < a href = "/hugo-theme-relearn/authoring/meta/index.html" > Meta Information< / a > < / h2 > < p > What page meta information are available< / p >
< h2 > < a href = "/hugo-theme-relearn/authoring/markdown/index.html" > Markdown Syntax< / a > < / h2 > < p > Reference of CommonMark and Markdown extensions< / p >
< h2 > < a href = "/hugo-theme-relearn/authoring/imageeffects/index.html" > Image Effects< / a > < / h2 > < p > How to apply graphical effects to your images< / p >
< / div >
2022-07-05 22:16:52 +00:00
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/reference/index.html" > Reference< / a > < / li >
< / ul >
< / div >
< / footer >
< / article >
2022-04-02 13:30:16 +00:00
< section >
2024-10-13 14:26:50 +00:00
< h1 class = "a11y-only" > Subsections of Authoring< / h1 >
< article class = "default" >
< header class = "headline" >
< / header >
2024-04-07 19:58:38 +00:00
2024-10-13 14:26:50 +00:00
< h1 id = "directory-structure" > Directory Structure< / h1 >
2022-07-05 22:16:52 +00:00
2024-10-13 14:26:50 +00:00
< p > In < strong > Hugo< / strong > , pages are the core of your site.< / p >
< p > The theme generates the navigation menu out of the given directory structure.< / p >
< p > Organize your site like < a href = "https://gohugo.io/content/structure/" rel = "external" target = "_self" > any other Hugo project< / a > . Typically, you will have a < em > content< / em > directory with all your pages.< / p >
2024-03-11 20:44:09 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-plaintext" data-lang = "plaintext" > < span class = "line" > < span class = "cl" > content
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > ├── first-chapter
< / span > < / span > < span class = "line" > < span class = "cl" > │ ├── first-page
< / span > < / span > < span class = "line" > < span class = "cl" > | | |── _index.md
< / span > < / span > < span class = "line" > < span class = "cl" > | │ ├── first-sub-page
< / span > < / span > < span class = "line" > < span class = "cl" > | | | |── _index.md
< / span > < / span > < span class = "line" > < span class = "cl" > | | | |── picture1.png
< / span > < / span > < span class = "line" > < span class = "cl" > | | | └── plain.txt
< / span > < / span > < span class = "line" > < span class = "cl" > │ ├── second-page
< / span > < / span > < span class = "line" > < span class = "cl" > | | |── index.md
< / span > < / span > < span class = "line" > < span class = "cl" > | | |── picture1.png
< / span > < / span > < span class = "line" > < span class = "cl" > | | └── picture2.png
< / span > < / span > < span class = "line" > < span class = "cl" > │ └── third-page.md
< / span > < / span > < span class = "line" > < span class = "cl" > └── _index.md< / span > < / span > < / code > < / pre > < / div >
2023-06-03 22:20:43 +00:00
< div class = "box notices cstyle note" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-exclamation-circle" > < / i > Note
< / div >
2022-12-01 00:38:08 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > While you can also go different, < code > _index.md< / code > (with an underscore) is recommended for each directory, it’ s your < em > directory’ s home page< / em > .< / p >
< p > See < a href = "https://gohugo.io/content-management/" rel = "external" target = "_self" > Hugo’ s guide for content < / a > to learn more.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-04-02 13:30:16 +00:00
< / div >
2023-11-28 22:52:52 +00:00
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/explanation/index.html" > Explanation< / a > < / li >
< / ul >
< / div >
< / footer >
< / article >
< article class = "default" >
< header class = "headline" >
< / header >
< h1 id = "front-matter" > Front Matter< / h1 >
< div class = "children children-h2 children-sort-" >
< h2 > < a href = "/hugo-theme-relearn/authoring/frontmatter/designs/index.html" > Page Designs< / a > < / h2 > < p > How to vary layouts by using page designs< / p >
2024-10-24 15:26:10 +00:00
< h2 > < a href = "/hugo-theme-relearn/authoring/frontmatter/menus/index.html" > Menus< / a > < / h2 > < p > Setting the behavior of the menus< / p >
2024-10-13 14:26:50 +00:00
< h2 > < a href = "/hugo-theme-relearn/authoring/frontmatter/linking/index.html" > Linking< / a > < / h2 > < p > What options are available for links and images< / p >
< h2 > < a href = "/hugo-theme-relearn/authoring/frontmatter/topbar/index.html" > Topbar< / a > < / h2 > < p > Configure the topbar< / p >
2024-10-24 22:11:12 +00:00
< h2 > < a href = "/hugo-theme-relearn/authoring/frontmatter/reference/index.html" > Reference< / a > < / h2 > < p > All front matter for the Relearn theme< / p >
2024-10-13 14:26:50 +00:00
< / div >
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/reference/index.html" > Reference< / a > < / li >
< / ul >
< / div >
< / footer >
< / article >
< section >
< h1 class = "a11y-only" > Subsections of Front Matter< / h1 >
< article class = "default" >
< header class = "headline" >
< / header >
< h1 id = "page-designs" > Page Designs< / h1 >
< p > A page is displayed by exactly one page design and represented by < a href = "https://gohugo.io/content-management/front-matter/#type" rel = "external" target = "_self" > Hugo’ s reserved < code > type< / code > front matter< / a > .< / p >
< p > The Relearn theme offers the page designs < code > home< / code > , < code > chapter< / code > , and < code > default< / code > but you can < a href = "/hugo-theme-relearn/configuration/customization/designs/index.html" > define further custom page designs< / a > .< / p >
< p > Regardless of shipped or custom page design, you are using them in the same way.< / p >
< ul >
< li >
< p > If you have an < a href = "https://gohugo.io/content-management/archetypes/" rel = "external" target = "_self" > archetype file< / a > , you can just do< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-shell" data-lang = "shell" > < span class = "line" > < span class = "cl" > hugo new --kind chapter chapter1/_index.md< / span > < / span > < / code > < / pre > < / div >
< / li >
< li >
< p > If you are creating your Markdown files manually, you can achieve the same by just setting < code > type='chapter'< / code > in the front matter.< / p >
< / li >
< / ul >
< p > Your resulting Markdown file needs to have at least the < code > type< / code > front matter set to the value of the page design< / p >
2024-10-25 06:34:40 +00:00
< div class = "tab-panel" data-tab-group = "07a7ff4280510dfbeaf39a779e92e37d" >
2024-10-13 14:26:50 +00:00
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="_indexmd"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
2024-10-25 06:34:40 +00:00
onclick="switchTab('07a7ff4280510dfbeaf39a779e92e37d','_indexmd')"
2024-10-13 14:26:50 +00:00
>
< span class = "tab-nav-text" > _index.md< / span >
< / button >
< / div >
< div class = "tab-content-container" >
< div
data-tab-item="_indexmd"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > title< / span > < span class = "p" > =< / span > < span class = "s2" > " Chapter 1" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > type< / span > < span class = "p" > =< / span > < span class = "s2" > " chapter" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< / div >
< / div > < h2 id = "predefined-designs" > Predefined Designs< / h2 >
< h3 id = "archetypes-home" > Home< / h3 >
< p > A < strong > Home< / strong > page is the starting page of your project. It’ s best to have only one page of this kind in your project.< / p >
< p > To create a home page, run the following command< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-shell" data-lang = "shell" > < span class = "line" > < span class = "cl" > hugo new --kind home _index.md< / span > < / span > < / code > < / pre > < / div >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-a0c05ee43194b887a720c14d6e16ecf7" class = "lightbox-link" > < img alt = "Home page" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "/hugo-theme-relearn/authoring/frontmatter/designs/pages-home.png?width=60pc" style = " height: auto; width: 60pc;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-a0c05ee43194b887a720c14d6e16ecf7" > < img alt = "Home page" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "/hugo-theme-relearn/authoring/frontmatter/designs/pages-home.png?width=60pc" > < / a > < / p >
2024-10-13 14:26:50 +00:00
< h3 id = "archetypes-chapter" > Chapter< / h3 >
< p > A < strong > Chapter< / strong > displays a page meant to be used as introduction for a set of child pages.< / p >
< p > Commonly, it contains a title front matter and a short description in the content.< / p >
< p > To create a chapter page, run the following command< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-shell" data-lang = "shell" > < span class = "line" > < span class = "cl" > hugo new --kind chapter chapter1/_index.md< / span > < / span > < / code > < / pre > < / div >
< p > If a numerical < code > weight< / code > front matter is set, it will be used to generate the subtitle of the chapter page. Set the number to a consecutive value starting at 1 for each new chapter on the same directory level.< / p >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-62960ec204826650a49c324e157c966e" class = "lightbox-link" > < img alt = "Chapter page" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "/hugo-theme-relearn/authoring/frontmatter/designs/pages-chapter.png?width=60pc" style = " height: auto; width: 60pc;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-62960ec204826650a49c324e157c966e" > < img alt = "Chapter page" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "/hugo-theme-relearn/authoring/frontmatter/designs/pages-chapter.png?width=60pc" > < / a > < / p >
2024-10-13 14:26:50 +00:00
< h3 id = "archetypes-default" > Default< / h3 >
< p > A < strong > Default< / strong > page is any other content page.< / p >
< p > To create a default page, run either one of the following commands< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-shell" data-lang = "shell" > < span class = "line" > < span class = "cl" > hugo new chapter1/page1/_index.md< / span > < / span > < / code > < / pre > < / div >
< p > or< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-shell" data-lang = "shell" > < span class = "line" > < span class = "cl" > hugo new chapter1/page1.md< / span > < / span > < / code > < / pre > < / div >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-3c1aca87e6b6cc3c9a785fa828566ceb" class = "lightbox-link" > < img alt = "Default page" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "/hugo-theme-relearn/authoring/frontmatter/designs/pages-default.png?width=60pc" style = " height: auto; width: 60pc;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-3c1aca87e6b6cc3c9a785fa828566ceb" > < img alt = "Default page" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "/hugo-theme-relearn/authoring/frontmatter/designs/pages-default.png?width=60pc" > < / a > < / p >
2023-11-28 22:52:52 +00:00
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/howto/index.html" > Howto< / a > < / li >
< / ul >
< / div >
< / footer >
< / article >
< article class = "default" >
< header class = "headline" >
< / header >
2024-04-07 19:58:38 +00:00
2024-10-24 14:30:52 +00:00
< h1 id = "menus" > Menus< / h1 >
2023-11-28 22:52:52 +00:00
2024-03-02 10:05:50 +00:00
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< / footer >
< / article >
< article class = "default" >
< header class = "headline" >
< / header >
2024-04-07 19:58:38 +00:00
2024-10-13 14:26:50 +00:00
< h1 id = "linking" > Linking< / h1 >
2022-07-05 22:16:52 +00:00
2024-10-13 14:26:50 +00:00
< h2 id = "opening-links" > Opening Links< / h2 >
< p > < span class = "badge cstyle cyan badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-gears" > < / i > < / span > < span class = "badge-content" > Option< / span > < / span > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > By default, external links open in a new tab. To change this, use the < code > externalLinkTarget< / code > setting with a proper < a href = "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#target" rel = "external" target = "_self" > link target< / a > .< / p >
< p > For example, this will open links in the same tab< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
2024-03-02 10:05:50 +00:00
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
2024-10-13 14:26:50 +00:00
data-tab-item="toml"
2024-03-02 10:05:50 +00:00
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
2024-10-13 14:26:50 +00:00
onclick="switchTab('config-code','toml')"
2024-03-02 10:05:50 +00:00
>
2024-10-13 14:26:50 +00:00
< 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 >
2024-03-02 10:05:50 +00:00
< / button >
< / div >
< div class = "tab-content-container" >
< div
2024-10-13 14:26:50 +00:00
data-tab-item="toml"
2024-03-02 10:05:50 +00:00
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "nx" > externalLinkTarget< / span > < span class = "p" > =< / span > < span class = "s1" > ' _self' < / 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" > externalLinkTarget< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > _self< / 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" > " externalLinkTarget" < / span > < span class = "p" > :< / span > < span class = "s2" > " _self" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< / div >
< h2 id = "enabling-link-and-image-link-warnings" > Enabling Link and Image Link Warnings< / h2 >
< p > < span class = "badge cstyle cyan badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-gears" > < / i > < / span > < span class = "badge-content" > Option< / span > < / span > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > You can use < code > link.errorlevel< / code > and < code > image.errorlevel< / code > to control what should happen if a local link can not be resolved to a resource.< / p >
< p > If not set or empty, any unresolved link is written as given into the resulting output. If set to < code > warning< / code > the same happens and an additional warning is printed in the built console. If set to < code > error< / code > an error message is printed and the build is aborted.< / p >
< p > Please note that this can not resolve files inside of your < code > static< / code > directory. The file must be a resource of the page or the site.< / p >
< p > Link warnings are also available for the < a href = "/hugo-theme-relearn/shortcodes/include/index.html#enabling-link-warnings" > include< / a > and < a href = "/hugo-theme-relearn/shortcodes/openapi/index.html#enabling-link-warnings" > openapi< / a > shortcodes.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
2024-03-02 10:05:50 +00:00
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
2024-10-13 14:26:50 +00:00
data-tab-item="toml"
2024-03-02 10:05:50 +00:00
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
2024-10-13 14:26:50 +00:00
onclick="switchTab('config-code','toml')"
2024-03-02 10:05:50 +00:00
>
2024-10-13 14:26:50 +00:00
< 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 >
2024-03-02 10:05:50 +00:00
< / button >
< / div >
< div class = "tab-content-container" >
< div
2024-10-13 14:26:50 +00:00
data-tab-item="toml"
2024-03-02 10:05:50 +00:00
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
2024-10-13 14:26:50 +00:00
< 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" > image< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' warning' < / span >
2022-04-02 13:30:16 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > link< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' warning' < / 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" > image< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > errorlevel< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > warning< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > link< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > errorlevel< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > warning< / 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" > " image" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " errorlevel" < / span > < span class = "p" > :< / span > < span class = "s2" > " warning" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " link" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " errorlevel" < / span > < span class = "p" > :< / span > < span class = "s2" > " warning" < / 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 >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< / div >
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/howto/index.html" > Howto< / a > < / li >
< / ul >
< / div >
< / footer >
< / article >
< article class = "default" >
< header class = "headline" >
< / header >
< h1 id = "topbar" > Topbar< / h1 >
< p > This page is about how to configure the topbar using configuration options. If you want to add further buttons or functionality, < a href = "/hugo-theme-relearn/configuration/customization/topbar/index.html" > see this section< / a > .< / p >
< p > Your topbar contains the following elements. Some of them are configuarable:< / p >
< ul >
< li > < span class = "btn cstyle transparent" > < span > < i class = "fa-fw fas fa-bars" > < / i > < / span > < / span > < strong > sidebar< / strong > : opens the sidebar flyout if in mobile layout< / li >
< li > < span class = "btn cstyle transparent" > < span > < i class = "fa-fw fas fa-list-alt" > < / i > < / span > < / span > < strong > toc< / strong > : < a href = "/hugo-theme-relearn/authoring/frontmatter/topbar/index.html#table-of-contents" > opens the table of contents in an overlay< / a > < / li >
< li > < span class = "btn cstyle transparent" > < span > < i class = "fa-fw fas fa-empty" > < / i > < / span > < / span > < strong > breadcrumb< / strong > : shows the clickable < a href = "/hugo-theme-relearn/authoring/frontmatter/topbar/index.html#breadcrumbs" > breadcrumbs< / a > < / li >
< li > < span class = "btn cstyle transparent" > < span > < i class = "fa-fw fas fa-pen" > < / i > < / span > < / span > < strong > edit< / strong > : browses to the editable page if the < code > editURL< / code > < a href = "/hugo-theme-relearn/authoring/frontmatter/topbar/index.html#edit-button" > parameter is set< / a > < / li >
< li > < span class = "btn cstyle transparent" > < span > < i class = "fa-fw fas fa-print" > < / i > < / span > < / span > < strong > print< / strong > : browses to the chapters printable page if < a href = "/hugo-theme-relearn/configuration/sitemanagement/outputformats/index.html#print-support" > print support< / a > was activated< / li >
< li > < span class = "btn cstyle transparent" > < span > < i class = "fa-fw fas fa-chevron-left" > < / i > < / span > < / span > < strong > prev< / strong > : browses to the < a href = "/hugo-theme-relearn/authoring/frontmatter/topbar/index.html#arrow-navigation" > previous page< / a > if there is one< / li >
< li > < span class = "btn cstyle transparent" > < span > < i class = "fa-fw fas fa-chevron-right" > < / i > < / span > < / span > < strong > next< / strong > : browses to the < a href = "/hugo-theme-relearn/authoring/frontmatter/topbar/index.html#arrow-navigation" > next page< / a > if there is one< / li >
< li > < span class = "btn cstyle transparent" > < span > < i class = "fa-fw fas fa-ellipsis-v" > < / i > < / span > < / span > < strong > more< / strong > : opens the overlay if screen space is limited< / li >
< / ul >
< h2 id = "table-of-contents" > Table of Contents< / h2 >
< p > < span class = "badge cstyle cyan badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-gears" > < / i > < / span > < span class = "badge-content" > Option< / span > < / span > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > Set < code > disableToc=true< / code > to hide the TOC button on all pages. If the button is hidden, also the keyboard shortcut is disabled. This can be overridden in a page’ s front matter.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
2024-03-02 10:05:50 +00:00
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
2024-10-13 14:26:50 +00:00
data-tab-item="toml"
2024-03-02 10:05:50 +00:00
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
2024-10-13 14:26:50 +00:00
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')"
2024-03-02 10:05:50 +00:00
>
2024-10-13 14:26:50 +00:00
< span class = "tab-nav-text" > json< / span >
2024-03-02 10:05:50 +00:00
< / button >
< / div >
< div class = "tab-content-container" >
< div
2024-10-13 14:26:50 +00:00
data-tab-item="toml"
2024-03-02 10:05:50 +00:00
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "nx" > disableToc< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nt" > disableToc< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " disableToc" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< / div >
< h2 id = "breadcrumbs" > Breadcrumbs< / h2 >
< p > < span class = "badge cstyle cyan badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-gears" > < / i > < / span > < span class = "badge-content" > Option< / span > < / span > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > Set < code > disableBreadcrumb=true< / code > to hide the breadcrumb in the topbar.< / p >
< p > Further breadcrumbs settings can be found in the < a href = "/hugo-theme-relearn/configuration/content/titles/index.html" > content configuration section< / a > .< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
2024-03-02 10:05:50 +00:00
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
2024-10-13 14:26:50 +00:00
data-tab-item="toml"
2024-03-02 10:05:50 +00:00
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
2024-10-13 14:26:50 +00:00
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')"
2024-03-02 10:05:50 +00:00
>
2024-10-13 14:26:50 +00:00
< span class = "tab-nav-text" > json< / span >
2024-03-02 10:05:50 +00:00
< / button >
< / div >
< div class = "tab-content-container" >
< div
2024-10-13 14:26:50 +00:00
data-tab-item="toml"
2024-03-02 10:05:50 +00:00
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "nx" > disableBreadcrumb< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nt" > disableBreadcrumb< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " disableBreadcrumb" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2023-05-19 18:46:07 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "edit-button" > Edit Button< / h2 >
< p > < span class = "badge cstyle cyan badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-gears" > < / i > < / span > < span class = "badge-content" > Option< / span > < / span > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > If < code > editURL< / code > is set to a URL, an edit button will be shown in the topbar. If the button is hidden, also the keyboard shortcut is disabled.< / p >
< p > The value can contain the macro < code > ${FilePath}< / code > which will be replaced by the file path of your displayed page. If no < code > ${FilePath}< / code > is given in the value, the value is treated as if the < code > ${FilePath}< / code > was appended at the end of the value. This can be overridden in the pages front matter.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "nx" > editURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}' < / 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" > editURL< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}< / span > < / span > < / 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" > " editURL" < / span > < span class = "p" > :< / span > < span class = "s2" > " https://github.com/McShelby/hugo-theme-relearn/edit/main/exampleSite/content/${FilePath}" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2022-04-02 13:30:16 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "arrow-navigation" > Arrow Navigation< / h2 >
< p > < span class = "badge cstyle cyan badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-gears" > < / i > < / span > < span class = "badge-content" > Option< / span > < / span > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > You can hide the previous/next buttons by setting < code > disableNextPrev=true< / code > . If the buttons are hidden, also the keyboard shortcuts are disabled.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "nx" > disableNextPrev< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nt" > disableNextPrev< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " disableNextPrev" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/howto/index.html" > Howto< / a > < / li >
< / ul >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< / footer >
< / article >
< article class = "default" >
< header class = "headline" >
< / header >
< h1 id = "front-matter-reference" > Front Matter Reference< / h1 >
< p > Every Hugo page must have front matter.< / p >
< p > In addition to < a href = "https://gohugo.io/content-management/front-matter/#fields" rel = "external" target = "_self" > Hugo’ s standard front matter< / a > , the Relearn theme offers extras settings listed here.< / p >
< p > Throughout the documentation, theme-specific front matter is marked with a < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > badge.< / p >
< p > Add theme front matter directly to the root of your page’ s front matter. For example:< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > math< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > math< / 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 = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " math" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "index" > Index< / h2 >
< h3 id = "a" > A< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/alwaysopen/index.html" > Alwaysopen< / a > (1)< / li >
< / ul >
< h3 id = "c" > C< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/collapsiblemenu/index.html" > CollapsibleMenu< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/custommathjaxurl/index.html" > CustomMathJaxURL< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/custommermaidurl/index.html" > CustomMermaidURL< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/customopenapiurl/index.html" > CustomOpenapiURL< / a > (1)< / li >
< / ul >
< h3 id = "d" > D< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/description/index.html" > Description< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/disablebreadcrumb/index.html" > DisableBreadcrumb< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/disablenextprev/index.html" > DisableNextPrev< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/disabletoc/index.html" > DisableToc< / a > (1)< / li >
< / ul >
< h3 id = "e" > E< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/editurl/index.html" > EditURL< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/externallinktarget/index.html" > ExternalLinkTarget< / a > (1)< / li >
< / ul >
< h3 id = "h" > H< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/headingpost/index.html" > HeadingPost< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/headingpre/index.html" > HeadingPre< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/hidden/index.html" > Hidden< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/highlightwrap/index.html" > HighlightWrap< / a > (1)< / li >
< / ul >
< h3 id = "i" > I< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/image.errorlevel/index.html" > Image.errorlevel< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/imageeffects/index.html" > ImageEffects< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/include.errorlevel/index.html" > Include.errorlevel< / a > (1)< / li >
< / ul >
< h3 id = "l" > L< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/lastmodifierdisplayname/index.html" > LastModifierDisplayName< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/lastmodifieremail/index.html" > LastModifierEmail< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/link.errorlevel/index.html" > Link.errorlevel< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/linktitle/index.html" > LinkTitle< / a > (1)< / li >
< / ul >
< h3 id = "m" > M< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/math/index.html" > Math< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/math.force/index.html" > Math.force< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/mathjaxinitialize/index.html" > MathJaxInitialize< / a > (1)< / li >
2024-10-24 21:35:50 +00:00
< li > < a href = "/hugo-theme-relearn/frontmatter/menupageref/index.html" > MenuPageRef< / a > (1)< / li >
2024-10-13 14:26:50 +00:00
< li > < a href = "/hugo-theme-relearn/frontmatter/menupost/index.html" > MenuPost< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/menupre/index.html" > MenuPre< / a > (1)< / li >
2024-10-24 21:35:50 +00:00
< li > < a href = "/hugo-theme-relearn/frontmatter/menuurl/index.html" > MenuUrl< / a > (1)< / li >
2024-10-13 14:26:50 +00:00
< li > < a href = "/hugo-theme-relearn/frontmatter/mermaid.force/index.html" > Mermaid.force< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/mermaidinitialize/index.html" > MermaidInitialize< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/mermaidzoom/index.html" > MermaidZoom< / a > (1)< / li >
< / ul >
< h3 id = "o" > O< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/openapi.errorlevel/index.html" > Openapi.errorlevel< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/openapi.force/index.html" > Openapi.force< / a > (1)< / li >
< li > < a href = "/hugo-theme-relearn/frontmatter/ordersectionsby/index.html" > Ordersectionsby< / a > (2)< / li >
< / ul >
2024-10-24 14:30:52 +00:00
< h3 id = "s" > S< / h3 >
< ul class = "columnize" >
< li > < a href = "/hugo-theme-relearn/frontmatter/sidebarmenus/index.html" > Sidebarmenus< / a > (1)< / li >
< / ul >
2024-10-13 14:26:50 +00:00
< h2 id = "all-front-matter" > All Front Matter< / h2 >
< p > Here’ s a list of all available front matter with example values. Default values are described in the < a href = "/hugo-theme-relearn/authoring/frontmatter/reference/index.html#annotated-front-matter" > annotated example< / a > below or in each front matter’ s documentation.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > LastModifierDisplayName< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > LastModifierEmail< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > alwaysopen< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > collapsibleMenu< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > customMathJaxURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > customMermaidURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > customOpenapiURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > description< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > disableBreadcrumb< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > disableNextPrev< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > disableToc< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > editURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > externalLinkTarget< / span > < span class = "p" > =< / span > < span class = "s1" > ' _self' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > headingPost< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > headingPre< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > hidden< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > highlightWrap< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > images< / span > < span class = "p" > =< / span > < span class = "p" > [< / span > < span class = "s1" > ' images/hero.png' < / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > linkTitle< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > math< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > mathJaxInitialize< / span > < span class = "p" > =< / span > < span class = "s1" > ' {}' < / span >
2024-10-24 22:24:55 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > menuPageRef< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > menuPost< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > menuPre< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
2024-10-24 22:24:55 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > menuUrl< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > mermaidInitialize< / span > < span class = "p" > =< / span > < span class = "s1" > ' { " securityLevel" : " loose" }' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > mermaidZoom< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > ordersectionsby< / span > < span class = "p" > =< / span > < span class = "s1" > ' weight' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > title< / span > < span class = "p" > =< / span > < span class = "s1" > ' Example Page' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > type< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > image< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > imageEffects< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > border< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > lazy< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > lightbox< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > shadow< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > include< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > link< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > mermaid< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > force< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > openapi< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > oppenapi< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > force< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
2024-10-24 14:30:52 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [[< / span > < span class = "nx" > sidebarmenus< / span > < span class = "p" > ]]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > disableTitle< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > identifier< / span > < span class = "p" > =< / span > < span class = "s1" > ' home' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > main< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > pageRef< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > type< / span > < span class = "p" > =< / span > < span class = "s1" > ' page' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [[< / span > < span class = "nx" > sidebarmenus< / span > < span class = "p" > ]]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > disableTitle< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > identifier< / span > < span class = "p" > =< / span > < span class = "s1" > ' shortcuts' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > main< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > type< / span > < span class = "p" > =< / span > < span class = "s1" > ' menu' < / span >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > LastModifierDisplayName< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > LastModifierEmail< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > alwaysopen< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > collapsibleMenu< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > customMathJaxURL< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > customMermaidURL< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > customOpenapiURL< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > description< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > disableBreadcrumb< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > disableNextPrev< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > disableToc< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > editURL< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > externalLinkTarget< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > _self< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > headingPost< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > headingPre< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > hidden< / 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" > highlightWrap< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > image< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > errorlevel< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > imageEffects< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > border< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > lazy< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > lightbox< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > shadow< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > images< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > - < span class = "l" > images/hero.png< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > include< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > errorlevel< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > link< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > errorlevel< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > linkTitle< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > math< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > mathJaxInitialize< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s1" > ' {}' < / span > < span class = "w" >
2024-10-24 22:24:55 +00:00
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > menuPageRef< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > menuPost< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > menuPre< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
2024-10-24 22:24:55 +00:00
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > menuUrl< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > mermaid< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > force< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > mermaidInitialize< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s1" > ' { " securityLevel" : " loose" }' < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > mermaidZoom< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > openapi< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > errorlevel< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > oppenapi< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > force< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > ordersectionsby< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > weight< / span > < span class = "w" >
2024-10-24 14:30:52 +00:00
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > sidebarmenus< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > - < span class = "nt" > disableTitle< / 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" > identifier< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > home< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > main< / 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" > pageRef< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > type< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > page< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > - < span class = "nt" > disableTitle< / 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" > identifier< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > shortcuts< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > main< / 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" > type< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > menu< / span > < span class = "w" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > title< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > Example Page< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > type< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s2" > " " < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " LastModifierDisplayName" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " LastModifierEmail" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " alwaysopen" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " collapsibleMenu" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " customMathJaxURL" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " customMermaidURL" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " customOpenapiURL" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " description" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " disableBreadcrumb" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " disableNextPrev" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " disableToc" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " editURL" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " externalLinkTarget" < / span > < span class = "p" > :< / span > < span class = "s2" > " _self" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " headingPost" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " headingPre" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " hidden" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " highlightWrap" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " image" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " errorlevel" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " imageEffects" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " border" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " lazy" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " lightbox" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " shadow" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " images" < / span > < span class = "p" > :< / span > < span class = "p" > [< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "s2" > " images/hero.png" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > ],< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " include" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " errorlevel" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " link" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " errorlevel" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " linkTitle" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " math" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " mathJaxInitialize" < / span > < span class = "p" > :< / span > < span class = "s2" > " {}" < / span > < span class = "p" > ,< / span >
2024-10-24 22:24:55 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " menuPageRef" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " menuPost" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " menuPre" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
2024-10-24 22:24:55 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " menuUrl" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " mermaid" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " force" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " mermaidInitialize" < / span > < span class = "p" > :< / span > < span class = "s2" > " { \" securityLevel\" : \" loose\" }" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " mermaidZoom" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " openapi" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " errorlevel" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " oppenapi" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " force" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " ordersectionsby" < / span > < span class = "p" > :< / span > < span class = "s2" > " weight" < / span > < span class = "p" > ,< / span >
2024-10-24 14:30:52 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " sidebarmenus" < / span > < span class = "p" > :< / span > < span class = "p" > [< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " disableTitle" < / 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" > " identifier" < / span > < span class = "p" > :< / span > < span class = "s2" > " home" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " main" < / 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" > " pageRef" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " type" < / span > < span class = "p" > :< / span > < span class = "s2" > " page" < / 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" > " disableTitle" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " identifier" < / span > < span class = "p" > :< / span > < span class = "s2" > " shortcuts" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " main" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " type" < / span > < span class = "p" > :< / span > < span class = "s2" > " menu" < / 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 >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " title" < / span > < span class = "p" > :< / span > < span class = "s2" > " Example Page" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " type" < / span > < span class = "p" > :< / span > < span class = "s2" > " " < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-08-13 11:44:38 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "annotated-front-matter" > Annotated Front Matter< / h2 >
2024-10-25 06:34:40 +00:00
< div class = "tab-panel" data-tab-group = "5849ffb89e5cfca666d605bdc6dcda57" >
2024-10-13 14:26:50 +00:00
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
2024-10-25 06:34:40 +00:00
onclick="switchTab('5849ffb89e5cfca666d605bdc6dcda57','toml')"
2024-10-13 14:26:50 +00:00
>
< span class = "tab-nav-text" > toml< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If an option value is said to be not set, you can achieve the same behavior< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # by giving it an empty string value.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > ###############################################################################< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Hugo< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options usually apply to other themes as well.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The social media image of your page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # This is used for generating social media meta information for the opengraph< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # protocol and twitter cards.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > images< / span > < span class = "p" > =< / span > < span class = "p" > [< / span > < span class = "s1" > ' images/hero.png' < / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The title of your page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # A page without a title is treated as a hidden page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > title< / span > < span class = "p" > =< / span > < span class = "s1" > ' Example Page' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The description of your page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # This is used for generating HTML meta tags, social media meta information< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # for the opengraph protocol and twitter cards.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used for the html< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # meta tag, social media meta information for the opengraph protocol and< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # twitter cards.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > description< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The page design to be used< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # This decides the layout of your page. The theme ships ' home' , ' chapter' and< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # ' default' . If not set, ' default' is taken.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > type< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > ###############################################################################< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Relearn Theme< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options are specific to the Relearn theme.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Topbar< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options modify the topbar appearance.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Hide the table of contents button.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If the TOC button is hidden, also the keyboard shortcut is disabled.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > disableToc< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Hide the breadcrumbs.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If the breadcrumbs are hidden, the title of the displayed page will still be< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # shown in the topbar.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > disableBreadcrumb< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Hide Next and Previous navigation buttons.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If the navigation buttons are hidden, also the keyboard shortcuts are< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # disabled.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > disableNextPrev< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The URL prefix to edit a page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If set, an edit button will be shown in the topbar. If the button is hidden,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # also the keyboard shortcuts are disabled. The value can contain the macro< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # `${FilePath}` which will be replaced by the file path of your displayed page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used. If the global< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # parameter is given but you want to hide the button for the displayed page,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # you can set the value to an empty string. If instead of hiding you want to have< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # an disabled button, you can set the value to a string containing just spaces.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # This is useful if you want to give the opportunity for people to create merge< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # request for your content.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > editURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Menu< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options modify the menu appearance.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Menu specific title< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The title displayed in the menu. If not set the `title` front matter will< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # be used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > linkTitle< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Prefix for the title in navigation menu.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The title of the page in the menu will be prefixed by this HTML content.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > menuPre< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Suffix for the title in navigation menu.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The title of the page in the menu will be suffixed by this HTML content.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > menuPost< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-24 22:24:55 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Link the menu entry to a different internal page instead.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # This will effectivly hide the page and its content from the viewer by< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # linking to the given URL instead.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > menuPageRef< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Link the menu entry to an external URL instead of a page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # This will effectivly hide the page and its content from the viewer by< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # linking to the given URL instead.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > menuUrl< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The order of navigation menu submenus.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: ' weight' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Submenus can be ordered by ' weight' , ' title' , ' linktitle' , ' modifieddate' ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # ' expirydate' , ' publishdate' , ' date' , ' length' or ' default' (adhering to< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Hugo' s default sort order).< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the value of the parent menu entry is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > ordersectionsby< / span > < span class = "p" > =< / span > < span class = "s1" > ' weight' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The initial expand state of submenus.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # This controls whether submenus will be expanded (true), or collapsed (false)< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # in the menu. If not set, the first menu level is set to false, all others< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # levels are set to true. If not set, the value of the parent menu entry is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If the displayed page has submenus, they will always been displayed expanded< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # regardless of this option.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > alwaysopen< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Shows expander for submenus.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If set to true, a submenu in the sidebar will be displayed in a collapsible< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # tree view and a clickable expander is set in front of the entry.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > collapsibleMenu< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-24 14:30:52 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Define your own sidebar menus.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: the value used below< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The sidebar menus are built from this parameter. If not set, the set value< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # of your site' s hugo.toml is used and contains the below default.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Menus are written from the sidebar' s top to buttom in the order given in< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # this array.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Each entry can contain the following keys:< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # - `type` is mandatory. Either `page` in case it should generate a tre from< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # the page structure or `menu` in case it should generate a tree from a< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # defined menu.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # - `identifier` is mandatory. In case of `type=page`, anything can be used,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # in case of `type=menu` the `identifier` key must be identical to the< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # key of the menu definition.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # - `main`, boolean. If `true`, the first tree level is spaced more generous< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # and the text is emphasized. Default: `true` for `type=page` and `false`< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # for `type=menu`< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # - `disableTitle`, boolean. If `true`, there is no title above the tree.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: `true` for `type=page` and `false` for `type=menu`. If a title< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # should be used, in case of `type=page` it will be taken from the page' s< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # `menuTitle` front matter and if not set, from the translation files, using< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # the menu `identifier` as key. In case of `type=menu` it will be taken< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # from the menu `title` according to Hugo' s documentation and if not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # from the menu `name` and if this is not set form the page' s `linkTitle`.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # - `pageRef`, optional. In case of `type=page` this is the starting page' s< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # path. If not set, the home page will be used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > sidebarmenus< / span > < span class = "p" > =< / span > < span class = "p" > [< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span > < span class = "nx" > type< / span > < span class = "p" > =< / span > < span class = "s1" > ' page' < / span > < span class = "p" > ,< / span > < span class = "nx" > identifier< / span > < span class = "p" > =< / span > < span class = "s1" > ' home' < / span > < span class = "p" > ,< / span > < span class = "nx" > main< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span > < span class = "nx" > disableTitle< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span > < span class = "nx" > pageRef< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span > < span class = "nx" > type< / span > < span class = "p" > =< / span > < span class = "s1" > ' menu' < / span > < span class = "p" > ,< / span > < span class = "nx" > identifier< / span > < span class = "p" > =< / span > < span class = "s1" > ' shortcuts' < / span > < span class = "p" > ,< / span > < span class = "nx" > main< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span > < span class = "nx" > disableTitle< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Hidden pages< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options configure how hidden pages are treated.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # A page flagged as hidden, is only removed from the navigation menu if you are< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # currently not on this page or the hidden page is not part of current page' s< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # ancestors. For all other functionality in Hugo a hidden page behaves like any< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # other page if not otherwise configured.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Hide a page' s menu entry.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If this value is true, the page is hidden from the menu.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > hidden< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Content< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options modify how your content is displayed.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Prefix for the title in the content area.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The title of the page heading will be prefixed by this HTML content.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > headingPre< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Suffix for the title in the content area.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # The title of the page heading will be suffixed by this HTML content.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > headingPost< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Display name of the page' s last editor.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If set, it will be displayed in the default footer.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > LastModifierDisplayName< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Email address of the page' s last editor.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If set together with LastModifierDisplayName, it will be displayed in the< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # default footer.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > LastModifierEmail< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Highlight< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options configure how code is displayed.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Wrap for code blocks.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # By default lines of code blocks wrap around if the line is too long to be< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # displayed on screen. If you dislike this behavior, you can reconfigure it< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # here.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Note that lines always wrap in print mode regardless of this option.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used or given as a< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # parameter to individual code blocks.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > highlightWrap< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Include< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options configure how the include shortcode works.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # What to do when path is not resolved.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # You can control what should happen if a path can not be resolved to as< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # a resource or via the file system. If not set, no output will be written< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # for the unresolved path. If set to `warning` the same happens and an additional< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # warning is printed. If set to `error` an error message is printed and the build< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # is aborted.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > include< / span > < span class = "p" > .< / span > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Images< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options configure how images are displayed.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # What to do when local image link is not resolved.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # You can control what should happen if a local image can not be resolved to as< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # a resource. If not set, the unresolved link is written as given into the resulting< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # output. If set to `warning` the same happens and an additional warning is< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # printed. If set to `error` an error message is printed and the build is< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # aborted.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Please note that this can not resolve files inside of your `static` directory.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > image< / span > < span class = "p" > .< / span > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Image effects.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # See the documentation for how you can even add your own arbitrary effects to< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # the list.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # All effect values default to the values of your site' s hugo.toml and can be< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # overridden through URL parameter given to the image. See the documentation for< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # details.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > imageEffects< / span > < span class = "p" > .< / span > < span class = "nx" > border< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > imageEffects< / span > < span class = "p" > .< / span > < span class = "nx" > lazy< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > imageEffects< / span > < span class = "p" > .< / span > < span class = "nx" > lightbox< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > imageEffects< / span > < span class = "p" > .< / span > < span class = "nx" > shadow< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Links< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options configure how links are displayed.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # What to do when local page link is not resolved.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # You can control what should happen if a local link can not be resolved to a< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # page. If not set, the unresolved link is written as given into the resulting< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # output. If set to `warning` the same happens and an additional warning is< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # printed. If set to `error` an error message is printed and the build is< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # aborted.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Please note that with Hugo < 0.123.0 + `uglyURLs=true` this can lead to false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # negatives.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > link< / span > < span class = "p" > .< / span > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # How to open external links.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: ' _blank' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # For external links you can define how they are opened in your browser. All< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # values for the HTML `target` attribute of the `a` element are allowed. The< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # default value opens external links in a separate browser tab. If you want< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # to open those links in the same tab, use ' _self' .< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > externalLinkTarget< / span > < span class = "p" > =< / span > < span class = "s1" > ' _self' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # MathJax< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options configure how math formulae are displayed.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Initialization options for MathJax.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # A JSON value. See the MathJaxdocumentation for possible parameter.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > mathJaxInitialize< / span > < span class = "p" > =< / span > < span class = "s1" > ' {}' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Force load Math on every page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If a, Math shortcode or codefence is found, the option will be ignored and< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Math will be loaded regardlessly. This option is useful in case you< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # are using passthrough configuration to render your math. In this case no shortcode or< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # codefence is involved and the library is not loaded by default so you can< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # force loading it by setting `math=true`.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # This option has an alias `math.force`.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > math< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # URL for external MathJax library.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Specifies the remote location of the MathJax library. By default the shipped< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # version will be used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > customMathJaxURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span > < span class = "c" > # ' https://unpkg.com/mathjax/es5/tex-mml-chtml.js' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Mermaid< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options configure how Mermaid graphs are displayed.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Make graphs panable and zoomable< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # For huge graphs it can be helpful to make them zoomable. Zoomable graphs come< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # with a reset button for the zoom.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used or given as a< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # parameter to individual graphs.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > mermaidZoom< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Initialization options for Mermaid.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # A JSON value. See the Mermaid documentation for possible parameter.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > mermaidInitialize< / span > < span class = "p" > =< / span > < span class = "s1" > ' { " securityLevel" : " loose" }' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Force load Mermaid on every page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If a Mermaid shortcode or codefence is found, the option will be ignored and< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Mermaid will be loaded regardlessly. This option is useful in case you< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # are using scripting to render your graph. In this case no shortcode or< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # codefence is involved and the library is not loaded by default so you can< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # force loading it by setting `mermaid.force=true`.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > mermaid< / span > < span class = "p" > .< / span > < span class = "nx" > force< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # URL for external Mermaid library.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Specifies the remote location of the Mermaid library. By default the shipped< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # version will be used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > customMermaidURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span > < span class = "c" > # ' https://unpkg.com/mermaid/dist/mermaid.min.js' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > #++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # OpenApi< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # These options configure how OpenAPI specifications are displayed.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Load OpenAPI on every page.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If a, OpenAPI shortcode or codefence is found, the option will be ignored and< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # OpenAPI will be loaded regardlessly. This option is useful in case you< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # are using scripting to render your spec. In this case no shortcode or< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # codefence is involved and the library is not loaded by default so you can< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # force loading it by setting `openapi.force=true`.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > oppenapi< / span > < span class = "p" > .< / span > < span class = "nx" > force< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # URL for external OpenAPI library.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: not set< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Specifies the remote location of the OpenAPI library. By default the shipped< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # version will be used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > customOpenapiURL< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span > < span class = "c" > # ' https://unpkg.com/swagger-ui-dist/swagger-ui-bundle.js' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # What to do when a local OpenAPI spec link is not resolved.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Default: ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # You can control what should happen if a local OpenAPI spec link can not be resolved< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # to a resource. If not set, the unresolved link is written as given into the resulting< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # output. If set to `warning` the same happens and an additional warning is< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # printed. If set to `error` an error message is printed and the build is< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # aborted.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # Please note that this can not resolve files inside of your `static` directory.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "c" > # If not set, the set value of your site' s hugo.toml is used.< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > openapi< / span > < span class = "p" > .< / span > < span class = "nx" > errorlevel< / span > < span class = "p" > =< / span > < span class = "s1" > ' ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-09-03 17:09:09 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/reference/index.html" > Reference< / a > < / li >
< / ul >
2024-09-03 17:09:09 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< / footer >
< / article >
< / section >
< article class = "default" >
< header class = "headline" >
< / header >
< h1 id = "meta-information" > Meta Information< / h1 >
< h2 id = "page-title" > Page Title< / h2 >
< p > The < code > title< / code > will be used in the heading and meta information of your HTML.< / p >
< p > A page without a title is < a href = "/hugo-theme-relearn/authoring/meta/index.html#hidden" > treated as if < code > hidden=true< / code > < / a > has been set.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > title< / span > < span class = "p" > =< / span > < span class = "s1" > ' Example Title' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > title< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > Example Title< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " title" < / span > < span class = "p" > :< / span > < span class = "s2" > " Example Title" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "page-description" > Page Description< / h2 >
< p > The < code > description< / code > is used for generating HTML meta information, in the < a href = "/hugo-theme-relearn/shortcodes/children/index.html" > children< / a > shortcode and in social media meta information.< / p >
< p > If not set, the set value of your site’ s hugo.toml is used for the HTML meta information and social media meta information. It appears empty for the < a href = "/hugo-theme-relearn/shortcodes/children/index.html" > children< / a > shortcode.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > description< / span > < span class = "p" > =< / span > < span class = "s1" > ' Some lenghty example description' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > description< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > Some lenghty example description< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " description" < / span > < span class = "p" > :< / span > < span class = "s2" > " Some lenghty example description" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "social-media-images" > Social Media Images< / h2 >
< p > The theme adds social media meta tags including feature images for the < a href = "https://gohugo.io/templates/internal/#open-graph" rel = "external" target = "_self" > Open Graph< / a > protocol and < a href = "https://gohugo.io/templates/internal/#twitter-cards" rel = "external" target = "_self" > Twitter Cards< / a > to your site. These are configured as mentioned in the linked Hugo docs.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > images< / span > < span class = "p" > =< / span > < span class = "p" > [< / span > < span class = "s1" > ' images/hero.png' < / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > images< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > - < span class = "l" > images/hero.png< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " images" < / span > < span class = "p" > :< / span > < span class = "p" > [< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "s2" > " images/hero.png" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "hidden" > Hidden< / h2 >
< p > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > You can hide your pages from the menu by setting < code > hidden=true< / code > .< / p >
2024-10-24 14:30:52 +00:00
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-bars" > < / i > < / span > < span class = "badge-content" style = "background-color: blueviolet;" > Menu< / span > < / span > For < a href = "https://gohugo.io/content-management/menus/" rel = "external" target = "_self" > Hugo menus< / a > , you have to set < code > params.hidden=true< / code > instead.< / p >
2024-10-13 14:26:50 +00:00
< p > < a href = "/hugo-theme-relearn/configuration/content/hidden/index.html" > See how you can further configure visibility< / a > throughout your site.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > hidden< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > hidden< / 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 = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " hidden" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-05-28 17:52:29 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "add-icon-to-the-title-heading" > Add Icon to the Title Heading< / h2 >
< p > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > In the page front matter, add a < code > headingPre< / code > to insert any HTML code before the title heading. You can also set < code > headingPost< / code > to insert HTML code after the title heading.< / p >
< p > You also may want to < a href = "/hugo-theme-relearn/configuration/customization/dependencies/index.html#adding-javascript-or-stylesheets-to-all-pages" > apply further CSS< / a > in this case.< / p >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > headingPre< / span > < span class = "p" > =< / span > < span class = "s1" > ' < i class=" fab fa-github" > < /i> ' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > headingPre< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "s1" > ' < i class=" fab fa-github" > < /i> ' < / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " headingPre" < / span > < span class = "p" > :< / span > < span class = "s2" > " \u003ci class=\" fab fa-github\" \u003e\u003c/i\u003e " < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-04-04 21:31:21 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "footer-information" > Footer Information< / h2 >
< p > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > If you use the default < code > layouts/partials/content-footer.html< / code > is not overridden by you, it will display authoring information, namely< / p >
< ul >
< li > < code > AuthorName< / code > if < a href = "https://gohugo.io/methods/page/gitinfo/" rel = "external" target = "_self" > GitInfo< / a > is active, otherwise < code > LastModifierDisplayName< / code > front matter< / li >
< li > < code > AuthorEmail< / code > if < a href = "https://gohugo.io/methods/page/gitinfo/" rel = "external" target = "_self" > GitInfo< / a > is active, otherwise < code > LastModifierEmail< / code > front matter< / li >
< li > < code > AuthorDate< / code > if < a href = "https://gohugo.io/methods/page/gitinfo/" rel = "external" target = "_self" > GitInfo< / a > is active, otherwise < a href = "https://gohugo.io/methods/page/date/" rel = "external" target = "_self" > Hugo’ s < code > date< / code > front matter< / a > < / li >
< / ul >
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
data-tab-item="toml"
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
onclick="switchTab('config-code','toml')"
>
< span class = "tab-nav-text" > toml< / span >
< / button >
< button
data-tab-item="yaml"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','yaml')"
>
< span class = "tab-nav-text" > yaml< / span >
< / button >
< button
data-tab-item="json"
class="tab-nav-button tab-panel-style cstyle initial"
onclick="switchTab('config-code','json')"
>
< span class = "tab-nav-text" > json< / span >
< / button >
2024-09-01 11:58:33 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "tab-content-container" >
< div
data-tab-item="toml"
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > LastModifierDisplayName< / span > < span class = "p" > =< / span > < span class = "s1" > ' Santa Claus' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > LastModifierEmail< / span > < span class = "p" > =< / span > < span class = "s1" > ' santa@example.com' < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > date< / span > < span class = "p" > =< / span > < span class = "ld" > 2000-12-24T00:00:00-12:00< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > LastModifierDisplayName< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > Santa Claus< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > LastModifierEmail< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "l" > santa@example.com< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > date< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "ld" > 2000-12-24T00:00:00< / span > < span class = "m" > -12< / span > < span class = "p" > :< / span > < span class = "m" > 00< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-json" data-lang = "json" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " LastModifierDisplayName" < / span > < span class = "p" > :< / span > < span class = "s2" > " Santa Claus" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " LastModifierEmail" < / span > < span class = "p" > :< / span > < span class = "s2" > " santa@example.com" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " date" < / span > < span class = "p" > :< / span > < span class = "s2" > " 2000-12-24T00:00:00-12:00" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
< / div >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/howto/index.html" > Howto< / a > < / li >
< / ul >
2024-04-04 21:31:21 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< / footer >
< / article >
< article class = "default" >
< header class = "headline" >
< / header >
< h1 id = "markdown-syntax" > Markdown Syntax< / h1 >
< p > Let’ s face it: Writing content for the web is tiresome. WYSIWYG editors help alleviate this task, but they generally result in horrible code, or worse yet, ugly web pages.< / p >
< p > < strong > Markdown< / strong > is a better way to write < strong > HTML< / strong > , without all the complexities and ugliness that usually accompanies it.< / p >
< p > Some of the key benefits are:< / p >
< ol >
< li > Markdown is simple to learn, with minimal extra characters so it’ s also quicker to write content.< / li >
< li > Less chance of errors when writing in Markdown.< / li >
< li > Produces valid HTML output.< / li >
< li > Keeps the content and the visual display separate, so you cannot mess up the look of your site.< / li >
< li > Write in any text editor or Markdown application you like.< / li >
< li > Markdown is a joy to use!< / li >
< / ol >
< p > John Gruber, the author of Markdown, puts it like this:< / p >
< blockquote >
< p > The overriding design goal for Markdown’ s formatting syntax is to make it as readable as possible. The idea is that a Markdown-formatted document should be publishable as-is, as plain text, without looking like it’ s been marked up with tags or formatting instructions. While Markdown’ s syntax has been influenced by several existing text-to-HTML filters, the single biggest source of inspiration for Markdown’ s syntax is the format of plain text email.
< cite > John Gruber< / cite > < / p >
< / blockquote >
< div class = "box notices cstyle tip" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-lightbulb" > < / i > Tip
2024-09-01 11:58:33 +00:00
< / div >
2024-04-04 21:31:21 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > < i class = "fa-fw fas fa-bookmark" > < / i > Bookmark this page for easy future reference!< / p >
2024-09-05 18:03:19 +00:00
< / div >
2024-04-04 21:31:21 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "standard-and-extensions" > Standard and Extensions< / h2 >
< p > If not otherwise noted, the shown examples adhere to the < a href = "https://commonmark.org/help/" rel = "external" target = "_self" > CommonMark< / a > standard. In addition the theme supports the following extensions that < a href = "https://gohugo.io/getting-started/configuration-markup/#goldmark" rel = "external" target = "_self" > can be activated< / a > in your < code > hugo.toml< / code > or are built into the theme:< / p >
2022-12-02 15:05:54 +00:00
< ul >
2024-10-13 14:26:50 +00:00
< li >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-github" > < / i > < / span > < span class = "badge-content" style = "background-color: darkgray;" > GFM< / span > < / span > Extension on top of standard Markdown adhering to < a href = "https://github.github.com/gfm/" rel = "external" target = "_self" > GitHub Flavored Markdown< / a > .< / p >
2022-12-02 15:05:54 +00:00
< / li >
2024-10-13 14:26:50 +00:00
< li >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-php" > < / i > < / span > < span class = "badge-content" style = "background-color: #888cc4;" > PHP< / span > < / span > Extension on top of standard Markdown adhering to < a href = "https://michelf.ca/projects/php-markdown/extra/" rel = "external" target = "_self" > PHP Markdown< / a > .< / p >
< / li >
< li >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-lightbulb" > < / i > < / span > < span class = "badge-content" style = "background-color: darkorange;" > Pants< / span > < / span > Extension by John Gruber adhering to < a href = "https://daringfireball.net/projects/smartypants/" rel = "external" target = "_self" > SmartyPants< / a > .< / p >
< / li >
< li >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-hackerrank" > < / i > < / span > < span class = "badge-content" style = "background-color: fuchsia;" > Hugo< / span > < / span > < a href = "https://github.com/gohugoio/hugo-goldmark-extensions?tab=readme-ov-file#extras-extension" rel = "external" target = "_self" > Hugo Extra Extension< / a > supported by Hugo.< / p >
< / li >
< li >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw far fa-gem" > < / i > < / span > < span class = "badge-content" style = "background-color: #7c3aed;" > Obsidian< / span > < / span > Extension implemented by < a href = "https://obsidian.md/" rel = "external" target = "_self" > Obsidian< / a > .< / p >
< / li >
< li >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-code" > < / i > < / span > < span class = "badge-content" style = "background-color: orangered;" > HTML< / span > < / span > If the < a href = "https://gohugo.io/getting-started/configuration-markup/#rendererunsafe" rel = "external" target = "_self" > usage of HTML< / a > is allowed, the theme supports styling for further HTML elements.< / p >
< / li >
< li >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-puzzle-piece" > < / i > < / span > < span class = "badge-content" style = "background-color: #7dc903;" > Relearn< / span > < / span > Extension specific to this theme.< / p >
2022-04-02 13:30:16 +00:00
< / li >
< / ul >
2024-10-13 14:26:50 +00:00
< h2 id = "paragraphs" > Paragraphs< / h2 >
< p > In Markdown your content usually spans the whole available document width. This is called a block. Blocks are always separated by whitespace to their adjacent blocks in the resulting document.< / p >
< p > Any text not starting with a special sign is written as normal, plain text paragraph block and must be separated to its adjacent blocks by empty lines.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.< / p >
< p > Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "headings" > Headings< / h2 >
< p > A good idea is to structure your content using headings and subheadings. HTML-headings from < code > h1< / code > through < code > h6< / code > are constructed with a < code > #< / code > for each level.< / p >
< p > In Hugo you usually don’ t use < code > h1< / code > as this is generated by your theme and you should only have one such element in a document.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > < span class = "gh" > # h1 Heading
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gh" > < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gu" > ## h2 Heading
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gu" > < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gu" > ### h3 Heading
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gu" > < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gu" > #### h4 Heading
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gu" > < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gu" > ##### h5 Heading
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "gu" > < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > ###### h6 Heading< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< h1 id = "h1-heading" > h1 Heading< / h1 >
< h2 id = "h2-heading" > h2 Heading< / h2 >
< h3 id = "h3-heading" > h3 Heading< / h3 >
< h4 id = "h4-heading" > h4 Heading< / h4 >
< h5 id = "h5-heading" > h5 Heading< / h5 >
< h6 id = "h6-heading" > h6 Heading< / h6 >
2024-09-05 18:03:19 +00:00
< / div >
2023-06-03 09:12:46 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "horizontal-rules" > Horizontal Rules< / h2 >
< p > To further structure your content you can add horizontal rules. They create a “ thematic break” between paragraph blocks. In Markdown, you can create it with three consecutive dashes < code > ---< / code > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.
2022-12-02 15:05:54 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > ---
2022-12-02 15:05:54 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-01 00:38:08 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus.< / p >
< hr >
< p > Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2023-06-03 09:12:46 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "blockquotes" > Blockquotes< / h2 >
< h3 id = "quotations" > Quotations< / h3 >
< p > For quoting blocks of content from another source within your document add < code > > < / code > before any text you want to quote.< / p >
< p > Blockquotes can also be nested.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > Donec massa lacus, ultricies a ullamcorper in, fermentum sed augue. Nunc augue, aliquam non hendrerit ac, commodo vel nisi.
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" > >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > < / span > < span class = "ge" > > > Sed adipiscing elit vitae augue consectetur a gravida nunc vehicula. Donec auctor odio non est accumsan facilisis. Aliquam id turpis in dolor tincidunt mollis ac eu diam.
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > >
< / span > < / span > < span class = "line" > < span class = "cl" > > Mauris sit amet ligula egestas, feugiat metus tincidunt, luctus libero. Donec congue finibus tempor. Vestibulum aliquet sollicitudin erat, ut aliquet purus posuere luctus.< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< blockquote >
< p > Donec massa lacus, ultricies a ullamcorper in, fermentum sed augue. Nunc augue, aliquam non hendrerit ac, commodo vel nisi.< / p >
< blockquote >
< p > Sed adipiscing elit vitae augue consectetur a gravida nunc vehicula. Donec auctor odio non est accumsan facilisis. Aliquam id turpis in dolor tincidunt mollis ac eu diam.< / p >
< / blockquote >
< p > Mauris sit amet ligula egestas, feugiat metus tincidunt, luctus libero. Donec congue finibus tempor. Vestibulum aliquet sollicitudin erat, ut aliquet purus posuere luctus.< / p >
< / blockquote >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "github-alerts" > GitHub Alerts< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-github" > < / i > < / span > < span class = "badge-content" style = "background-color: darkgray;" > GFM< / span > < / span > Since Hugo < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-hackerrank" > < / i > < / span > < span class = "badge-content" style = "background-color: fuchsia;" > 0.132.0< / span > < / span > < a href = "https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax#alerts" rel = "external" target = "_self" > GitHub alerts< / a > are also supported. Please note, that coloring and icons of severities may defer between GitHub and this theme.< / p >
< p > If you are in need of more advanced options to style your alerts, like icons, use the < a href = "/hugo-theme-relearn/shortcodes/notice/index.html" > notice shortcode< / a > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!CAUTION]
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" > > < / span > < span class = "ge" > Advises about risks or negative outcomes of certain actions.
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!IMPORTANT]
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" > > < / span > < span class = "ge" > Key information users need to know to achieve their goal.
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!INFO]
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" > > < / span > < span class = "ge" > Information that users < ins> _might_< /ins> find interesting.
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!NOTE]
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" > > < / span > < span class = "ge" > Useful information that users should know, even when skimming content.
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!TIP]
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" > > < / span > < span class = "ge" > Helpful advice for doing things better or more easily.
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!WARNING]
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > > Urgent info that needs immediate user attention to avoid problems.< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< div class = "box notices cstyle caution" >
< div class = "box-label" >
< i class = "fa-fw fas fa-hand" > < / i > Caution
< / div >
< div class = "box-content" >
< p > Advises about risks or negative outcomes of certain actions.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box notices cstyle important" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-bolt" > < / i > Important
2024-09-01 11:58:33 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Key information users need to know to achieve their goal.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box notices cstyle info" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-info-circle" > < / i > Info
2024-09-01 11:58:33 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Information that users < ins > < em > might< / em > < / ins > find interesting.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box notices cstyle note" >
< div class = "box-label" >
< i class = "fa-fw fas fa-exclamation-circle" > < / i > Note
< / div >
< div class = "box-content" >
< p > Useful information that users should know, even when skimming content.< / p >
< / div >
< / div >
< div class = "box notices cstyle tip" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-lightbulb" > < / i > Tip
2024-09-01 11:58:33 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Helpful advice for doing things better or more easily.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box notices cstyle warning" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-exclamation-triangle" > < / i > Warning
2024-09-01 11:58:33 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Urgent info that needs immediate user attention to avoid problems.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< / div >
< / div >
< h3 id = "obsidian-callouts" > Obsidian Callouts< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw far fa-gem" > < / i > < / span > < span class = "badge-content" style = "background-color: #7c3aed;" > Obsidian< / span > < / span > Since Hugo < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-hackerrank" > < / i > < / span > < span class = "badge-content" style = "background-color: fuchsia;" > 0.134.0< / span > < / span > < a href = "https://help.obsidian.md/Editing+and+formatting/Callouts#Change+the+title" rel = "external" target = "_self" > Obsidian callouts< / a > are also supported. Which enables configurable title text and expand/collapse.< / p >
< p > If you are in need of more advanced options to style your alerts, like icons, use the < a href = "/hugo-theme-relearn/shortcodes/notice/index.html" > notice shortcode< / a > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!tip] Callouts can have custom titles
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" > > < / span > < span class = "ge" > Like this one.
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!tip] Title-only callout
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!note]- Are callouts foldable?
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" > > < / span > < span class = "ge" > Yes! In a foldable callout, the contents are hidden when the callout is collapsed
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > < span class = "k" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > > < / span > < span class = "ge" > [!note]+ Are callouts foldable?
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "ge" > < / span > > Yes! In a foldable callout, the contents are hidden when the callout is collapsed< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< div class = "box notices cstyle tip" >
< div class = "box-label" >
< i class = "fa-fw fas fa-lightbulb" > < / i > Callouts can have custom titles
< / div >
< div class = "box-content" >
< p > Like this one.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box notices cstyle tip" >
< div class = "box-label" >
< i class = "fa-fw fas fa-lightbulb" > < / i > Title-only callout
< / div >
< / div >
< div class = "expand box notices cstyle note" >
2024-10-25 06:34:40 +00:00
< input type = "checkbox" id = "R-expand-d9db6e587e58e8d02fb43591b7502d4f" aria-controls = "R-expandcontent-d9db6e587e58e8d02fb43591b7502d4f" >
< label class = "expand-label box-label" for = "R-expand-d9db6e587e58e8d02fb43591b7502d4f" >
2024-10-13 14:26:50 +00:00
< i class = "expander-icon fa-fw fas fa-chevron-down" > < / i >
< i class = "expander-icon fa-fw fas fa-chevron-right" > < / i > < i class = "fa-fw fas fa-exclamation-circle" > < / i > Are callouts foldable?
< / label >
< div class = "box-spacer" > < / div >
2024-10-25 06:34:40 +00:00
< div id = "R-expandcontent-d9db6e587e58e8d02fb43591b7502d4f" class = "box-content expand-content" >
2024-10-13 14:26:50 +00:00
< p > Yes! In a foldable callout, the contents are hidden when the callout is collapsed< / p >
< / div >
< / div >
< div class = "expand box notices cstyle note" >
2024-10-25 06:34:40 +00:00
< input type = "checkbox" id = "R-expand-e0a59d46b5397bd3d17747e455e63f64" aria-controls = "R-expandcontent-e0a59d46b5397bd3d17747e455e63f64" checked >
< label class = "expand-label box-label" for = "R-expand-e0a59d46b5397bd3d17747e455e63f64" >
2024-10-13 14:26:50 +00:00
< i class = "expander-icon fa-fw fas fa-chevron-down" > < / i >
< i class = "expander-icon fa-fw fas fa-chevron-right" > < / i > < i class = "fa-fw fas fa-exclamation-circle" > < / i > Are callouts foldable?
< / label >
< div class = "box-spacer" > < / div >
2024-10-25 06:34:40 +00:00
< div id = "R-expandcontent-e0a59d46b5397bd3d17747e455e63f64" class = "box-content expand-content" >
2024-10-13 14:26:50 +00:00
< p > Yes! In a foldable callout, the contents are hidden when the callout is collapsed< / p >
< / div >
< / div >
< / div >
< / div >
< h2 id = "text-markers" > Text Markers< / h2 >
< h3 id = "bold" > Bold< / h3 >
< p > You can show importance of a snippet of text with a heavier font-weight by enclosing it with two asterisks < code > **< / code > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > I am rendered with **bold text**< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > I am rendered with < strong > bold text< / strong > < / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "italics" > Italics< / h3 >
< p > You can emphasize a snippet of text with italics by enclosing it with underscores < code > _< / code > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > I am rendered with _italicized text_< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > I am rendered with < em > italicized text< / em > < / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "marked-text" > Marked Text< / h3 >
< p > You can mark text in the predefined accent color of your stylesheet.< / p >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-hackerrank" > < / i > < / span > < span class = "badge-content" style = "background-color: fuchsia;" > Hugo< / span > < / span > Since Hugo 0.126.0, you can < a href = "https://github.com/gohugoio/hugo-goldmark-extensions?tab=readme-ov-file#extras-extension" rel = "external" target = "_self" > activate this through the < em > Hugo Extra Extension< / em > < / a > in your < code > hugo.toml< / code > < / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ==Parts== of this text ==are marked!==< / span > < / span > < / code > < / pre > < / div >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-code" > < / i > < / span > < span class = "badge-content" style = "background-color: orangered;" > HTML< / span > < / span > You can also use it by configuring Hugo for < a href = "https://gohugo.io/getting-started/configuration-markup/#rendererunsafe" rel = "external" target = "_self" > usage of HTML< / a > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-html" data-lang = "html" > < span class = "line" > < span class = "cl" > < span class = "p" > < < / span > < span class = "nt" > mark< / span > < span class = "p" > > < / span > Parts< span class = "p" > < /< / span > < span class = "nt" > mark< / span > < span class = "p" > > < / span > of this text < span class = "p" > < < / span > < span class = "nt" > mark< / span > < span class = "p" > > < / span > are marked!< span class = "p" > < /< / span > < span class = "nt" > mark< / span > < span class = "p" > > < / span > < / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-01 00:38:08 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > < mark > Parts< / mark > of this text < mark > are marked!< / mark > < / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-10-08 19:39:32 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "inserted-text" > Inserted Text< / h3 >
< p > You can mark text additions to existing text.< / p >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-hackerrank" > < / i > < / span > < span class = "badge-content" style = "background-color: fuchsia;" > Hugo< / span > < / span > Since Hugo 0.126.0, you can < a href = "https://github.com/gohugoio/hugo-goldmark-extensions?tab=readme-ov-file#extras-extension" rel = "external" target = "_self" > activate this through the < em > Hugo Extra Extension< / em > < / a > in your < code > hugo.toml< / code > < / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > The ++hot, new++ stuff< / span > < / span > < / code > < / pre > < / div >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-code" > < / i > < / span > < span class = "badge-content" style = "background-color: orangered;" > HTML< / span > < / span > You can also use it by configuring Hugo for < a href = "https://gohugo.io/getting-started/configuration-markup/#rendererunsafe" rel = "external" target = "_self" > usage of HTML< / a > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-html" data-lang = "html" > < span class = "line" > < span class = "cl" > The < span class = "p" > < < / span > < span class = "nt" > ins< / span > < span class = "p" > > < / span > hot, new< span class = "p" > < /< / span > < span class = "nt" > ins< / span > < span class = "p" > > < / span > stuff< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > The < ins > hot, new< / ins > stuff< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "deleted-text" > Deleted Text< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-github" > < / i > < / span > < span class = "badge-content" style = "background-color: darkgray;" > GFM< / span > < / span > You can do strikethroughs by enclosing text with two tildes < code > ~~< / code > . See < a href = "https://gohugo.io/getting-started/configuration-markup/#extras" rel = "external" target = "_self" > Hugo’ s documentation remarks< / a > if you want to use this together with the subscript syntax.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ~~Strike through~~ this text< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > < del > Strike through< / del > this text< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "special-typesetting" > Special Typesetting< / h2 >
< h3 id = "text-substitution" > Text Substitution< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-lightbulb" > < / i > < / span > < span class = "badge-content" style = "background-color: darkorange;" > Pants< / span > < / span > You can combine multiple punctuation characters to single typographic entities. This will only be applied to text outside of code blocks or inline code.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > Double quotes < span class = "sb" > `" `< / span > and single quotes < span class = "sb" > `' `< / span > of enclosed text are replaced by < span class = "ge" > **< / span > " double curly quotes" ** and < span class = "ge" > **< / span > ' single curly quotes' **.
2022-10-08 19:39:32 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > Double dashes < span class = "sb" > `--`< / span > and triple dashes < span class = "sb" > `---`< / span > are replaced by en-dash < span class = "ge" > **< / span > --** and em-dash < span class = "ge" > **< / span > ---** entities.
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > Double arrows pointing left < span class = "sb" > `< < `< / span > or right < span class = "sb" > `> > `< / span > are replaced by arrow < span class = "ge" > **< / span > < span class = "err" > < < < / span > ** and < span class = "ge" > **< / span > > > ** entities.
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > Three consecutive dots < span class = "sb" > `...`< / span > are replaced by an ellipsis < span class = "ge" > **< / span > ...** entity.< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Double quotes < code > " < / code > and single quotes < code > '< / code > of enclosed text are replaced by < strong > “ double curly quotes” < / strong > and < strong > ‘ single curly quotes’ < / strong > .< / p >
< p > Double dashes < code > --< / code > and triple dashes < code > ---< / code > are replaced by en-dash < strong > – < / strong > and em-dash < strong > — < / strong > entities.< / p >
< p > Double arrows pointing left < code > < < < / code > or right < code > > > < / code > are replaced by arrow < strong > « < / strong > and < strong > » < / strong > entities.< / p >
< p > Three consecutive dots < code > ...< / code > are replaced by an ellipsis < strong > … < / strong > entity.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "subscript-and-superscript" > Subscript and Superscript< / h3 >
< p > You can also use subscript and superscript text. For more complex stuff, you can use the < a href = "/hugo-theme-relearn/shortcodes/math/index.html" > < code > math< / code > shortcode< / a > .< / p >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-hackerrank" > < / i > < / span > < span class = "badge-content" style = "background-color: fuchsia;" > Hugo< / span > < / span > Since Hugo 0.126.0, you can < a href = "https://github.com/gohugoio/hugo-goldmark-extensions?tab=readme-ov-file#extras-extension" rel = "external" target = "_self" > activate this through the < em > Hugo Extra Extension< / em > < / a > in your < code > hugo.toml< / code > < / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > How many liters H~2~O fit into 1dm^3^?< / span > < / span > < / code > < / pre > < / div >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-code" > < / i > < / span > < span class = "badge-content" style = "background-color: orangered;" > HTML< / span > < / span > You can also use it by configuring Hugo for < a href = "https://gohugo.io/getting-started/configuration-markup/#rendererunsafe" rel = "external" target = "_self" > usage of HTML< / a > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-html" data-lang = "html" > < span class = "line" > < span class = "cl" > How many liters H< span class = "p" > < < / span > < span class = "nt" > sub< / span > < span class = "p" > > < / span > 2< span class = "p" > < /< / span > < span class = "nt" > sub< / span > < span class = "p" > > < / span > O fit into 1dm< span class = "p" > < < / span > < span class = "nt" > sup< / span > < span class = "p" > > < / span > 3< span class = "p" > < /< / span > < span class = "nt" > sup< / span > < span class = "p" > > < / span > ?< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > How many liters H< sub > 2< / sub > O fit into 1dm< sup > 3< / sup > ?< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "keyboard-shortcuts" > Keyboard Shortcuts< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-code" > < / i > < / span > < span class = "badge-content" style = "background-color: orangered;" > HTML< / span > < / span > You can use the < code > < kbd> < / code > element to style keyboard shortcuts.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-html" data-lang = "html" > < span class = "line" > < span class = "cl" > Press < span class = "p" > < < / span > < span class = "nt" > kbd< / span > < span class = "p" > > < / span > STRG< span class = "p" > < /< / span > < span class = "nt" > kbd< / span > < span class = "p" > > < / span > < span class = "p" > < < / span > < span class = "nt" > kbd< / span > < span class = "p" > > < / span > ALT< span class = "p" > < /< / span > < span class = "nt" > kbd< / span > < span class = "p" > > < / span > < span class = "p" > < < / span > < span class = "nt" > kbd< / span > < span class = "p" > > < / span > DEL< span class = "p" > < /< / span > < span class = "nt" > kbd< / span > < span class = "p" > > < / span > to end your shift early.< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Press < kbd > STRG< / kbd > < kbd > ALT< / kbd > < kbd > DEL< / kbd > to end your shift early.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "lists" > Lists< / h2 >
< h3 id = "unordered" > Unordered< / h3 >
< p > You can write a list of items in which the order of the items does not explicitly matter.< / p >
< p > It is possible to nest lists by indenting an item for the next sublevel.< / p >
< p > You may use any of < code > -< / code > , < code > *< / code > or < code > +< / code > to denote bullets for each list item but should not switch between those symbols inside one whole list.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > < span class = "k" > -< / span > Lorem ipsum dolor sit amet
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > -< / span > Consectetur adipiscing elit
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > -< / span > Vestibulum laoreet porttitor sem
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > -< / span > Ac tristique libero volutpat at
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > -< / span > Nulla volutpat aliquam velit
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > -< / span > Phasellus iaculis neque
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > -< / span > Purus sodales ultricies
< / span > < / span > < span class = "line" > < span class = "cl" > - Faucibus porta lacus fringilla vel< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< ul >
< li > Lorem ipsum dolor sit amet< / li >
< li > Consectetur adipiscing elit
< ul >
< li > Vestibulum laoreet porttitor sem< / li >
< li > Ac tristique libero volutpat at< / li >
< / ul >
< / li >
< li > Nulla volutpat aliquam velit
< ul >
< li > Phasellus iaculis neque< / li >
< li > Purus sodales ultricies< / li >
< / ul >
< / li >
< li > Faucibus porta lacus fringilla vel< / li >
< / ul >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "ordered" > Ordered< / h3 >
< p > You can create a list of items in which the order of items does explicitly matter.< / p >
< p > It is possible to nest lists by indenting an item for the next sublevel.< / p >
< p > Markdown will automatically number each of your items consecutively. This means, the order number you are providing is irrelevant.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > < span class = "k" > 1.< / span > Lorem ipsum dolor sit amet
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > 3.< / span > Consectetur adipiscing elit
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > 1.< / span > Integer molestie lorem at massa
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > 7.< / span > Facilisis in pretium nisl aliquet
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > 99.< / span > Nulla volutpat aliquam velit
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > 1.< / span > Faucibus porta lacus fringilla vel
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > 1.< / span > Aenean sit amet erat nunc
< / span > < / span > < span class = "line" > < span class = "cl" > 17. Eget porttitor lorem< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< ol >
< li > Lorem ipsum dolor sit amet< / li >
< li > Consectetur adipiscing elit
< ol >
< li > Integer molestie lorem at massa< / li >
< li > Facilisis in pretium nisl aliquet< / li >
< / ol >
< / li >
< li > Nulla volutpat aliquam velit
< ol >
< li > Faucibus porta lacus fringilla vel< / li >
< li > Aenean sit amet erat nunc< / li >
< / ol >
< / li >
< li > Eget porttitor lorem< / li >
< / ol >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "tasks" > Tasks< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-github" > < / i > < / span > < span class = "badge-content" style = "background-color: darkgray;" > GFM< / span > < / span > You can add task lists resulting in checked or unchecked non-clickable items< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > < span class = "k" > - [x]< / span > Basic Test
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > - [ ]< / span > More Tests
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > - [x]< / span > View
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "k" > - [x]< / span > Hear
< / span > < / span > < span class = "line" > < span class = "cl" > - [ ] Smell< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< ul >
< li > < input checked = "" disabled = "" type = "checkbox" > Basic Test< / li >
< li > < input disabled = "" type = "checkbox" > More Tests
< ul >
< li > < input checked = "" disabled = "" type = "checkbox" > View< / li >
< li > < input checked = "" disabled = "" type = "checkbox" > Hear< / li >
< li > < input disabled = "" type = "checkbox" > Smell< / li >
< / ul >
< / li >
< / ul >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "definitions" > Definitions< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-php" > < / i > < / span > < span class = "badge-content" style = "background-color: #888cc4;" > PHP< / span > < / span > Definition lists are made of terms and definitions of these terms, much like in a dictionary.< / p >
< p > A definition list in Markdown Extra is made of a single-line term followed by a colon and the definition for that term. You can also associate more than one term to a definition.< / p >
< p > If you add empty lines around the definition terms, additional vertical space will be generated. Also multiple paragraphs are possible< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > Apple
< / span > < / span > < span class = "line" > < span class = "cl" > : Pomaceous fruit of plants of the genus Malus in the family Rosaceae.
< / span > < / span > < span class = "line" > < span class = "cl" > : An American computer company.
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > Orange
< / span > < / span > < span class = "line" > < span class = "cl" > : The fruit of an evergreen tree of the genus Citrus.
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > You can make juice out of it.
< / span > < / span > < span class = "line" > < span class = "cl" > : A telecommunication company.
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > You can' t make juice out of it.< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< dl >
< dt > Apple< / dt >
< dd > Pomaceous fruit of plants of the genus Malus in the family Rosaceae.< / dd >
< dd > An American computer company.< / dd >
< dt > Orange< / dt >
< dd > The fruit of an evergreen tree of the genus Citrus.
< p > You can make juice out of it.< / p >
< / dd >
< dd > A telecommunication company.
< p > You can’ t make juice out of it.< / p >
< / dd >
< / dl >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "code" > Code< / h2 >
< h3 id = "inline-code" > Inline Code< / h3 >
< p > Inline snippets of code can be wrapped with backticks < code > `< / code > .< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > In this example, < span class = "sb" > `< div> < /div> `< / span > is marked as code.< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > In this example, < code > < div> < /div> < / code > is marked as code.< / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "indented-code-block" > Indented Code Block< / h3 >
< p > A simple code block can be generated by indenting several lines of code by at least two spaces.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > Be impressed by my advanced code:
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > // Some comments
< / span > < / span > < span class = "line" > < span class = "cl" > line 1 of code
< / span > < / span > < span class = "line" > < span class = "cl" > line 2 of code
< / span > < / span > < span class = "line" > < span class = "cl" > line 3 of code< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > Be impressed by my advanced code:< / p >
< pre > < code > // Some comments
line 1 of code
line 2 of code
line 3 of code
< / code > < / pre >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "fenced-code-block" > Fenced Code Block< / h3 >
< p > If you want to gain more control of your code block you can enclose your code by at least three backticks < code > ```< / code > a so called fence.< / p >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-github" > < / i > < / span > < span class = "badge-content" style = "background-color: darkgray;" > GFM< / span > < / span > You can also add a language specifier directly after the opening fence, < code > ```js< / code > , and syntax highlighting will automatically be applied according to the selected language in the rendered HTML.< / p >
< p > See < a href = "/hugo-theme-relearn/shortcodes/highlight/index.html" > Code Highlighting< / a > for additional documentation.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-plaintext" data-lang = "plaintext" > < span class = "line" > < span class = "cl" > ```js
< / span > < / span > < span class = "line" > < span class = "cl" > {
< / span > < / span > < span class = "line" > < span class = "cl" > name: " Claus" ,
< / span > < / span > < span class = "line" > < span class = "cl" > surname: " Santa" ,
< / span > < / span > < span class = "line" > < span class = "cl" > profession: " courier" ,
< / span > < / span > < span class = "line" > < span class = "cl" > age: 666,
< / span > < / span > < span class = "line" > < span class = "cl" > address: {
< / span > < / span > < span class = "line" > < span class = "cl" > city: " North Pole" ,
< / span > < / span > < span class = "line" > < span class = "cl" > postalCode: 1,
< / span > < / span > < span class = "line" > < span class = "cl" > country: " Arctic"
< / span > < / span > < span class = "line" > < span class = "cl" > },
< / span > < / span > < span class = "line" > < span class = "cl" > friends: [ " Dasher" , " Dancer" , " Prancer" , " Vixen" , " Comet" , " Cupid" , " Donder" , " Blitzen" , " Rudolph" ]
< / span > < / span > < span class = "line" > < span class = "cl" > };
< / span > < / span > < span class = "line" > < span class = "cl" > ```< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-js" data-lang = "js" > < span class = "line" > < span class = "cl" > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > name< / span > < span class = "o" > :< / span > < span class = "s2" > " Claus" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > surname< / span > < span class = "o" > :< / span > < span class = "s2" > " Santa" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > profession< / span > < span class = "o" > :< / span > < span class = "s2" > " courier" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > age< / span > < span class = "o" > :< / span > < span class = "mi" > 666< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > address< / span > < span class = "o" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > city< / span > < span class = "o" > :< / span > < span class = "s2" > " North Pole" < / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > postalCode< / span > < span class = "o" > :< / span > < span class = "mi" > 1< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > country< / span > < span class = "o" > :< / span > < span class = "s2" > " Arctic" < / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > },< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > friends< / span > < span class = "o" > :< / span > < span class = "p" > [< / span > < span class = "s2" > " Dasher" < / span > < span class = "p" > ,< / span > < span class = "s2" > " Dancer" < / span > < span class = "p" > ,< / span > < span class = "s2" > " Prancer" < / span > < span class = "p" > ,< / span > < span class = "s2" > " Vixen" < / span > < span class = "p" > ,< / span > < span class = "s2" > " Comet" < / span > < span class = "p" > ,< / span > < span class = "s2" > " Cupid" < / span > < span class = "p" > ,< / span > < span class = "s2" > " Donder" < / span > < span class = "p" > ,< / span > < span class = "s2" > " Blitzen" < / span > < span class = "p" > ,< / span > < span class = "s2" > " Rudolph" < / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > };< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "tables" > Tables< / h2 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-github" > < / i > < / span > < span class = "badge-content" style = "background-color: darkgray;" > GFM< / span > < / span > You can create tables by adding pipes as dividers between each cell, and by adding a line of dashes (also separated by bars) beneath the header. Note that the pipes do not need to be vertically aligned.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > | Option | Description |
< / span > < / span > < span class = "line" > < span class = "cl" > |--------|-------------|
< / span > < / span > < span class = "line" > < span class = "cl" > | data | path to data files to supply the data that will be passed into templates. |
< / span > < / span > < span class = "line" > < span class = "cl" > | engine | engine to be used for processing templates. Handlebars is the default. |
< / span > < / span > < span class = "line" > < span class = "cl" > | ext | extension to be used for dest files. |< / span > < / span > < / code > < / pre > < / div >
2024-08-13 11:44:38 +00:00
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
2022-12-02 15:05:54 +00:00
< div class = "box-content" >
2024-03-16 09:01:12 +00:00
< table >
2024-09-03 17:09:09 +00:00
< thead >
< tr >
2024-10-24 14:30:52 +00:00
< th > Option< / th >
< th > Description< / th >
2024-09-03 17:09:09 +00:00
< / tr >
< / thead >
< tbody >
< tr >
2024-10-24 14:30:52 +00:00
< td > data< / td >
< td > path to data files to supply the data that will be passed into templates.< / td >
2024-09-03 17:09:09 +00:00
< / tr >
< tr >
2024-10-24 14:30:52 +00:00
< td > engine< / td >
< td > engine to be used for processing templates. Handlebars is the default.< / td >
2024-09-03 17:09:09 +00:00
< / tr >
< tr >
2024-10-24 14:30:52 +00:00
< td > ext< / td >
< td > extension to be used for dest files.< / td >
2024-09-03 17:09:09 +00:00
< / tr >
< / tbody >
2024-03-16 09:01:12 +00:00
< / table >
2023-08-25 17:35:54 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "aligned-columns" > Aligned Columns< / h3 >
< p > Adding a colon on the left and/or right side of the dashes below any heading will align the text for that column accordingly.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > | Option | Number | Description |
< / span > < / span > < span class = "line" > < span class = "cl" > |-------:|:------:|:------------|
< / span > < / span > < span class = "line" > < span class = "cl" > | data | 1 | path to data files to supply the data that will be passed into templates. |
< / span > < / span > < span class = "line" > < span class = "cl" > | engine | 2 | engine to be used for processing templates. Handlebars is the default. |
< / span > < / span > < span class = "line" > < span class = "cl" > | ext | 3 | extension to be used for dest files. |< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2023-08-25 17:35:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
< table >
< thead >
< tr >
< th style = "text-align: right" > Option< / th >
< th style = "text-align: center" > Number< / th >
< th style = "text-align: left" > Description< / th >
< / tr >
< / thead >
< tbody >
< tr >
< td style = "text-align: right" > data< / td >
< td style = "text-align: center" > 1< / td >
< td style = "text-align: left" > path to data files to supply the data that will be passed into templates.< / td >
< / tr >
< tr >
< td style = "text-align: right" > engine< / td >
< td style = "text-align: center" > 2< / td >
< td style = "text-align: left" > engine to be used for processing templates. Handlebars is the default.< / td >
< / tr >
< tr >
< td style = "text-align: right" > ext< / td >
< td style = "text-align: center" > 3< / td >
< td style = "text-align: left" > extension to be used for dest files.< / td >
< / tr >
< / tbody >
< / table >
2023-08-25 17:35:54 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h2 id = "links" > Links< / h2 >
< h3 id = "autolink" > Autolink< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-github" > < / i > < / span > < span class = "badge-content" style = "background-color: darkgray;" > GFM< / span > < / span > Absolute URLs will automatically be converted into a link.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > This is a link to https://example.com.< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2023-08-25 17:35:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
< p > This is a link to < a href = "https://example.com" rel = "external" target = "_self" > https://example.com< / a > .< / p >
2023-08-25 17:35:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< / div >
< h3 id = "basic-link" > Basic Link< / h3 >
< p > You can explicitly define links in case you want to use non-absolute URLs or want to give different text.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > [< span class = "nt" > Assemble< / span > ](< span class = "na" > http://assemble.io< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2023-08-25 17:35:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
< p > < a href = "http://assemble.io" rel = "external" target = "_self" > Assemble< / a > < / p >
2023-08-25 17:35:54 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "link-with-tooltip" > Link with Tooltip< / h3 >
< p > For even further information, you can add an additional text, displayed in a tooltip on hovering over the link.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > [< span class = "nt" > Upstage< / span > ](< span class = "na" > https://github.com/upstage/ " Visit Upstage!" < / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2023-08-25 17:35:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
< p > < a href = "https://github.com/upstage/" rel = "external" target = "_self" title = "Visit Upstage!" > Upstage< / a > < / p >
2023-08-25 17:35:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< / div >
< h3 id = "link-references" > Link References< / h3 >
< p > Links can be simplyfied for recurring reuse by using a reference ID to later define the URL location. This simplyfies writing if you want to use a link more than once in a document.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > [Example][somelinkID]
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > [somelinkID]: https://example.com " Go to example domain" < / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-09-01 11:58:33 +00:00
< / div >
2023-08-25 17:35:54 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > < a href = "https://example.com" rel = "external" target = "_self" title = "Go to example domain" > Example< / a > < / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-12-02 15:05:54 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "footnotes" > Footnotes< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-php" > < / i > < / span > < span class = "badge-content" style = "background-color: #888cc4;" > PHP< / span > < / span > Footnotes work mostly like reference-style links. A footnote is made of two things, a marker in the text that will become a superscript number and a footnote definition that will be placed in a list of footnotes.< / p >
< p > Usually the list of footnotes will be shown at the end of your document. If we use a footnote in a notice box it will instead be listed at the end of its box.< / p >
< p > Footnotes can contain block elements, which means that you can put multiple paragraphs, lists, blockquotes and so on in a footnote. It works the same as for list items, just indent the following paragraphs by four spaces in the footnote definition.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > That' s some text with a footnote[^1]
2022-04-02 13:30:16 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > [^1]: And that' s the footnote.
2022-04-02 13:30:16 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > That' s some more text with a footnote.[^someid]
2022-04-02 13:30:16 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > [^someid]:
< / span > < / span > < span class = "line" > < span class = "cl" > Anything of interest goes here.
2022-04-02 13:30:16 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > Blue light glows blue.< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
< div class = "box-content" >
< p > That’ s some text with a footnote< sup id = "fnref:1" > < a href = "#fn:1" class = "footnote-ref" role = "doc-noteref" > 1< / a > < / sup > < / p >
< p > That’ s some more text with a footnote.< sup id = "fnref:2" > < a href = "#fn:2" class = "footnote-ref" role = "doc-noteref" > 2< / a > < / sup > < / p >
< div class = "footnotes" role = "doc-endnotes" >
< hr >
< ol >
< li id = "fn:1" >
< p > And that’ s the footnote.  < a href = "#fnref:1" class = "footnote-backref" role = "doc-backlink" > ↩ ︎ < / a > < / p >
< / li >
< li id = "fn:2" >
< p > Anything of interest goes here.< / p >
< p > Blue light glows blue.  < a href = "#fnref:2" class = "footnote-backref" role = "doc-backlink" > ↩ ︎ < / a > < / p >
< / li >
< / ol >
< / div >
< / div >
< / div >
< h2 id = "images" > Images< / h2 >
< h3 id = "basic-images" > Basic Images< / h3 >
< p > Images have a similar syntax to links but include a preceding exclamation mark.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Spock< / span > ](< span class = "na" > https://octodex.github.com/images/spocktocat.png< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-f499d7309e6277eea763aed8771ad887" class = "lightbox-link" > < img alt = "Spock" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/spocktocat.png?width=20vw" style = " height: auto; width: 20vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-f499d7309e6277eea763aed8771ad887" > < img alt = "Spock" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/spocktocat.png?width=20vw" > < / a > < / p >
2024-10-13 14:26:50 +00:00
< / div >
< / div >
< h3 id = "image-with-tooltip" > Image with Tooltip< / h3 >
< p > Like links, images can also be given a tooltip.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Picard< / span > ](< span class = "na" > https://octodex.github.com/images/jean-luc-picat.jpg " Jean Luc Picard" < / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-106272efe0708b619a2b49e0015f16f5" class = "lightbox-link" > < img alt = "Picard" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/jean-luc-picat.jpg?width=20vw" style = " height: auto; width: 20vw;" title = "Jean Luc Picard" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-106272efe0708b619a2b49e0015f16f5" > < img alt = "Picard" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/jean-luc-picat.jpg?width=20vw" title = "Jean Luc Picard" > < / a > < / p >
2024-10-13 14:26:50 +00:00
< / div >
< / div >
< h3 id = "image-references" > Image References< / h3 >
< p > Images can also be linked by reference ID to later define the URL location. This simplyfies writing if you want to use an image more than once in a document.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![La Forge][laforge]
< / span > < / span > < span class = "line" > < span class = "cl" >
< / span > < / span > < span class = "line" > < span class = "cl" > [laforge]: https://octodex.github.com/images/trekkie.jpg " Geordi La Forge" < / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-9a8bb7d86de645fed7d0d5a9ff6f1ce8" class = "lightbox-link" > < img alt = "La Forge" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/trekkie.jpg?width=20vw" style = " height: auto; width: 20vw;" title = "Geordi La Forge" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-9a8bb7d86de645fed7d0d5a9ff6f1ce8" > < img alt = "La Forge" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/trekkie.jpg?width=20vw" title = "Geordi La Forge" > < / a > < / p >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< h3 id = "image-effects" > Image Effects< / h3 >
< p > < span class = "badge cstyle default badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fas fa-puzzle-piece" > < / i > < / span > < span class = "badge-content" style = "background-color: #7dc903;" > Relearn< / span > < / span > This theme allows additional non-standard formatting by setting query parameter at the end of the image URL. See the < a href = "/hugo-theme-relearn/authoring/imageeffects/index.html" > image effects docs< / a > for a detailed example and how to configure it.< / p >
< h4 id = "resizing" > Resizing< / h4 >
< p > Add query parameter < code > width< / code > and/or < code > height< / code > to the link image to resize the image. Values are CSS values (default is < code > auto< / code > ).< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Minion< / span > ](< span class = "na" > https://octodex.github.com/images/minion.png?width=20vw< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-a46f4f34865b48385486ae32d844bda8" class = "lightbox-link" > < img alt = "Minion" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/minion.png?width=20vw" style = " height: auto; width: 20vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-a46f4f34865b48385486ae32d844bda8" > < img alt = "Minion" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/minion.png?width=20vw" > < / a > < / p >
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< / div >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Minion< / span > ](< span class = "na" > https://octodex.github.com/images/minion.png?height=50px< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-0b940da6ffd04e63c5cf262bb5fb83c5" class = "lightbox-link" > < img alt = "Minion" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/minion.png?height=50px" style = " height: 50px; width: auto;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-0b940da6ffd04e63c5cf262bb5fb83c5" > < img alt = "Minion" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/minion.png?height=50px" > < / a > < / p >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Minion< / span > ](< span class = "na" > https://octodex.github.com/images/minion.png?height=50px& width=40vw< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-899e6037fb2672bb59c8e76c12bfd202" class = "lightbox-link" > < img alt = "Minion" class = "bg-white border lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/minion.png?height=50px&width=40vw" style = " height: 50px; width: 40vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-899e6037fb2672bb59c8e76c12bfd202" > < img alt = "Minion" class = "bg-white border lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/minion.png?height=50px&width=40vw" > < / a > < / p >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< h4 id = "css-classes" > CSS Classes< / h4 >
< p > Add a query parameter < code > classes< / code > to the link image to add CSS classes. Add some of the predefined values or even define your own in your CSS.< / p >
< h5 id = "shadow" > Shadow< / h5 >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Spidertocat< / span > ](< span class = "na" > https://octodex.github.com/images/spidertocat.png?classes=shadow< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-8e4e655cac89453b486b844683e531b4" class = "lightbox-link" > < img alt = "Spidertocat" class = "bg-white border lazy lightbox noborder shadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/spidertocat.png?width=20vw&classes=shadow,noborder" style = " height: auto; width: 20vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-8e4e655cac89453b486b844683e531b4" > < img alt = "Spidertocat" class = "bg-white border lazy lightbox noborder shadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/spidertocat.png?width=20vw&classes=shadow,noborder" > < / a > < / p >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< h5 id = "border" > Border< / h5 >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > DrOctocat< / span > ](< span class = "na" > https://octodex.github.com/images/droctocat.png?classes=border< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
< / div >
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-ca8efbb5a68872c421023bb7bdc3981f" class = "lightbox-link" > < img alt = "DrOctocat" class = "bg-white border lazy lightbox noshadow noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/droctocat.png?width=20vw&classes=border,noshadow" style = " height: auto; width: 20vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-ca8efbb5a68872c421023bb7bdc3981f" > < img alt = "DrOctocat" class = "bg-white border lazy lightbox noshadow noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/droctocat.png?width=20vw&classes=border,noshadow" > < / a > < / p >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< h5 id = "left" > Left< / h5 >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Supertocat< / span > ](< span class = "na" > https://octodex.github.com/images/okal-eltocat.jpg?classes=left< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-09-01 11:58:33 +00:00
< / div >
2023-01-25 11:42:06 +00:00
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-a1400e06bf6d45b5efc8176c4ee93183" class = "lightbox-link" > < img alt = "Supertocat" class = "bg-white border lazy left lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/okal-eltocat.jpg?width=20vw&classes=left" style = " height: auto; width: 20vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-a1400e06bf6d45b5efc8176c4ee93183" > < img alt = "Supertocat" class = "bg-white border lazy left lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/okal-eltocat.jpg?width=20vw&classes=left" > < / a > < / p >
2024-09-05 18:03:19 +00:00
< / div >
2023-06-03 09:12:46 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h5 id = "right" > Right< / h5 >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Riddlocat< / span > ](< span class = "na" > https://octodex.github.com/images/riddlocat.jpg?classes=right< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
< div class = "box-label" >
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-03-02 10:05:50 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-80fc8ae3228f7905fd9a6198b8845b5a" class = "lightbox-link" > < img alt = "Riddlocat" class = "bg-white border lazy lightbox right noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/riddlocat.jpg?width=20vw&classes=right" style = " height: auto; width: 20vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-80fc8ae3228f7905fd9a6198b8845b5a" > < img alt = "Riddlocat" class = "bg-white border lazy lightbox right noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/riddlocat.jpg?width=20vw&classes=right" > < / a > < / p >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< h5 id = "inline" > Inline< / h5 >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Spidertocat< / span > ](< span class = "na" > https://octodex.github.com/images/spidertocat.png?classes=inline< / span > )
< / span > < / span > < span class = "line" > < span class = "cl" > ![< span class = "nt" > DrOctocat< / span > ](< span class = "na" > https://octodex.github.com/images/droctocat.png?classes=inline< / span > )
< / span > < / span > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Supertocat< / span > ](< span class = "na" > https://octodex.github.com/images/okal-eltocat.jpg?classes=inline< / span > )
< / span > < / span > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Riddlocat< / span > ](< span class = "na" > https://octodex.github.com/images/riddlocat.jpg?classes=inline< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-09-01 11:58:33 +00:00
< / div >
2022-12-01 00:38:08 +00:00
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-195198da5ecc87b62e0f9ac852f96345" class = "lightbox-link" > < img alt = "Spidertocat" class = "bg-white border inline lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/spidertocat.png?width=10vw&classes=inline" style = " height: auto; width: 10vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-195198da5ecc87b62e0f9ac852f96345" > < img alt = "Spidertocat" class = "bg-white border inline lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/spidertocat.png?width=10vw&classes=inline" > < / a >
< a href = "#R-image-b08813f31de1e8c6a8c9089ee536a534" class = "lightbox-link" > < img alt = "DrOctocat" class = "bg-white border inline lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/droctocat.png?width=10vw&classes=inline" style = " height: auto; width: 10vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-b08813f31de1e8c6a8c9089ee536a534" > < img alt = "DrOctocat" class = "bg-white border inline lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/droctocat.png?width=10vw&classes=inline" > < / a >
< a href = "#R-image-6ac06944d4e5256e2e2abbac53492221" class = "lightbox-link" > < img alt = "Supertocat" class = "bg-white border inline lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/okal-eltocat.jpg?width=10vw&classes=inline" style = " height: auto; width: 10vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-6ac06944d4e5256e2e2abbac53492221" > < img alt = "Supertocat" class = "bg-white border inline lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/okal-eltocat.jpg?width=10vw&classes=inline" > < / a >
< a href = "#R-image-b61e00acd9a0fd9e9cf9d99e976b1e16" class = "lightbox-link" > < img alt = "Riddlocat" class = "bg-white border inline lazy lightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/riddlocat.jpg?width=10vw&classes=inline" style = " height: auto; width: 10vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-b61e00acd9a0fd9e9cf9d99e976b1e16" > < img alt = "Riddlocat" class = "bg-white border inline lazy lightbox noshadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/riddlocat.jpg?width=10vw&classes=inline" > < / a > < / p >
2024-09-05 18:03:19 +00:00
< / div >
2023-06-03 09:12:46 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h5 id = "combination" > Combination< / h5 >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > X-tocat< / span > ](< span class = "na" > https://octodex.github.com/images/xtocat.jpg?classes=shadow,border,left< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-09-01 11:58:33 +00:00
< / div >
2022-12-01 00:38:08 +00:00
< div class = "box-content" >
2024-10-25 06:34:40 +00:00
< p > < a href = "#R-image-624b0b84617fdafdbc19b782da104f38" class = "lightbox-link" > < img alt = "X-tocat" class = "bg-white border lazy left lightbox shadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/xtocat.jpg?width=20vw&classes=shadow,border,left" style = " height: auto; width: 20vw;" > < / a >
< a href = "javascript:history.back();" class = "lightbox-back" id = "R-image-624b0b84617fdafdbc19b782da104f38" > < img alt = "X-tocat" class = "bg-white border lazy left lightbox shadow lightbox-image" loading = "lazy" src = "https://octodex.github.com/images/xtocat.jpg?width=20vw&classes=shadow,border,left" > < / a > < / p >
2024-09-05 18:03:19 +00:00
< / div >
2022-04-02 13:30:16 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< h4 id = "lightbox" > Lightbox< / h4 >
< p > Add the query parameter < code > lightbox=false< / code > to the image link to disable the lightbox.< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Homercat< / span > ](< span class = "na" > https://octodex.github.com/images/homercat.png?lightbox=false< / span > )< / span > < / span > < / code > < / pre > < / div >
< div class = "box notices cstyle code" >
2024-09-01 11:58:33 +00:00
< div class = "box-label" >
2024-10-13 14:26:50 +00:00
< i class = "fa-fw fas fa-eye" > < / i > Result
2024-09-01 11:58:33 +00:00
< / div >
2022-12-01 00:38:08 +00:00
< div class = "box-content" >
2024-10-13 14:26:50 +00:00
< p > < img alt = "Homercat" class = "bg-white border lazy nolightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/homercat.png?width=20vw&lightbox=false" style = " height: auto; width: 20vw;" > < / p >
< / div >
< / div >
< div class = "box notices cstyle note" >
< div class = "box-label" >
< i class = "fa-fw fas fa-exclamation-circle" > < / i > Note
< / div >
< div class = "box-content" >
< p > If you want to wrap an image in a link and < code > lightbox=true< / code > is your default setting, you have to explicitly disable the lightbox to avoid it to hijacking your link like:< / p >
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > [< span class = "nt" > ![Homercat< / span > ](< span class = "na" > https://octodex.github.com/images/homercat.png?lightbox=false< / span > )](https://octodex.github.com/#homercat)< / span > < / span > < / code > < / pre > < / div >
< p > < a href = "https://octodex.github.com/#homercat" rel = "external" target = "_self" > < img alt = "Homercat" class = "bg-white border lazy nolightbox noshadow figure-image" loading = "lazy" src = "https://octodex.github.com/images/homercat.png?width=20vw&lightbox=false" style = " height: auto; width: 20vw;" > < / a > < / p >
2024-09-05 18:03:19 +00:00
< / div >
2023-06-03 09:12:46 +00:00
< / div >
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
< i class = "fa-fw fas fa-layer-group" > < / i >
< ul >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/howto/index.html" > Howto< / a > < / li >
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/reference/index.html" > Reference< / a > < / li >
< / ul >
< / div >
< / footer >
< / article >
< article class = "default" >
< header class = "headline" >
< / header >
< h1 id = "image-effects" > Image Effects< / h1 >
< p > The theme offers < a href = "/hugo-theme-relearn/authoring/markdown/index.html#image-effects" > graphical effects< / a > for your linked images.< / p >
< p > You can < a href = "/hugo-theme-relearn/configuration/customization/imageeffects/index.html" > define additional custom image effects and set defaults< / a > in your configuration.< / p >
< p > The default image effects shipped with the theme are< / p >
< table >
< thead >
< tr >
2024-10-24 14:30:52 +00:00
< th > Name< / th >
< th > Description< / th >
2024-10-13 14:26:50 +00:00
< / tr >
< / thead >
< tbody >
< tr >
2024-10-24 14:30:52 +00:00
< td > border< / td >
< td > Draws a light thin border around the image< / td >
2024-10-13 14:26:50 +00:00
< / tr >
< tr >
2024-10-24 14:30:52 +00:00
< td > lazy< / td >
< td > Lets the image be lazy loaded< / td >
2024-10-13 14:26:50 +00:00
< / tr >
< tr >
2024-10-24 14:30:52 +00:00
< td > lightbox< / td >
< td > The image will be clickable to show it enlarged< / td >
2024-10-13 14:26:50 +00:00
< / tr >
< tr >
2024-10-24 14:30:52 +00:00
< td > shadow< / td >
< td > Draws a shadow around the image to make it appear hovered/glowing< / td >
2024-10-13 14:26:50 +00:00
< / tr >
< / tbody >
< / table >
< p > One way to use them is to add them as URL query parameter to each individually linked image.< / p >
< p > This can become cumbersome to be done consistently for the whole site. Instead, you can < a href = "/hugo-theme-relearn/configuration/customization/imageeffects/index.html" > configure the defaults< / a > in your < code > hugo.toml< / code > as well as overriding these defaults in a page’ s front matter.< / p >
< p > Explicitly set URL query parameter will override the defaults set for a page or your site.< / p >
< p > Without any settings in your < code > hugo.toml< / code > < code > imageEffects< / code > defaults to< / p >
2024-03-02 10:05:50 +00:00
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
2024-10-13 14:26:50 +00:00
< div class = "tab-nav-title" > ​ < / div >
2024-03-02 10:05:50 +00:00
< 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" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > imageEffects< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > border< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > lazy< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > lightbox< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > shadow< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nt" > imageEffects< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > border< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > lazy< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > lightbox< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > shadow< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
2024-03-11 20:44:09 +00:00
< 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 >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " imageEffects" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " border" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " lazy" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " lightbox" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " shadow" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span >
2024-03-02 10:05:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span >
2024-09-05 18:03:19 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< p > < span class = "badge cstyle green badge-with-title" > < span class = "badge-title" > < i class = "fa-fw fab fa-markdown" > < / i > < / span > < span class = "badge-content" > Front Matter< / span > < / span > This can be overridden in a pages front matter for example by< / p >
2024-03-02 10:05:50 +00:00
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
2024-10-13 14:26:50 +00:00
< div class = "tab-nav-title" > ​ < / div >
2024-03-02 10:05:50 +00:00
< 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" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > [< / span > < span class = "nx" > imageEffects< / span > < span class = "p" > ]< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > lazy< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "err" > +++< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-yaml" data-lang = "yaml" > < span class = "line" > < span class = "cl" > < span class = "nn" > ---< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > imageEffects< / span > < span class = "p" > :< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > lazy< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nn" > ---< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
2024-03-11 20:44:09 +00:00
< 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 >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " imageEffects" < / span > < span class = "p" > :< / span > < span class = "p" > {< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " lazy" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span >
2024-03-02 10:05:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span >
2024-09-05 18:03:19 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< p > Or by explicitly override settings by URL query parameter< / p >
2024-10-25 06:34:40 +00:00
< div class = "tab-panel" data-tab-group = "45a90956c205f9661a1ff416e8f3febb" >
2024-03-02 10:05:50 +00:00
< div class = "tab-nav" >
< div class = "tab-nav-title" > ​ < / div >
< button
2024-10-13 14:26:50 +00:00
data-tab-item="url"
2024-03-02 10:05:50 +00:00
class="tab-nav-button tab-panel-style cstyle initial active" tabindex="-1"
2024-10-25 06:34:40 +00:00
onclick="switchTab('45a90956c205f9661a1ff416e8f3febb','url')"
2024-03-02 10:05:50 +00:00
>
2024-10-13 14:26:50 +00:00
< span class = "tab-nav-text" > URL< / span >
2024-03-02 10:05:50 +00:00
< / button >
< / div >
< div class = "tab-content-container" >
< div
2024-10-13 14:26:50 +00:00
data-tab-item="url"
2024-03-02 10:05:50 +00:00
class="tab-content tab-panel-style cstyle initial active">
< div class = "tab-content-text" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-md" data-lang = "md" > < span class = "line" > < span class = "cl" > ![< span class = "nt" > Minion< / span > ](< span class = "na" > https://octodex.github.com/images/minion.png?lazy=true& lightbox=false< / span > )< / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
2024-10-13 14:26:50 +00:00
< / div > < p > The settings applied to the above image would be< / p >
2024-03-02 10:05:50 +00:00
< div class = "tab-panel" data-tab-group = "config-code" >
< div class = "tab-nav" >
2024-10-13 14:26:50 +00:00
< div class = "tab-nav-title" > ​ < / div >
2024-03-02 10:05:50 +00:00
< 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" >
2024-10-13 14:26:50 +00:00
< div class = "highlight wrap-code" > < pre tabindex = "0" class = "chroma" > < code class = "language-toml" data-lang = "toml" > < span class = "line" > < span class = "cl" > < span class = "nx" > border< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > lazy< / span > < span class = "p" > =< / span > < span class = "kc" > true< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > lightbox< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nx" > shadow< / span > < span class = "p" > =< / span > < span class = "kc" > false< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< div
data-tab-item="yaml"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
2024-10-13 14:26:50 +00:00
< 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" > border< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > lazy< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > true< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > lightbox< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < span class = "w" >
< / span > < / span > < / span > < span class = "line" > < span class = "cl" > < span class = "w" > < / span > < span class = "nt" > shadow< / span > < span class = "p" > :< / span > < span class = "w" > < / span > < span class = "kc" > false< / span > < / span > < / span > < / code > < / pre > < / div >
2024-09-05 18:03:19 +00:00
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< div
data-tab-item="json"
class="tab-content tab-panel-style cstyle initial">
< div class = "tab-content-text" >
2024-03-11 20:44:09 +00:00
< 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 >
2024-10-13 14:26:50 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " border" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " lazy" < / span > < span class = "p" > :< / span > < span class = "kc" > true< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " lightbox" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span > < span class = "p" > ,< / span >
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "nt" > " shadow" < / span > < span class = "p" > :< / span > < span class = "kc" > false< / span >
2024-09-05 18:03:19 +00:00
< / span > < / span > < span class = "line" > < span class = "cl" > < span class = "p" > }< / span > < / span > < / span > < / code > < / pre > < / div >
< / div >
2024-03-02 10:05:50 +00:00
< / div >
< / div >
< / div >
2023-05-26 06:40:21 +00:00
2024-10-13 14:26:50 +00:00
< footer class = "footline" >
< div class = "R-taxonomy taxonomy-categories cstyle" title = "Categories" style = "--VARIABLE-TAGS-BG-color: var(--INTERNAL-TAG-BG-color);" >
2023-10-05 06:14:23 +00:00
< i class = "fa-fw fas fa-layer-group" > < / i >
2023-10-03 11:21:35 +00:00
< ul >
2024-10-13 14:26:50 +00:00
< li > < a class = "term-link" href = "/hugo-theme-relearn/categories/explanation/index.html" > Explanation< / a > < / li >
2023-10-03 11:21:35 +00:00
< / ul >
< / div >
2024-10-13 14:26:50 +00:00
< / footer >
< / article >
2023-05-17 22:13:41 +00:00
< / section >
< / div >
2022-04-02 13:30:16 +00:00
< / main >
< / div >
2024-10-25 06:34:40 +00:00
< script src = "/hugo-theme-relearn/js/clipboard.min.js?1729838068" defer > < / script >
< script src = "/hugo-theme-relearn/js/perfect-scrollbar.min.js?1729838068" defer > < / script >
< script src = "/hugo-theme-relearn/js/theme.js?1729838068" defer > < / script >
2022-04-02 13:30:16 +00:00
< / body >
< / html >
