content: Replace calls to the code shortcode with fenced code blocks

2026-08-18 08:24:54 +00:00 · 2025-03-06 02:49:11 -08:00
parent b23c9a583a
commit fd628be6ed
110 changed files with 483 additions and 555 deletions
@@ -19,9 +19,9 @@ Please see the [contributing] section for guidelines, examples, and process.

 # Install

-```bash
+```sh
 npm i
 hugo server
 ```

-**Note:** We're working on removing the need to run `npm i` for local development. Stay tuned.
+**Note:** We're working on removing the need to run `npm i` for local development. Stay tuned.
@@ -32,13 +32,13 @@ content/

 And these templates:

-{{< code file=layouts/_default/list.html >}}
+```go-html-template {file="layouts/_default/list.html"}
 {{ range .Pages.ByWeight }}
  <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
 {{ end }}
-{{< /code >}}
+```

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ with .Prev }}
  <a href="{{ .RelPermalink }}">Previous</a>
 {{ end }}
@@ -46,7 +46,7 @@ And these templates:
 {{ with .Next }}
  <a href="{{ .RelPermalink }}">Next</a>
 {{ end }}
-{{< /code >}}
+```

 When you visit page-2:

@@ -32,13 +32,13 @@ content/

 And these templates:

-{{< code file=layouts/_default/list.html >}}
+```go-html-template {file="layouts/_default/list.html"}
 {{ range .Pages.ByWeight }}
  <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
 {{ end }}
-{{< /code >}}
+```

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ with .PrevInSection }}
  <a href="{{ .RelPermalink }}">Previous</a>
 {{ end }}
@@ -46,7 +46,7 @@ And these templates:
 {{ with .NextInSection }}
  <a href="{{ .RelPermalink }}">Next</a>
 {{ end }}
-{{< /code >}}
+```

 When you visit page-2:

@@ -32,13 +32,13 @@ content/

 And these templates:

-{{< code file=layouts/_default/list.html >}}
+```go-html-template {file="layouts/_default/list.html"}
 {{ range .Pages.ByWeight }}
  <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
 {{ end }}
-{{< /code >}}
+```

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ $pages := .CurrentSection.Pages.ByWeight }}

 {{ with $pages.Prev . }}
@@ -48,7 +48,7 @@ And these templates:
 {{ with $pages.Next . }}
  <a href="{{ .RelPermalink }}">Next</a>
 {{ end }}
-{{< /code >}}
+```

 When you visit page-2:

@@ -57,7 +57,7 @@ When you visit page-2:

 To reverse the meaning of _next_ and _previous_ you can chain the [`Reverse`] method to the page collection definition:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ $pages := .CurrentSection.Pages.ByWeight.Reverse }}

 {{ with $pages.Prev . }}
@@ -67,6 +67,6 @@ To reverse the meaning of _next_ and _previous_ you can chain the [`Reverse`] me
 {{ with $pages.Next . }}
  <a href="{{ .RelPermalink }}">Next</a>
 {{ end }}
-{{< /code >}}
+```

 [`Reverse`]: /methods/pages/reverse/
@@ -34,9 +34,9 @@ To capture the "genres" `Taxonomy` object from within any template, use the [`Ta

 To capture the "genres" `Taxonomy` object when rendering its page with a taxonomy template, use the [`Terms`] method on the page's [`Data`] object:

-{{< code file=layouts/_default/taxonomy.html >}}
+```go-html-template {file="layouts/_default/taxonomy.html"}
 {{ $taxonomyObject := .Data.Terms }}
-{{< /code >}}
+```

 To inspect the data structure:

@@ -8,7 +8,7 @@ _comment: Do not remove front matter.

 The primary use case for `PageInner` is to resolve links and [page resources](g) relative to an included `Page`. For example, create an "include" shortcode to compose a page from multiple content files, while preserving a global context for footnotes and the table of contents:

-{{< code file=layouts/shortcodes/include.html >}}
+```go-html-template {file="layouts/shortcodes/include.html" copy=true}
 {{ with .Get 0 }}
  {{ with $.Page.GetPage . }}
    {{- .RenderShortcodes }}
@@ -18,13 +18,13 @@ The primary use case for `PageInner` is to resolve links and [page resources](g)
 {{ else }}
  {{ errorf "The %q shortcode requires a positional parameter indicating the logical path of the file to include. See %s" .Name .Position }}
 {{ end }}
-{{< /code >}}
+```

 Then call the shortcode in your Markdown:

-{{< code file=content/posts/p1.md lang=text >}}
+```text {file="content/posts/p1.md"}
 {{%/* include "/posts/p2" */%}}
-{{< /code >}}
+```

 Any render hook triggered while rendering `/posts/p2` will get:

@@ -55,7 +55,6 @@ lang
 path
 : (`string`) A [glob](g) pattern matching the page's [logical path](g). For example: `{/books,/books/**}`.

-
 [page language]: /methods/page/language/

 ## Array
@@ -99,7 +99,6 @@ polls.for.excludes
 polls.for.includes
 : (`string`) A list of [glob](g) patterns to include in polling for this configuration.

-
 ## Behavior

 Polling and HTTP caching interact as follows:
@@ -19,7 +19,6 @@ quality = 75
 resampleFilter = 'box'
 {{< /code-toggle >}}

-
 anchor
 : (`string`) When using the Crop or Fill method, the anchor determines the placement of the crop box. One of `TopLeft`, `Top`, `TopRight`, `Left`, `Center`, `Right`, `BottomLeft`, `Bottom`, `BottomRight`, or `Smart`. Default is `Smart`.

@@ -300,7 +300,7 @@ rougify style monokai.sublime > assets/css/syntax.css

 In your base template add a link to the CSS file:

-{{< code file=layouts/_default/baseof.html >}}
+```go-html-template {file="layouts/_default/baseof.html"}
 <head>
  ...
  {{ with resources.Get "css/syntax.css" }}
@@ -308,7 +308,7 @@ In your base template add a link to the CSS file:
  {{ end }}
  ...
 </head>
-{{< /code >}}
+```

 Then add the code to be highlighted to your markup:

@@ -97,7 +97,6 @@ pageRef
  taxonomy|`/tags`
  term|`/tags/foo`

-
 url
 : (`string`) The destination URL. Use this for external destinations only.

@@ -82,7 +82,6 @@ min

 [`themesDir`]: /configuration/all/#themesdir

-
 ## Imports

 {{< code-toggle file=hugo >}}
@@ -122,7 +121,6 @@ path
 Before Hugo v0.56.0, custom component paths could only be configured by setting [`archetypeDir`], [`assetDir`], [`contentDir`], [`dataDir`], [`i18nDir`], [`layoutDi`], or [`staticDir`] in the site configuration. Module mounts offer greater flexibility than these legacy settings, but
 you cannot use both.

-
 [`archetypeDir`]: /configuration/all/
 [`assetDir`]: /configuration/all/
 [`contentDir`]: /configuration/all/
@@ -140,7 +140,6 @@ layouts/_default/list.atom.atom

 We leave writing the template code as an exercise for you. Aim for a result similar to the [embedded RSS template].

-
 ## List output formats

 To access output formats, each `Page` object provides two methods: [`OutputFormats`] (for all formats, including the current one) and [`AlternativeOutputFormats`]. Use `AlternativeOutputFormats` to create a link `rel` list within your site's `head` element, as shown below:
@@ -39,7 +39,6 @@ For example, you can do either of these:

 But you cannot do this:

-
 ```go-html-template
 {{ .Site.params.kebab-case.foo }}
 ```
@@ -154,7 +154,7 @@ public/
 │   │   └── index.html
 │   └── index.html
 └── index.html
-````
+```

 ## Tokens

@@ -101,7 +101,7 @@ We've configured the `authors` index with a weight of `2` and the `genres` index

 Then render a list of 5 related reviews with a partial template like this:

-{{< code file=layouts/partials/related.html copy=true >}}
+```go-html-template {file="layouts/partials/related.html" copy=true}
 {{ with site.RegularPages.Related . | first 5 }}
  <p>Related content:</p>
  <ul>
@@ -110,4 +110,4 @@ Then render a list of 5 related reviews with a partial template like this:
    {{ end }}
  </ul>
 {{ end }}
-{{< /code >}}
+```
@@ -48,6 +48,5 @@ x.disableInlineCSS
  ```go-html-template
  {{ .Site.Config.Services.X.DisableInlineCSS }}

-
 [v0.141.0]: https://github.com/gohugoio/hugo/releases/tag/v0.141.0
 [v0.123.0]: https://github.com/gohugoio/hugo/releases/tag/v0.123.0
@@ -95,7 +95,7 @@ Although typically used as a front matter template, you can also use an archetyp

 For example, in a documentation site you might have a section (content type) for functions. Every page within this section should follow the same format: a brief description, the function signature, examples, and notes. We can pre-populate the page to remind content authors of the standard format.

-{{< code file=archetypes/functions.md >}}
+````text {file="archetypes/functions.md"}
 ---
 date: '{{ .Date }}'
 draft: true
@@ -119,7 +119,7 @@ One or more practical examples, each within a fenced code block.
 ## Notes

 Additional information to clarify as needed.
-{{< /code >}}
+````

 Although you can include [template actions](g) within the content body, remember that Hugo evaluates these once---at the time of content creation. In most cases, place template actions in a [template](g) where Hugo evaluates the actions every time you [build](g) the site.

@@ -79,14 +79,14 @@ title = 'Headless page'

 To include the content and images on the home page:

-{{< code file=layouts/_default/home.html >}}
+```go-html-template {file="layouts/_default/home.html"}
 {{ with .Site.GetPage "/headless" }}
  {{ .Content }}
  {{ range .Resources.ByType "image" }}
    <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
  {{ end }}
 {{ end }}
-{{< /code >}}
+```

 The published site will have this structure:

@@ -139,7 +139,7 @@ In the front matter above, note that we have set `list` to `local` to include th

 To include the content and images on the home page:

-{{< code file=layouts/_default/home.html >}}
+```go-html-template {file="layouts/_default/home.html"}
 {{ with .Site.GetPage "/headless" }}
  {{ range .Pages }}
    {{ .Content }}
@@ -148,7 +148,7 @@ To include the content and images on the home page:
    {{ end }}
  {{ end }}
 {{ end }}
-{{< /code >}}
+```

 The published site will have this structure:

@@ -198,14 +198,14 @@ render = 'always'

 To render the glossary:

-{{< code file=layouts/glossary/list.html >}}
+```go-html-template {file="layouts/glossary/list.html"}
 <dl>
  {{ range .Pages }}
    <dt>{{ .Title }}</dt>
    <dd>{{ .Content }}</dd>
  {{ end }}
 </dl>
-{{< /code >}}
+```

 The published site will have this structure:

@@ -240,7 +240,7 @@ list = 'never'

 The published site will have this structure:

-```html
+```text
 public/
 ├── books/
 │   ├── book-1/
@@ -289,7 +289,7 @@ environment = 'production'

 The production site will have this structure:

-```html
+```text
 public/
 ├── reference/
 │   ├── reference-1/
@@ -37,7 +37,7 @@ Use these methods within a content adapter.

 Adds a page to the site.

-{{< code file=content/books/_content.gotmpl >}}
+```go-html-template {file="content/books/_content.gotmpl"}
 {{ $content := dict
  "mediaType" "text/markdown"
  "value" "The _Hunchback of Notre Dame_ was written by Victor Hugo."
@@ -49,13 +49,13 @@ Adds a page to the site.
  "title" "The Hunchback of Notre Dame"
 }}
 {{ .AddPage $page }}
-{{< /code >}}
+```

 ### AddResource

 Adds a page resource to the site.

-{{< code file=content/books/_content.gotmpl >}}
+```go-html-template {file="content/books/_content.gotmpl"}
 {{ with resources.Get "images/a.jpg" }}
  {{ $content := dict
    "mediaType" .MediaType.Type
@@ -67,23 +67,23 @@ Adds a page resource to the site.
  }}
  {{ $.AddResource $resource }}
 {{ end }}
-{{< /code >}}
+```

 Then retrieve the new page resource with something like:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ with .Resources.Get "cover.jpg" }}
  <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}" alt="">
 {{ end }}
-{{< /code >}}
+```

 ### Site

 Returns the `Site` to which the pages will be added.

-{{< code file=content/books/_content.gotmpl >}}
+```go-html-template {file="content/books/_content.gotmpl"}
 {{ .Site.Title }}
-{{< /code >}}
+```

 {{< note >}}
 Note that the `Site` returned isn't fully built when invoked from the content adapters; if you try to call methods that depends on pages, e.g. `.Site.Pages`, you will get an error saying "this method cannot be called before the site is fully initialized".
@@ -93,16 +93,16 @@ Note that the `Site` returned isn't fully built when invoked from the content ad

 Returns a persistent “scratch pad” to store and manipulate data. The main use case for this is to transfer values between executions when [EnableAllLanguages](#enablealllanguages) is set. See [examples](/methods/page/store/).

-{{< code file=content/books/_content.gotmpl >}}
+```go-html-template {file="content/books/_content.gotmpl"}
 {{ .Store.Set "key" "value" }}
 {{ .Store.Get "key" }}
-{{< /code >}}
+```

 ### EnableAllLanguages

 By default, Hugo executes the content adapter for the language defined by the _content.gotmpl file . Use this method to activate the content adapter for all languages.

-{{< code file=content/books/_content.gotmpl >}}
+```go-html-template {file="content/books/_content.gotmpl"}
 {{ .EnableAllLanguages }}
 {{ $content := dict
  "mediaType" "text/markdown"
@@ -115,7 +115,7 @@ By default, Hugo executes the content adapter for the language defined by the _c
  "title" "The Hunchback of Notre Dame"
 }}
 {{ .AddPage $page }}
-{{< /code >}}
+```

 ## Page map

@@ -183,7 +183,7 @@ Inspect the remote data to determine how to map key-value pairs to front matter

 Create the content adapter.

-{{< code file=content/books/_content.gotmpl copy=true >}}
+```go-html-template {file="content/books/_content.gotmpl" copy=true}
 {{/* Get remote data. */}}
 {{ $data := dict }}
 {{ $url := "https://gohugo.io/shared/examples/data/books.json" }}
@@ -236,13 +236,13 @@ Create the content adapter.
  {{ end }}

 {{ end }}
-{{< /code >}}
+```

 ### Step 4

 Create a single template to render each book review.

-{{< code file=layouts/books/single.html copy=true >}}
+```go-html-template {file="layouts/books/single.html" copy=true}
 {{ define "main" }}
  <h1>{{ .Title }}</h1>

@@ -269,7 +269,7 @@ Create a single template to render each book review.

  {{ .Content }}
 {{ end }}
-{{< /code >}}
+```

 ## Multilingual sites

@@ -59,17 +59,17 @@ See the [`transform.Unmarshal`](/functions/transform/unmarshal/#remote-resource)

 Use data sources to augment existing content. For example, create a shortcode to render an HTML table from a global CSV resource.

-{{< code file=assets/pets.csv >}}
+```csv {file="assets/pets.csv"}
 "name","type","breed","age"
 "Spot","dog","Collie","3"
 "Felix","cat","Malicious","7"
-{{< /code >}}
+```

-{{< code file=content/example.md lang=text >}}
+```text {file="content/example.md"}
 {{</* csv-to-table "pets.csv" */>}}
-{{< /code >}}
+```

-{{< code file=layouts/shortcodes/csv-to-table.html >}}
+```go-html-template {file="layouts/shortcodes/csv-to-table.html"}
 {{ with $file := .Get 0 }}
  {{ with resources.Get $file }}
    {{ with . | transform.Unmarshal }}
@@ -98,7 +98,7 @@ Use data sources to augment existing content. For example, create a shortcode to
 {{ else }}
  {{ errorf "The %q shortcode requires one positional argument, the path to the CSV file relative to the assets directory. See %s" .Name .Position }}
 {{ end }}
-{{< /code >}}
+```

 Hugo renders this to:

@@ -44,12 +44,12 @@ Hugo does not provide a built-in template for Mermaid diagrams. Create your own

 [code block render hook]: /render-hooks/code-blocks/

-{{< code file=layouts/_default/_markup/render-codeblock-mermaid.html >}}
+```go-html-template {file="layouts/_default/_markup/render-codeblock-mermaid.html"}
 <pre class="mermaid">
  {{- .Inner | htmlEscape | safeHTML }}
 </pre>
 {{ .Page.Store.Set "hasMermaid" true }}
-{{< /code >}}
+```

 And then include this snippet at the _bottom_ of the content template, before the closing `body` tag:

@@ -243,7 +243,7 @@ You can add taxonomy terms to the front matter of any these [page kinds](g):

 Access taxonomy terms from a template using the [`Params`] or [`GetTerms`] method on a `Page` object. For example:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ with .GetTerms "tags" }}
  <p>Tags</p>
  <ul>
@@ -252,7 +252,7 @@ Access taxonomy terms from a template using the [`Params`] or [`GetTerms`] metho
    {{ end }}
  </ul>
 {{ end }}
-{{< /code >}}
+```

 [`Params`]: /methods/page/params/
 [`GetTerms`]: /methods/page/getterms/
@@ -330,7 +330,7 @@ If you choose to define cascade values in front matter for a multilingual site,

 If your [content format] is [Emacs Org Mode], you may provide front matter using Org Mode keywords. For example:

-{{< code file=content/example.org lang=text >}}
+```text {file="content/example.org"}
 #+TITLE: Example
 #+DATE: 2024-02-02T04:14:54-08:00
 #+DRAFT: false
@@ -340,13 +340,13 @@ If your [content format] is [Emacs Org Mode], you may provide front matter using
 #+TAGS: red
 #+TAGS: blue
 #+WEIGHT: 10
-{{< /code >}}
+```

 Note that you can also specify array elements on a single line:

-{{< code file=content/example.org lang=text >}}
+```text {file="content/example.org"}
 #+TAGS[]: red blue
-{{< /code >}}
+```

 [content format]: /content-management/formats/
 [emacs org mode]: https://orgmode.org/
@@ -91,7 +91,7 @@ inline = [['@', '@']]

 Create a partial template to load MathJax or KaTeX. The example below loads MathJax, or you can use KaTeX as described in the [engines](#engines) section.

-{{< code file=layouts/partials/math.html copy=true >}}
+```go-html-template {file="layouts/partials/math.html" copy=true}
 <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"></script>
 <script>
  MathJax = {
@@ -104,7 +104,7 @@ Create a partial template to load MathJax or KaTeX. The example below loads Math
    },
  };
 </script>
-{{< /code >}}
+```

 The delimiters above must match the delimiters in your site configuration.

@@ -112,7 +112,7 @@ The delimiters above must match the delimiters in your site configuration.

 Conditionally call the partial template from the base template.

-{{< code file=layouts/_default/baseof.html >}}
+```go-html-template {file="layouts/_default/baseof.html"}
 <head>
  ...
  {{ if .Param "math" }}
@@ -120,7 +120,7 @@ Conditionally call the partial template from the base template.
  {{ end }}
  ...
 </head>
-{{< /code >}}
+```

 The example above loads the partial template if you have set the `math` parameter in front matter to `true`. If you have not set the `math` parameter in front matter, the conditional statement falls back to the `math` parameter in your site configuration.

@@ -128,7 +128,7 @@ The example above loads the partial template if you have set the `math` paramete

 Include mathematical equations and expressions in Markdown using LaTeX markup.

-{{< code file=content/math-examples.md copy=true >}}
+```text {file="content/math-examples.md" copy=true}
 This is an inline \(a^*=x-b^*\) equation.

 These are block equations:
@@ -150,7 +150,7 @@ $$ a^*=x-b^* $$
 $$
 a^*=x-b^*
 $$
-{{< /code >}}
+```

 If you set the `math` parameter to `false` in your site configuration, you must set the `math` parameter to `true` in front matter. For example:

@@ -187,7 +187,7 @@ See the [inline delimiters](#inline-delimiters) section for details.

 To use KaTeX instead of MathJax, replace the partial template from [Step 2] with this:

-{{< code file=layouts/partials/math.html copy=true >}}
+```go-html-template {file="layouts/partials/math.html" copy=true}
 <link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/katex@0.16.21/dist/katex.min.css"
@@ -219,7 +219,7 @@ To use KaTeX instead of MathJax, replace the partial template from [Step 2] with
    });
  });
 </script>
-{{< /code >}}
+```

 The delimiters above must match the delimiters in your site configuration.

@@ -119,7 +119,7 @@ Page Bundle resources follow the same language assignment logic as content files

 To create a list of links to translated content, use a template similar to the following:

-{{< code file=layouts/partials/i18nlist.html >}}
+```go-html-template {file="layouts/partials/i18nlist.html"}
 {{ if .IsTranslated }}
 <h4>{{ i18n "translations" }}</h4>
 <ul>
@@ -130,7 +130,7 @@ To create a list of links to translated content, use a template similar to the f
  {{ end }}
 </ul>
 {{ end }}
-{{< /code >}}
+```

 The above can be put in a `partial` (i.e., inside `layouts/partials/`) and included in any template. It will not print anything if there are no translations for a given page.

@@ -140,13 +140,13 @@ The above also uses the [`i18n` function][i18func] described in the next section

 `.AllTranslations` on a `Page` can be used to list all translations, including the page itself. On the home page it can be used to build a language navigator:

-{{< code file=layouts/partials/allLanguages.html >}}
+```go-html-template {file="layouts/partials/allLanguages.html"}
 <ul>
 {{ range $.Site.Home.AllTranslations }}
 <li><a href="{{ .RelPermalink }}">{{ .Language.LanguageName }}</a></li>
 {{ end }}
 </ul>
-{{< /code >}}
+```

 ## Translation of strings

@@ -12,7 +12,7 @@ Hugo uses a set of factors to identify a page's related content based on front m

 To list up to 5 related pages (which share the same _date_ or _keyword_ parameters) is as simple as including something similar to this partial in your template:

-{{< code file=layouts/partials/related.html copy=true >}}
+```go-html-template {file="layouts/partials/related.html" copy=true}
 {{ with site.RegularPages.Related . | first 5 }}
  <p>Related content:</p>
  <ul>
@@ -21,7 +21,7 @@ To list up to 5 related pages (which share the same _date_ or _keyword_ paramete
    {{ end }}
  </ul>
 {{ end }}
-{{< /code >}}
+```

 The `Related` method takes one argument which may be a `Page` or an options map. The options map has these options:

@@ -110,7 +110,7 @@ The content file (benefit-1.md) has four ancestors: benefits, product-1, product

 For example, use the `.Ancestors` method to render breadcrumb navigation.

-{{< code file=layouts/partials/breadcrumb.html >}}
+```go-html-template {file="layouts/partials/breadcrumb.html"}
 <nav aria-label="breadcrumb" class="breadcrumb">
  <ol>
    {{ range .Ancestors.Reverse }}
@@ -123,7 +123,7 @@ For example, use the `.Ancestors` method to render breadcrumb navigation.
    </li>
  </ol>
 </nav>
-{{< /code >}}
+```

 With this CSS:

@@ -22,17 +22,17 @@ Hugo's embedded shortcodes are pre-defined templates within the application. Ref

 Create custom shortcodes to simplify and standardize content creation. For example, the following shortcode template generates an audio player using a [global resource](g):

-{{< code file=layouts/shortcodes/audio.html >}}
+```go-html-template {file="layouts/shortcodes/audio.html"}
 {{ with resources.Get (.Get "src") }}
  <audio controls preload="auto" src="{{ .RelPermalink }}"></audio>
 {{ end }}
-{{< /code >}}
+```

 Then call the shortcode from within markup:

-{{< code file=content/example.md lang=text >}}
+```text {file="content/example.md"}
 {{</* audio src=/audio/test.mp3 */>}}
-{{< /code >}}
+```

 Learn more about creating shortcodes in the [shortcode templates] section.

@@ -57,14 +57,14 @@ The following example demonstrates an inline shortcode, `date.inline`, that acce

 [layout string]: /functions/time/format/#layout-string

-{{< code file=content/example.md lang=text >}}
+```text {file="content/example.md"}
 Today is
 {{</* date.inline ":date_medium" */>}}
  {{- now | time.Format (.Get 0) -}}
 {{</* /date.inline */>}}.

 Today is {{</* date.inline ":date_full" /*/>}}.
-{{< /code >}}
+```

 In the example above, the inline shortcode is executed twice: once upon definition and again when subsequently called. Hugo renders this to:

@@ -196,17 +196,17 @@ With standard notation, Hugo processes the shortcode separately, merging the out

 By way of example, with this shortcode template:

-{{< code file=layouts/shortcodes/foo.html >}}
+```go-html-template {file="layouts/shortcodes/foo.html"}
 {{ .Inner }}
-{{< /code >}}
+```

 And this markdown:

-{{< code file=content/example.md lang=text >}}
+```text {file="content/example.md"}
 {{%/* foo */%}} ## Section 1 {{%/* /foo */%}}

 {{</* foo */>}} ## Section 2 {{</* /foo */>}}
-{{< /code >}}
+```

 Hugo renders this HTML:

@@ -224,13 +224,13 @@ The shortcode author determines which notation to use. Consult each shortcode's

 Shortcodes (excluding [inline](#inline) shortcodes) can be nested, creating parent-child relationships. For example, a gallery shortcode might contain several image shortcodes:

-{{< code file=content/example.md lang=text >}}
+```text {file="content/example.md"}
 {{</* gallery class="content-gallery" */>}}
  {{</* image src="/images/a.jpg" */>}}
  {{</* image src="/images/b.jpg" */>}}
  {{</* image src="/images/c.jpg" */>}}
 {{</* /gallery */>}}
-{{< /code >}}
+```

 The [shortcode templates][nesting] section provides a detailed explanation and examples.

@@ -20,7 +20,7 @@ Review the [comparison table](#comparison) below to understand the characteristi

 Use a `<!--more-->` divider to indicate the end of the summary. Hugo will not render the summary divider itself.

-{{< code file=content/example.md >}}
+```text {file="content/example.md"}
 +++
 title: 'Example'
 date: 2024-05-26T09:10:33-07:00
@@ -31,7 +31,7 @@ This is the first paragraph.
 <!--more-->

 This is the second paragraph.
-{{< /code >}}
+```

 When using the Emacs Org Mode [content format], use a `# more` divider to indicate the end of the summary.

@@ -41,7 +41,7 @@ When using the Emacs Org Mode [content format], use a `# more` divider to indica

 Use front matter to define a summary independent of content.

-{{< code file=content/example.md >}}
+```text {file="content/example.md"}
 +++
 title: 'Example'
 date: 2024-05-26T09:10:33-07:00
@@ -51,7 +51,7 @@ summary: 'This summary is independent of the content.'
 This is the first paragraph.

 This is the second paragraph.
-{{< /code >}}
+```

 ## Automatic summary

@@ -59,7 +59,7 @@ If you do not define the summary manually or in front matter, Hugo automatically

 [`summaryLength`]: /configuration/all/#summarylength

-{{< code file=content/example.md >}}
+```text {file="content/example.md"}
 +++
 title: 'Example'
 date: 2024-05-26T09:10:33-07:00
@@ -70,7 +70,7 @@ This is the first paragraph.
 This is the second paragraph.

 This is the third paragraph.
-{{< /code >}}
+```

 For example, with a `summaryLength` of 7, the automatic summary will be:

@@ -19,11 +19,11 @@ Hugo provides several methods to add syntax highlighting to code examples:

 In its default configuration, Hugo highlights code examples within fenced code blocks, following this form:

-{{< code file=content/example.md lang=text >}}
+````text {file="content/example.md"}
 ```LANG [OPTIONS]
 CODE
 ```
-{{< /code >}}
+````

 CODE
 : The code to highlight.
@@ -39,7 +39,7 @@ OPTIONS

 For example, with this Markdown:

-{{< code file=content/example.md lang=text >}}
+````text {file="content/example.md"}
 ```go {linenos=inline hl_lines=[3,"6-8"] style=emacs}
 package main

@@ -51,7 +51,7 @@ func main() {
    }
 }
 ```
-{{< /code >}}
+````

 Hugo renders this:

@@ -75,13 +75,13 @@ func main() {

 When documenting shortcode usage, escape the tag delimiters:

-{{< code file=content/example.md lang=text >}}
+````text {file="content/example.md"}
 ```text {linenos=inline}
 {{</*/* shortcode-1 */*/>}}

 {{%/*/* shortcode-2 */*/%}}
 ```
-{{< /code >}}
+````

 Hugo renders this to:

@@ -236,7 +236,7 @@ public/

 The alias from the previous URL to the new URL is a client-side redirect:

-{{< code file=posts/previous-file-name/index.html >}}
+```html {file="posts/previous-file-name/index.html"}
 <!DOCTYPE html>
 <html lang="en-us">
  <head>
@@ -247,7 +247,7 @@ The alias from the previous URL to the new URL is a client-side redirect:
    <meta http-equiv="refresh" content="0; url=https://example.org/posts/new-file-name/">
  </head>
 </html>
-{{< /code >}}
+```

 Collectively, the elements in the `head` section:

@@ -126,15 +126,21 @@ Other best practices:
 - Avoid bold text; use the note shortcode for emphasis.
 - Do not put description terms (`dt`) in backticks unless syntactically necessary.
 - Do not use Hugo's `ref` or `relref` shortcodes.
- Prioritize current best practices over multiple options or historical - information.
+- Prioritize current best practices over multiple options or historical information.
 - Use short, focused code examples.
 - Use [basic english] where possible for a global audience.

 [basic english]: https://simple.wikipedia.org/wiki/Basic_English

+## Related content
+
+When available, the "See also" sidebar on this site displays related pages using Hugo's [related content] feature, based on front matter keywords. We ensure keyword accuracy by validating them against `data/keywords.yaml` during the build process. If a keyword is not found, you'll be alerted and must either modify the keyword or update the data file. This validation process helps to refine the related content for better results.
+
+[related content]: /content-management/related-content/
+
 ## Code examples

-Indent code by two spaces. With examples of template code, ddd spaces around template code action delimiters:
+Indent code by two spaces. With examples of template code, add spaces around the action delimiters:

 ```go-html-template
 {{ if eq $foo $bar }}
@@ -154,6 +160,16 @@ Always specify the language:
 ```
 ````

+To include a filename header and copy-to-clipboard button:
+
+````text
+```go-html-template {file="layouts/partials/foo.html" copy=true}
+{{ if eq $foo "bar" }}
+  {{ print "foo is bar" }}
+{{ end }}
+```
+````
+
 ### Shortcode calls

 Use this syntax :
@@ -189,40 +205,10 @@ draft = false
 {{</* /code-toggle */>}}
 ```

-### Other code examples
-
-Use the [code shortcode] for code examples that require a file name:
-
-```text
-{{</* code file=layouts/_default/single.html */>}}
-{{ range .Site.RegularPages }}
-  <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
-{{ end }}
-{{</* /code */>}}
-```
-
 ## Shortcodes

 These shortcodes are commonly used throughout the documentation. Other shortcodes are available for specialized use.

-### code
-
-Use the `code` shortcode for code examples that require a file name. This shortcode takes these arguments:
-
-copy
-: (`bool`) Whether to display a copy-to-clipboard button. Default is `false`.
-
-file
-: (`string`) The file name to display above the rendered code.
-
-lang
-: (`string`) The code language. If you do not provide a `lang` argument, the code language is determined by the file extension. If the file extension is `html`, sets the code language to `go-html-template`. Default is `text`.
-
-```text
-{{</* code file=content/something/foo.md lang=text copy=true */>}}
-Some code here
-{{</* /code */>}}
-```
 ### code-toggle

 Use the `code-toggle` shortcode to display examples of site configuration, front matter, or data files. This shortcode takes these arguments:
@@ -419,7 +405,6 @@ A project maintainer will review your PR and may request changes. You may delete
 [`glossary-term`]: #glossary-term
 [basic english]: https://simple.wikipedia.org/wiki/Basic_English
 [code examples]: #code-examples
-[code shortcode]: #code
 [code-toggle shortcode]: #code-toggle
 [documentation repository]: https://github.com/gohugoio/hugoDocs/
 [fenced code blocks]: https://spec.commonmark.org/0.30/#fenced-code-blocks
@@ -38,7 +38,7 @@ You can use `after` in combination with the [`first`] function and Hugo's [power
 1. The top row is titled "Featured" and shows only the most recently published article (i.e. by `publishdate` in the content files' front matter).
 1. The second row is titled "Recent Articles" and shows only the 2nd- to 4th-most recently published articles.

-{{< code file=layouts/section/articles.html >}}
+```go-html-template {file="layouts/section/articles.html"}
 {{ define "main" }}
  <section class="row featured-article">
    <h2>Featured Article</h2>
@@ -61,7 +61,7 @@ You can use `after` in combination with the [`first`] function and Hugo's [power
    {{ end }}
  </div>
 {{ end }}
-{{< /code >}}
+```

 [`first`]: /functions/collections/first/
 [`slice`]: /functions/collections/slice/
@@ -214,12 +214,12 @@ With TOML, date values are first-class citizens. TOML has a date data type while

 In the TOML example below, note that the event date is not quoted.

-{{< code file=content/events/2024-user-conference.md >}}
+```text {file="content/events/2024-user-conference.md"}
 +++
 title = '2024 User Conference"
 eventDate = 2024-04-01
 +++
-{{< /code >}}
+```

 To return a collection of future events:

@@ -42,13 +42,13 @@ npm i -D postcss postcss-cli autoprefixer

 Create a PostCSS configuration file in the root of your project.

-{{< code file=postcss.config.js >}}
+```js {file="postcss.config.js"}
 module.exports = {
  plugins: [
    require('autoprefixer')
  ]
 };
-{{< /code >}}
+```

 {{< note >}}
 {{% include "/_common/functions/postcss-windows-warning.md" %}}
@@ -58,10 +58,10 @@ target = "css"

 Create a CSS entry file:

-{{< code file=assets/css/main.css copy=true >}}
+```css {file="assets/css/main.css" copy=true}
@import "tailwindcss";
@source "hugo_stats.json";
-{{< /code >}}
+```

 Tailwind CSS respects `.gitignore` files. This means that if `hugo_stats.json` is listed in your `.gitignore` file, Tailwind CSS will ignore it. To make `hugo_stats.json` available to Tailwind CSS you must explicitly source it as shown in the example above.

@@ -69,7 +69,7 @@ Tailwind CSS respects `.gitignore` files. This means that if `hugo_stats.json` i

 Create a partial template to process the CSS with the Tailwind CSS CLI:

-{{< code file=layouts/partials/css.html copy=true >}}
+```go-html-template {file="layouts/partials/css.html" copy=true}
 {{ with (templates.Defer (dict "key" "global")) }}
  {{ with resources.Get "css/main.css" }}
    {{ $opts := dict
@@ -87,19 +87,19 @@ Create a partial template to process the CSS with the Tailwind CSS CLI:
    {{ end }}
  {{ end }}
 {{ end }}
-{{< /code >}}
+```

 ### Step 5

 Call the partial template from your base template:

-{{< code file=layouts/default/baseof.html >}}
+```go-html-template {file="layouts/default/baseof.html"}
 <head>
  ...
  {{ partialCached "css.html" . }}
  ...
 <head>
-{{< /code >}}
+```

 ### Step 6

@@ -109,7 +109,7 @@ extension] for Visual Studio Code.
 [Tailwind CSS IntelliSense
 extension]: https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss

-{{< code file=tailwind.config.js copy=true >}}
+```js {file="tailwind.config.js" copy=true}
 /*
 This file is present to satisfy a requirement of the Tailwind CSS IntelliSense
 extension for Visual Studio Code.
@@ -118,7 +118,7 @@ https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss

 The rest of this file is intentionally empty.
 */
-{{< /code >}}
+```

 ## Options

@@ -36,7 +36,7 @@ Hugo natively supports [GoAT](https://github.com/bep/goat) diagrams with an [emb

 This Markdown:

-````
+````text
 ```goat
 .---.     .-.       .-.       .-.     .---.
 | A +--->| 1 |<--->| 2 |<--->| 3 |<---+ B |
@@ -68,7 +68,7 @@ To customize rendering, override Hugo's [embedded code block render hook] for Go

 By way of example, let's create a code block render hook to render GoAT diagrams as `figure` elements with an optional caption.

-{{< code file=layouts/_default/_markup/render-codeblock-goat.html >}}
+```go-html-template {file="layouts/_default/_markup/render-codeblock-goat.html"}
 {{ $caption := or .Attributes.caption "" }}
 {{ $class := or .Attributes.class "diagram" }}
 {{ $id := or .Attributes.id (printf "diagram-%d" (add 1 .Ordinal)) }}
@@ -81,17 +81,17 @@ By way of example, let's create a code block render hook to render GoAT diagrams
  {{ end }}
  <figcaption>{{ $caption }}</figcaption>
 </figure>
-{{< /code >}}
+```

 This Markdown:

-{{< code file=content/example.md lang=text >}}
+````text {file="content/example.md" }
 ```goat {class="foo" caption="Diagram 1: Example"}
 .---.     .-.       .-.       .-.     .---.
 | A +--->| 1 |<--->| 2 |<--->| 3 |<---+ B |
 '---'     '-'       '+'       '+'     '---'
 ```
-{{< /code >}}
+````

 Is rendered to:

@@ -23,7 +23,7 @@ and then executing it in place:
 ```
 The typical use is to define a set of root templates that are then customized by redefining the block templates within.

-{{< code file=layouts/_default/baseof.html >}}
+```go-html-template {file="layouts/_default/baseof.html"}
 <body>
  <main>
    {{ block "main" . }}
@@ -31,16 +31,16 @@ The typical use is to define a set of root templates that are then customized by
    {{ end }}
  </main>
 </body>
-{{< /code >}}
+```

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ define "main" }}
  <h1>{{ .Title }}</h1>
  {{ .Content }}
 {{ end }}
-{{< /code >}}
+```

-{{< code file=layouts/_default/list.html >}}
+```go-html-template {file="layouts/_default/list.html"}
 {{ define "main" }}
  <h1>{{ .Title }}</h1>
  {{ .Content }}
@@ -48,6 +48,6 @@ The typical use is to define a set of root templates that are then customized by
    <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
  {{ end }}
 {{ end }}
-{{< /code >}}
+```

 {{% include "/_common/functions/go-template/text-template.md" %}}
@@ -24,13 +24,13 @@ Unlike `return` statements in other languages, Hugo executes the first occurrenc

 By way of example, let's create a partial template that _renders_ HTML, describing whether the given number is odd or even:

-{{< code file=layouts/partials/odd-or-even.html >}}
+```go-html-template {file="layouts/partials/odd-or-even.html"}
 {{ if math.ModBool . 2 }}
  <p>{{ . }} is even</p>
 {{ else }}
  <p>{{ . }} is odd</p>
 {{ end }}
-{{< /code >}}
+```

 When called, the partial renders HTML:

@@ -40,9 +40,9 @@ When called, the partial renders HTML:

 Instead of rendering HTML, let's create a partial that _returns_ a boolean value, reporting whether the given number is even:

-{{< code file=layouts/partials/is-even.html >}}
+```go-html-template {file="layouts/partials/is-even.html"}
 {{ return math.ModBool . 2 }}
-{{< /code >}}
+```

 With this template:

@@ -75,7 +75,7 @@ A partial that returns a value must contain only one `return` statement, placed

 For example:

-{{< code file=layouts/partials/is-even.html >}}
+```go-html-template {file="layouts/partials/is-even.html"}
 {{ $result := false }}
 {{ if math.ModBool . 2 }}
  {{ $result = "even" }}
@@ -83,16 +83,16 @@ For example:
  {{ $result = "odd" }}
 {{ end }}
 {{ return $result }}
-{{< /code >}}
+```

 {{< note >}}
 The construct below is incorrect; it contains more than one `return` statement.
 {{< /note >}}

-{{< code file=layouts/partials/do-not-do-this.html >}}
+```go-html-template {file="layouts/partials/do-not-do-this.html"}
 {{ if math.ModBool . 2 }}
  {{ return "even" }}
 {{ else }}
  {{ return "odd" }}
 {{ end }}
-{{< /code >}}
+```
@@ -20,7 +20,6 @@ Create the filter:
 {{ $filter := images.AutoOrient }}
 ```

-
 {{% include "/_common/functions/images/apply-image-filter.md" %}}

 {{< note >}}
@@ -73,7 +73,7 @@ Specify `level`, `scale`, and `targetDir` as needed to achieve the desired resul

 To include a QR code that points to the `Permalink` of the current page:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ with images.QR .Permalink }}
  <img
    src="{{ .RelPermalink }}"
@@ -84,7 +84,7 @@ To include a QR code that points to the `Permalink` of the current page:
    loading="lazy"
  >
 {{ end }}
-{{< /code >}}
+```

 Then hide the QR code with CSS unless printing the page:

@@ -90,7 +90,6 @@ noComments
 sourceMap
 : (`string`) Whether to generate source maps, one of `external`, `inline`, or `none`. Default is `none`.

-
 verbose
 : (`bool`) Whether to enable verbose logging. Default is `false`

@@ -29,9 +29,9 @@ Here is the simplest usage:

 Pass additional arguments to `partialCached` to create variants of the cached partial. For example, if you have a complex partial that should be identical when rendered for pages within the same section, use a variant based on section so that the partial is only rendered once per section:

-{{< code file=partial-cached-example.html >}}
+```go-html-template {file="layouts/_default/baseof.html"}
 {{ partialCached "footer.html" . .Section }}
-{{< /code >}}
+```

 Pass additional arguments, of any data type, as needed to create unique variants:

@@ -21,12 +21,13 @@ Hugo publishes the resource to the target path when you call its [`Publish`], [`

 Let's say you have a CSS file that you wish to populate with values from your site configuration:

-{{< code file=assets/css/template.css lang=go-html-template >}}
+
+```go-html-template {file="assets/css/template.css"}
 body {
  background-color: {{ site.Params.style.bg_color }};
  color: {{ site.Params.style.text_color }};
 }
-{{< /code >}}
+```

 And your site configuration contains:

@@ -54,9 +55,10 @@ The example above:

 The result is:

-{{< code file=public/css/main.css >}}
+
+```css {file="public/css/main.css"}
 body {
  background-color: #fefefe;
  color: #222;
 }
-{{< /code >}}
+```
@@ -58,7 +58,7 @@ See the [configure build] documentation for details and options.
 Step 4
 : Create a PostCSS configuration file in the root of your project.

-{{< code file="postcss.config.js" copy=true >}}
+```js {file="postcss.config.js" copy=true}
 const autoprefixer = require('autoprefixer');
 const purgeCSSPlugin = require('@fullhuman/postcss-purgecss').default;

@@ -82,7 +82,7 @@ module.exports = {
    autoprefixer,
  ]
 };
-{{< /code >}}
+```

 {{< note >}}
 {{% include "/_common/functions/postcss-windows-warning.md" %}}
@@ -27,7 +27,7 @@ Since the Portable Text gets converted to Markdown before it gets passed to Hugo

 ### Content Adapter

-{{< code file=content/_content.gotmpl copy=true >}}
+```go-html-template {file="content/_content.gotmpl" copy=true}
 {{ $projectID := "mysanityprojectid" }}
 {{ $useCached := true }}
 {{ $api := "api" }}
@@ -91,14 +91,13 @@ Since the Portable Text gets converted to Markdown before it gets passed to Hugo
  }}
  {{ $.AddPage $page }}
 {{ end }}
-{{< /code >}}
-
+```

 ### Sanity setup

 Below outlines a suitable Sanity studio setup for the above example.

-{{< code file=sanity.config.ts copy=true >}}
+```ts {file="sanity.config.ts" copy=true}
 import {defineConfig} from 'sanity'
 import {structureTool} from 'sanity/structure'
 import {visionTool} from '@sanity/vision'
@@ -106,7 +105,6 @@ import {schemaTypes} from './schemaTypes'
 import {media} from 'sanity-plugin-media'
 import {codeInput} from '@sanity/code-input'

-
 export default defineConfig({
  name: 'default',
  title: 'my-sanity-project',
@@ -120,12 +118,11 @@ export default defineConfig({
    types: schemaTypes,
  },
 })
-
-{{< /code >}}
+```

 Type/schema definition:

-{{< code file=schemaTypes/postType.ts copy=true >}}
+```ts {file="schemaTypes/postType.ts" copy=true}
 import {defineField, defineType} from 'sanity'

 export const postType = defineType({
@@ -180,7 +177,7 @@ export const postType = defineType({
    }),
  ],
 })
-{{< /code >}}
+```

 Note that the above requires some additional plugins to be installed:

@@ -188,11 +185,11 @@ Note that the above requires some additional plugins to be installed:
 npm i sanity-plugin-media @sanity/code-input
 ```

-{{< code file=schemaTypes/index.ts copy=true >}}
+```ts {file="schemaTypes/index.ts" copy=true}
 import {postType} from './postType'

 export const schemaTypes = [postType]
-{{< /code >}}
+```

 ## Server setup

@@ -117,7 +117,7 @@ Create a [passthrough render hook] to capture and render the LaTeX markup.

 [passthrough render hook]: /render-hooks/passthrough/

-{{< code file=layouts/_default/_markup/render-passthrough.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-passthrough.html" copy=true}
 {{- $opts := dict "output" "htmlAndMathml" "displayMode" (eq .Type "block") }}
 {{- with try (transform.ToMath .Inner $opts) }}
  {{- with .Err }}
@@ -127,20 +127,20 @@ Create a [passthrough render hook] to capture and render the LaTeX markup.
    {{- $.Page.Store.Set "hasMath" true }}
  {{- end }}
 {{- end -}}
-{{< /code >}}
+```

 ### Step 3

 In your base template, conditionally include the KaTeX CSS within the head element.

-{{< code file=layouts/_default/baseof.html copy=true >}}
+```go-html-template {file="layouts/_default/baseof.html" copy=true}
 <head>
  {{ $noop := .WordCount }}
  {{ if .Page.Store.Get "hasMath" }}
    <link href="https://cdn.jsdelivr.net/npm/katex@0.16.21/dist/katex.min.css" rel="stylesheet">
  {{ end }}
 </head>
-{{< /code >}}
+```

 In the above, note the use of a [noop](g) statement to force content rendering before we check the value of `hasMath` with the `Store.Get` method.

@@ -148,7 +148,7 @@ In the above, note the use of a [noop](g) statement to force content rendering b

 Add some mathematical markup to your content, then test.

-{{< code file=content/example.md >}}
+```text {file="content/example.md"}
 This is an inline \(a^*=x-b^*\) equation.

 These are block equations:
@@ -156,7 +156,7 @@ These are block equations:
 \[a^*=x-b^*\]

 $$a^*=x-b^*$$
-{{< /code >}}
+```

 ## Chemistry

@@ -32,9 +32,9 @@ For example:

 When using `transform.XMLEscape` in a template rendered by Go's [html/template] package, declare the string to be safe HTML to avoid double escaping. For example, in an RSS template:

-{{< code file=layouts/_default/rss.xml >}}
+```xml {file="layouts/_default/rss.xml"}
 <description>{{ .Summary | transform.XMLEscape | safeHTML }}</description>
-{{< /code >}}
+```

 [disallowed characters]: https://www.w3.org/TR/xml/#charsets
 [html entities]: https://developer.mozilla.org/en-us/docs/glossary/entity
@@ -13,7 +13,6 @@ params:
 aliases: [/functions/relref]
 ---

-
 ## Usage

 The `relref` function takes two arguments:
@@ -26,9 +26,9 @@ To make logging in to your server more secure and less interactive, you can uplo

 First, install the ssh client. On Debian distributions, use the following command:

-{{< code file=install-openssh.sh >}}
+```sh {file="install-openssh.sh"}
 sudo apt-get install openssh-client
-{{< /code >}}
+```

 Then generate your ssh key. First, create the `.ssh` directory in your home directory if it doesn't exist:

@@ -39,7 +39,7 @@ touch amplify.yml

 Copy and paste the YAML below into the file you created. Change the application versions and time zone as needed.

-{{< code file=amplify.yml copy=true >}}
+```yaml {file="amplify.yml" copy=true}
 version: 1
 env:
  variables:
@@ -97,7 +97,7 @@ frontend:
    paths:
      - ${HUGO_CACHEDIR}/**/*
      - ${NPM_CONFIG_CACHE}/**/*
-{{< /code >}}
+```

 ### Step 3

@@ -67,7 +67,7 @@ touch .github/workflows/hugo.yaml

 Copy and paste the YAML below into the file you created. Change the branch name and Hugo version as needed.

-{{< code file=.github/workflows/hugo.yaml copy=true >}}
+```yaml {file=".github/workflows/hugo.yaml" copy=true}
 # Sample workflow for building and deploying a Hugo site to GitHub Pages
 name: Deploy Hugo site to Pages

@@ -146,7 +146,7 @@ jobs:
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v4
-{{< /code >}}
+```

 ### Step 7

@@ -21,7 +21,7 @@ The `baseURL` in your [site configuration](/configuration/) must reflect the ful

 Define your [CI/CD](https://docs.gitlab.com/ee/ci/quick_start/) jobs by creating a `.gitlab-ci.yml` file in the root of your project.

-{{< code file=.gitlab-ci.yml copy=true >}}
+```yaml {file=".gitlab-ci.yml" copy=true}
 variables:
  DART_SASS_VERSION: 1.85.0
  GIT_DEPTH: 0
@@ -63,7 +63,7 @@ pages:
      - public
  rules:
    - if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
-{{% /code %}}
+```

 ## Push your Hugo website to GitLab

@@ -111,7 +111,7 @@ In the procedure above we configured our site using the Netlify user interface.

 Create a new file named netlify.toml in the root of your project directory. In its simplest form, the configuration file might look like this:

-{{< code file=netlify.toml >}}
+```toml {file="netlify.toml"}
 [build.environment]
 HUGO_VERSION = "0.144.2"
 NODE_VERSION = "22"
@@ -120,11 +120,11 @@ TZ = "America/Los_Angeles"
 [build]
 publish = "public"
 command = "hugo --gc --minify"
-{{< /code >}}
+```

 If your site requires Dart Sass to transpile Sass to CSS, the configuration file should look something like this:

-{{< code file=netlify.toml >}}
+```toml {file="netlify.toml"}
 [build.environment]
 HUGO_VERSION = "0.144.2"
 DART_SASS_VERSION = "1.85.0"
@@ -140,4 +140,4 @@ command = """\
  export PATH=/opt/build/repo/dart-sass:$PATH && \
  hugo --gc --minify \
  """
-{{< /code >}}
+```
@@ -51,7 +51,7 @@ First, define your [build manifest] by creating a `.build.yml` file in the root

 [build manifest]: https://man.sr.ht/builds.sr.ht/#build-manifests

-{{< code file=.build.yml copy=true >}}
+```yaml {file=".build.yml" copy=true}
 image: alpine/edge
 packages:
  - hugo
@@ -66,7 +66,7 @@ tasks:
    tar -C public -cvz . > ../site.tar.gz
 - upload: |
    hut pages publish -d $site site.tar.gz
-{{% /code %}}
+```

 Now what's left is creating a repository titled `<YourUsername>.srht.site` (or your custom domain, if applicable) and pushing your local project. Here's an example using Git:

@@ -75,13 +75,13 @@ weight = 20

 With this template code:

-{{< code file=layouts/partials/menu.html >}}
+```go-html-template {file="layouts/partials/menu.html"}
 <ul>
  {{ range .Site.Menus.main }}
    <li><a href="{{ .URL }}">{{ .Name }}</a></li>
  {{ end }}
 </ul>
-{{< /code >}}
+```

 Hugo render this HTML:

@@ -96,13 +96,13 @@ In the above note that the `href` attribute of the second `anchor` element is bl

 With this template code:

-{{< code file=layouts/partials/menu.html >}}
+```go-html-template {file="layouts/partials/menu.html"}
 <ul>
  {{ range .Site.Menus.main }}
    <li><a href="{{ or .URL .PageRef }}">{{ .Name }}</a></li>
  {{ end }}
 </ul>
-{{< /code >}}
+```

 Hugo renders this HTML:

@@ -16,12 +16,12 @@ title = 'How to make spicy tuna hand rolls'
 description = 'Instructions for making spicy tuna hand rolls.'
 {{< /code-toggle >}}

-{{< code file=layouts/baseof.html >}}
+```go-html-template {file="layouts/_default/baseof.html"}
 <head>
  ...
  <meta name="description" content="{{ .Description }}">
  ...
 </head>
-{{< /code >}}
+```

 [content summary]: /content-management/summaries/
@@ -37,7 +37,7 @@ content/

 The examples below depict the result of rendering works/paintings/the-mona-lisa.md:

-{{< code file=layouts/works/single.html >}}
+```go-html-template {file="layouts/works/single.html"}
 {{ with .GetPage "starry-night" }}
  {{ .Title }} → Starry Night
 {{ end }}
@@ -61,4 +61,4 @@ The examples below depict the result of rendering works/paintings/the-mona-lisa.
 {{ with .GetPage "/works/sculptures/david" }}
  {{ .Title }} → David
 {{ end }}
-{{< /code >}}
+```
@@ -14,7 +14,7 @@ By example, let's use [Plotly] to render a chart:

 [Plotly]: https://plotly.com/javascript/

-{{< code file=contents/example.md lang=text >}}
+```text {file="content/example.md"}
 {{</* plotly */>}}
 {
  "data": [
@@ -26,21 +26,21 @@ By example, let's use [Plotly] to render a chart:
  ],
 }
 {{</* /plotly */>}}
-{{< /code >}}
+```

 The shortcode is simple:

-{{< code file=layouts/shortcodes/plotly.html >}}
+```go-html-template {file="layouts/shortcodes/plotly.html"}
 {{ $id := printf "plotly-%02d" .Ordinal }}
 <div id="{{ $id }}"></div>
 <script>
  Plotly.newPlot(document.getElementById({{ $id }}), {{ .Inner | safeJS }});
 </script>
-{{< /code >}}
+```

 Now we can selectively load the required JavaScript on pages that call the "plotly" shortcode:

-{{< code file=layouts/baseof.html >}}
+```go-html-template {file="layouts/_default/baseof.html"}
 <head>
  ...
  {{ if .HasShortcode "plotly" }}
@@ -48,4 +48,4 @@ Now we can selectively load the required JavaScript on pages that call the "plot
  {{ end }}
  ...
 </head>
-{{< /code >}}
+```
@@ -13,8 +13,6 @@ params:

 The `InSection` method on a `Page` object reports whether the given page is in the given section. Note that the method returns `true` when comparing a page to a sibling.

-
-
 With this content structure:

 ```text
@@ -12,21 +12,21 @@ params:

 This is a convenience method, useful within partial templates that are called from both [shortcodes](g) and page templates.

-{{< code file=layouts/shortcodes/foo.html >}}
+```go-html-template {file="layouts/shortcodes/foo.html"}
 {{ partial "my-partial.html" . }}
-{{< /code >}}
+```

 When the shortcode calls the partial, it passes the current [context](g) (the dot). The context includes identifiers such as `Page`, `Params`, `Inner`, and `Name`.

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ partial "my-partial.html" . }}
-{{< /code >}}
+```

 When the page template calls the partial, it also passes the current context (the dot). But in this case, the dot _is_ the `Page` object.

-{{< code file=layouts/partials/my-partial.html >}}
+```go-html-template {file="layouts/partials/my-partial.html"}
 The page title is: {{ .Page.Title }}
-{{< /code >}}
+```

 To handle both scenarios, the partial template must be able to access the `Page` object with `Page.Page`.

@@ -28,14 +28,14 @@ You can invoke pagination on the [home template], [section templates], [taxonomy
 [taxonomy templates]: /templates/types/#taxonomy
 [term templates]: /templates/types/#term

-{{< code file=layouts/_default/list.html >}}
+```go-html-template {file="layouts/_default/list.html"}
 {{ $pages := where .Site.RegularPages "Section" "articles" }}
 {{ $pages = $pages.ByTitle }}
 {{ range (.Paginate $pages 7).Pages }}
  <h2><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
 {{ end }}
 {{ template "_internal/pagination.html" . }}
-{{< /code >}}
+```

 In the example above, we:

@@ -22,12 +22,12 @@ You can invoke pagination on the [home template], [section templates], [taxonomy
 [taxonomy templates]: /templates/types/#taxonomy
 [term templates]: /templates/types/#term

-{{< code file=layouts/_default/list.html >}}
+```go-html-template {file="layouts/_default/list.html"}
 {{ range .Paginator.Pages }}
  <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
 {{ end }}
 {{ template "_internal/pagination.html" . }}
-{{< /code >}}
+```

 In the example above, the embedded pagination template creates navigation links between pagers.

@@ -15,7 +15,7 @@ Use this method in shortcode templates to compose a page from multiple content f

 For example:

-{{< code file=layouts/shortcodes/include.html >}}
+```go-html-template {file="layouts/shortcodes/include.html" copy=true}
 {{ with .Get 0 }}
  {{ with $.Page.GetPage . }}
    {{- .RenderShortcodes }}
@@ -25,15 +25,15 @@ For example:
 {{ else }}
  {{ errorf "The %q shortcode requires a positional parameter indicating the logical path of the file to include. See %s" .Name .Position }}
 {{ end }}
-{{< /code >}}
+```

 Then call the shortcode in your Markdown:

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 {{%/* include "/snippets/services" */%}}
 {{%/* include "/snippets/values" */%}}
 {{%/* include "/snippets/leadership" */%}}
-{{< /code >}}
+```

 Each of the included Markdown files can contain calls to other shortcodes.

@@ -50,7 +50,7 @@ Use the latter for the "include" shortcode described above.

 To understand what is returned by the `RenderShortcodes` method, consider this content file

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 +++
 title = 'About'
 date = 2023-10-07T12:28:33-07:00
@@ -59,7 +59,7 @@ date = 2023-10-07T12:28:33-07:00
 {{</* ref "privacy" */>}}

 An *emphasized* word.
-{{< /code >}}
+```

 With this template code:

@@ -59,7 +59,7 @@ changeFreq = 'hourly'

 And this simplistic sitemap template:

-{{< code file=layouts/_default/sitemap.xml >}}
+```xml {file="layouts/_default/sitemap.xml"}
 {{ printf "<?xml version=\"1.0\" encoding=\"utf-8\" standalone=\"yes\"?>" | safeHTML }}
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
  xmlns:xhtml="http://www.w3.org/1999/xhtml">
@@ -75,7 +75,7 @@ And this simplistic sitemap template:
    </url>
  {{ end }}
 </urlset>
-{{< /code >}}
+```

 The change frequency will be `hourly` for the news page, and `monthly` for other pages.

@@ -15,7 +15,7 @@ Based on front matter, Hugo uses several factors to identify content related to

 The argument passed to the `Related` method may be a `Page` or an options map. For example, to pass the current page:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ with .Site.RegularPages.Related . | first 5 }}
  <p>Related pages:</p>
  <ul>
@@ -24,11 +24,11 @@ The argument passed to the `Related` method may be a `Page` or an options map. F
    {{ end }}
  </ul>
 {{ end }}
-{{< /code >}}
+```

 To pass an options map:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ $opts := dict
  "document" .
  "indices" (slice "tags" "keywords")
@@ -41,7 +41,7 @@ To pass an options map:
    {{ end }}
  </ul>
 {{ end }}
-{{< /code >}}
+```

 ## Options

@@ -16,9 +16,9 @@ The `Content` method on a `Resource` object returns `template.HTML` when the res

 [resource type]: /methods/resource/resourcetype/

-{{< code file=assets/quotations/kipling.txt >}}
+```text {file="assets/quotations/kipling.txt"}
 He travels the fastest who travels alone.
-{{< /code >}}
+```

 To get the content:

@@ -37,8 +37,8 @@ content/

 With the structure above, we can range through page resources of type `page` to build content:

-{{< code file=layouts/lessons/single.html >}}
+```go-html-template {file="layouts/lessons/single.html"}
 {{ range .Resources.ByType "page" }}
  {{ .Content }}
 {{ end }}
-{{< /code >}}
+```
@@ -19,29 +19,29 @@ Some shortcodes support positional arguments, some support named arguments, and

 This shortcode call uses positional arguments:

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 {{</* myshortcode "Hello" "world" */>}}
-{{< /code >}}
+```

 To retrieve arguments by position:

-{{< code file=layouts/shortcodes/myshortcode.html >}}
+```go-html-template {file="layouts/shortcodes/myshortcode.html"}
 {{ printf "%s %s." (.Get 0) (.Get 1) }} → Hello world.
-{{< /code >}}
+```

 ## Named arguments

 This shortcode call uses named arguments:

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 {{</* myshortcode greeting="Hello" firstName="world" */>}}
-{{< /code >}}
+```

 To retrieve arguments by name:

-{{< code file=layouts/shortcodes/myshortcode.html >}}
+```go-html-template {file="layouts/shortcodes/myshortcode.html"}
 {{ printf "%s %s." (.Get "greeting") (.Get "firstName") }} → Hello world.
-{{< /code >}}
+```

 {{< note >}}
 Argument names are case-sensitive.
@@ -11,15 +11,15 @@ params:

 This content:

-{{< code file=content/services.md lang=text >}}
+```text {file="content/services.md"}
 {{</* card title="Product Design" */>}}
 We design the **best** widgets in the world.
 {{</* /card */>}}
-{{< /code >}}
+```

 With this shortcode:

-{{< code file=layouts/shortcodes/card.html >}}
+```go-html-template {file="layouts/shortcodes/card.html"}
 <div class="card">
  {{ with .Get "title" }}
    <div class="card-title">{{ . }}</div>
@@ -28,7 +28,7 @@ With this shortcode:
    {{ .Inner | strings.TrimSpace }}
  </div>
 </div>
-{{< /code >}}
+```

 Is rendered to:

@@ -57,7 +57,7 @@ Let's modify the example above to pass the value returned by `Inner` through the

 [`RenderString`]: /methods/page/renderstring/

-{{< code file=layouts/shortcodes/card.html >}}
+```go-html-template {file="layouts/shortcodes/card.html"}
 <div class="card">
  {{ with .Get "title" }}
    <div class="card-title">{{ . }}</div>
@@ -66,7 +66,7 @@ Let's modify the example above to pass the value returned by `Inner` through the
    {{ .Inner | strings.TrimSpace | .Page.RenderString }}
  </div>
 </div>
-{{< /code >}}
+```

 Hugo renders this to:

@@ -88,11 +88,11 @@ You can use the [`markdownify`] function instead of the `RenderString` method, b

 Instead of calling the shortcode with the `{{</* */>}}` notation, use the `{{%/* */%}}` notation:

-{{< code file=content/services.md lang=text >}}
+```text {file="content/services.md"}
 {{%/* card title="Product Design" */%}}
 We design the **best** widgets in the world.
 {{%/* /card */%}}
-{{< /code >}}
+```

 When you use the `{{%/* */%}}` notation, Hugo renders the entire shortcode as Markdown, requiring the following changes.

@@ -107,7 +107,7 @@ This configuration is not unsafe if _you_ control the content. Read more about H

 Second, because we are rendering the entire shortcode as Markdown, we must adhere to the rules governing [indentation] and inclusion of [raw HTML blocks] as provided in the [CommonMark] specification.

-{{< code file=layouts/shortcodes/card.html >}}
+```go-html-template {file="layouts/shortcodes/card.html"}
 <div class="card">
  {{ with .Get "title" }}
  <div class="card-title">{{ . }}</div>
@@ -117,7 +117,7 @@ Second, because we are rendering the entire shortcode as Markdown, we must adher
  {{ .Inner | strings.TrimSpace }}
  </div>
 </div>
-{{< /code >}}
+```

 The difference between this and the previous example is subtle but required. Note the change in indentation, the addition of a blank line, and removal of the `RenderString` method.

@@ -15,7 +15,7 @@ This allows us to effectively bypass the rules governing [indentation] as provid

 Consider this Markdown, an unordered list with a small gallery of thumbnail images within each list item:

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 - Gallery one

    {{</* gallery */>}}
@@ -29,17 +29,17 @@ Consider this Markdown, an unordered list with a small gallery of thumbnail imag
    ![kitten c](thumbnails/c.jpg)
    ![kitten d](thumbnails/d.jpg)
    {{</* /gallery */>}}
-{{< /code >}}
+```

 In the example above, notice that the content between the opening and closing shortcode tags is indented by four spaces. Per the CommonMark specification, this is treated as an indented code block.

 With this shortcode, calling `Inner` instead of `InnerDeindent`:

-{{< code file=layouts/shortcodes/gallery.html >}}
+```go-html-template {file="layouts/shortcodes/gallery.html"}
 <div class="gallery">
  {{ .Inner | strings.TrimSpace | .Page.RenderString }}
 </div>
-{{< /code >}}
+```

 Hugo renders the Markdown to:

@@ -66,11 +66,11 @@ Hugo renders the Markdown to:

 Although technically correct per the CommonMark specification, this is not what we want. If we remove the indentation using the `InnerDeindent` method:

-{{< code file=layouts/shortcodes/gallery.html >}}
+```go-html-template {file="layouts/shortcodes/gallery.html"}
 <div class="gallery">
  {{ .InnerDeindent | strings.TrimSpace | .Page.RenderString }}
 </div>
-{{< /code >}}
+```

 Hugo renders the Markdown to:

@@ -13,17 +13,17 @@ To support both positional and named arguments when calling a shortcode, use the

 With this shortcode template:

-{{< code file=layouts/shortcodes/myshortcode.html >}}
+```go-html-template {file="layouts/shortcodes/myshortcode.html"}
 {{ if .IsNamedParams }}
  {{ printf "%s %s." (.Get "greeting") (.Get "firstName") }}
 {{ else }}
  {{ printf "%s %s." (.Get 0) (.Get 1) }}
 {{ end }}
-{{< /code >}}
+```

 Both of these calls return the same value:

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 {{</* myshortcode greeting="Hello" firstName="world" */>}}
 {{</* myshortcode "Hello" "world" */>}}
-{{< /code >}}
+```
@@ -11,14 +11,14 @@ params:

 The `Name` method is useful for error reporting. For example, if your shortcode requires a "greeting" argument:

-{{< code file=layouts/shortcodes/myshortcode.html >}}
+```go-html-template {file="layouts/shortcodes/myshortcode.html"}
 {{ $greeting := "" }}
 {{ with .Get "greeting" }}
  {{ $greeting = . }}
 {{ else }}
  {{ errorf "The %q shortcode requires a 'greeting' argument. See %s" .Name .Position }}
 {{ end }}
-{{< /code >}}
+```

 In the absence of a "greeting" argument, Hugo will throw an error message and fail the build:

@@ -18,15 +18,15 @@ Hugo increments the ordinal with each shortcode call, regardless of the specific

 This method is useful for, among other things, assigning unique element IDs when a shortcode is called two or more times from the same page. For example:

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 {{</* img src="images/a.jpg" */>}}

 {{</* img src="images/b.jpg" */>}}
-{{< /code >}}
+```

 This shortcode performs error checking, then renders an HTML `img` element with a unique `id` attribute:

-{{< code file=layouts/shortcodes/img.html >}}
+```go-html-template {file="layouts/shortcodes/img.html"}
 {{ $src := "" }}
 {{ with .Get "src" }}
  {{ $src = . }}
@@ -39,7 +39,7 @@ This shortcode performs error checking, then renders an HTML `img` element with
 {{ else }}
  {{ errorf "The %q shortcode requires a 'src' argument. See %s" .Name .Position }}
 {{ end }}
-{{< /code >}}
+```

 Hugo renders the page to:

@@ -27,11 +27,11 @@ Calling this shortcode:

 We can access the front matter values using the `Page` method:

-{{< code file=layouts/shortcodes/book-details.html >}}
+```go-html-template {file="layouts/shortcodes/book-details.html"}
 <ul>
  <li>Title: {{ .Page.Title }}</li>
  <li>Author: {{ .Page.Params.author }}</li>
  <li>Published: {{ .Page.Params.publication_year }}</li>
  <li>ISBN: {{ .Page.Params.isbn }}</li>
 </ul>
-{{< /code >}}
+```
@@ -11,22 +11,22 @@ params:

 When you call a shortcode using positional arguments, the `Params` method returns a slice.

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 {{</* myshortcode "Hello" "world" */>}}
-{{< /code >}}
+```

-{{< code file=layouts/shortcodes/myshortcode.html >}}
+```go-html-template {file="layouts/shortcodes/myshortcode.html"}
 {{ index .Params 0 }} → Hello
 {{ index .Params 1 }} → world
-{{< /code >}}
+```

 When you call a shortcode using named arguments, the `Params` method returns a map.

-{{< code file=content/about.md lang=text >}}
+```text {file="content/about.md"}
 {{</* myshortcode greeting="Hello" name="world" */>}}
-{{< /code >}}
+```

-{{< code file=layouts/shortcodes/myshortcode.html >}}
+```go-html-template {file="layouts/shortcodes/myshortcode.html"}
 {{ .Params.greeting }} → Hello
 {{ .Params.name }} → world
-{{< /code >}}
+```
@@ -14,19 +14,19 @@ This is useful for inheritance of common shortcode arguments from the root.

 In this contrived example, the "greeting" shortcode is the parent, and the "now" shortcode is child.

-{{< code file=content/welcome.md lang=text >}}
+```text {file="content/welcome.md"}
 {{</* greeting dateFormat="Jan 2, 2006" */>}}
 Welcome. Today is {{</* now */>}}.
 {{</* /greeting */>}}
-{{< /code >}}
+```

-{{< code file=layouts/shortcodes/greeting.html >}}
+```go-html-template {file="layouts/shortcodes/greeting.html"}
 <div class="greeting">
  {{ .Inner | strings.TrimSpace | .Page.RenderString }}
 </div>
-{{< /code >}}
+```

-{{< code file=layouts/shortcodes/now.html >}}
+```go-html-template {file="layouts/shortcodes/now.html"}
 {{- $dateFormat := "January 2, 2006 15:04:05" }}

 {{- with .Params }}
@@ -42,7 +42,7 @@ Welcome. Today is {{</* now */>}}.
 {{- end }}

 {{- now | time.Format $dateFormat -}}
-{{< /code >}}
+```

 The "now" shortcode formats the current time using:

@@ -11,14 +11,14 @@ params:

 The `Position` method is useful for error reporting. For example, if your shortcode requires a "greeting" argument:

-{{< code file=layouts/shortcodes/myshortcode.html >}}
+```go-html-template {file="layouts/shortcodes/myshortcode.html"}
 {{ $greeting := "" }}
 {{ with .Get "greeting" }}
  {{ $greeting = . }}
 {{ else }}
  {{ errorf "The %q shortcode requires a 'greeting' argument. See %s" .Name .Position }}
 {{ end }}
-{{< /code >}}
+```

 In the absence of a "greeting" argument, Hugo will throw an error message and fail the build:

@@ -9,7 +9,6 @@ params:
    signatures: [SHORTCODE.Ref OPTIONS]
 ---

-
 ## Usage

 The `Ref` method accepts a single argument: an options map.
@@ -33,23 +33,23 @@ data/

 And these data files:

-{{< code file=data/books/fiction.yaml lang=yaml >}}
+```yaml {file="data/books/fiction.yaml"}
 - title: The Hunchback of Notre Dame
  author: Victor Hugo
  isbn: 978-0140443530
 - title: Les Misérables
  author: Victor Hugo
  isbn: 978-0451419439
-{{< /code >}}
+```

-{{< code file=data/books/nonfiction.yaml lang=yaml >}}
+```yaml {file="data/books/nonfiction.yaml"}
 - title: The Ancien Régime and the Revolution
  author: Alexis de Tocqueville
  isbn: 978-0141441641
 - title: Interpreting the French Revolution
  author: François Furet
  isbn: 978-0521280495
-{{< /code >}}
+```

 Access the data by [chaining](g) the [identifiers](g):

@@ -11,8 +11,6 @@ params:

 This method returns all page [kinds](g) in the current language, in the [default sort order](g). That includes the home page, section pages, taxonomy pages, term pages, and regular pages.

-
-
 In most cases you should use the [`RegularPages`] method instead.

 [`RegularPages`]: /methods/site/regularpages/
@@ -144,7 +144,7 @@ The following example displays all terms in a site's tags taxonomy:
 ```
 This example will list all taxonomies and their terms, as well as all the content assigned to each of the terms.

-{{< code file=layouts/partials/all-taxonomies.html >}}
+```go-html-template {file="layouts/partials/all-taxonomies.html"}
 {{ with .Site.Taxonomies }}
  {{ $numberOfTerms := 0 }}
  {{ range $taxonomy, $terms := . }}
@@ -175,4 +175,4 @@ This example will list all taxonomies and their terms, as well as all the conten
    </ul>
  {{ end }}
 {{ end }}
-{{< /code >}}
+```
@@ -58,15 +58,15 @@ In its default configuration, Hugo renders Markdown blockquotes according to the

 [CommonMark specification]: https://spec.commonmark.org/current/

-{{< code file=layouts/_default/_markup/render-blockquote.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-blockquote.html" copy=true}
 <blockquote>
  {{ .Text }}
 </blockquote>
-{{< /code >}}
+```

 To render a blockquote as an HTML `figure` element with an optional citation and caption:

-{{< code file=layouts/_default/_markup/render-blockquote.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-blockquote.html" copy=true}
 <figure>
  <blockquote {{ with .Attributes.cite }}cite="{{ . }}"{{ end }}>
    {{ .Text }}
@@ -77,7 +77,7 @@ To render a blockquote as an HTML `figure` element with an optional citation and
    </figcaption>
  {{ end }}
 </figure>
-{{< /code >}}
+```

 Then in your markdown:

@@ -94,7 +94,7 @@ Also known as _callouts_ or _admonitions_, alerts are blockquotes used to emphas

 With the basic Markdown syntax, the first line of each alert is an alert designator consisting of an exclamation point followed by the alert type, wrapped within brackets. For example:

-{{< code file=content/example.md lang=text >}}
+```text {file="content/example.md"}
 > [!NOTE]
 > Useful information that users should know, even when skimming content.

@@ -109,7 +109,7 @@ With the basic Markdown syntax, the first line of each alert is an alert designa

 > [!CAUTION]
 > Advises about risks or negative outcomes of certain actions.
-{{< /code >}}
+```

 The basic syntax is compatible with [GitHub], [Obsidian], and [Typora].

@@ -121,10 +121,10 @@ The basic syntax is compatible with [GitHub], [Obsidian], and [Typora].

 With the extended Markdown syntax, you may optionally include an alert sign and/or an alert title. The alert sign is one of&nbsp;`+`&nbsp;or&nbsp;`-`, typically used to indicate whether an alert is graphically foldable. For example:

-{{< code file=content/example.md lang=text >}}
+```text {file="content/example.md"}
 > [!WARNING]+ Radiation hazard
 > Do not approach or handle without protective gear.
-{{< /code >}}
+```

 The extended syntax is compatible with [Obsidian].

@@ -136,7 +136,7 @@ The extended syntax is not compatible with GitHub or Typora. If you include an a

 This blockquote render hook renders a multilingual alert if an alert designator is present, otherwise it renders a blockquote according to the CommonMark specification.

-{{< code file=layouts/_default/_markup/render-blockquote.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-blockquote.html" copy=true}
 {{ $emojis := dict
  "caution" ":exclamation:"
  "important" ":information_source:"
@@ -162,7 +162,7 @@ This blockquote render hook renders a multilingual alert if an alert designator
    {{ .Text }}
  </blockquote>
 {{ end }}
-{{< /code >}}
+```

 To override the label, create these entries in your i18n files:

@@ -10,13 +10,13 @@ keywords: []

 This Markdown example contains a fenced code block:

-{{< code file=content/example.md lang=text >}}
+````text {file="content/example.md"}
 ```bash {class="my-class" id="my-codeblock" lineNos=inline tabWidth=2}
 declare a=1
 echo "$a"
 exit
 ```
-{{< /code >}}
+````

 A fenced code block consists of:

@@ -83,10 +83,10 @@ In its default configuration, Hugo renders fenced code blocks by passing the cod

 [CommonMark specification]: https://spec.commonmark.org/current/

-{{< code file=layouts/_default/_markup/render-codeblock.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-codeblock.html" copy=true}
 {{ $result := transform.HighlightCodeBlock . }}
 {{ $result.Wrapped }}
-{{< /code >}}
+```

 Although you can use one template with conditional logic to control the behavior on a per-language basis, you can also create language-specific templates.

@@ -103,23 +103,23 @@ For example, to create a code block render hook to render [Mermaid] diagrams:

 [Mermaid]: https://mermaid.js.org/

-{{< code file=layouts/_default/_markup/render-codeblock-mermaid.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-codeblock-mermaid.html" copy=true}
 <pre class="mermaid">
  {{- .Inner | htmlEscape | safeHTML }}
 </pre>
 {{ .Page.Store.Set "hasMermaid" true }}
-{{< /code >}}
+```

 Then include this snippet at the bottom of the your base template:

-{{< code file=layouts/_default/baseof.html copy=true >}}
+```go-html-template {file="layouts/_default/baseof.html" copy=true}
 {{ if .Store.Get "hasMermaid" }}
  <script type="module">
    import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
    mermaid.initialize({ startOnLoad: true });
  </script>
 {{ end }}
-{{< /code >}}
+```

 See the [diagrams] page for details.

@@ -46,19 +46,19 @@ In its default configuration, Hugo renders Markdown headings according to the [C

 [CommonMark specification]: https://spec.commonmark.org/current/

-{{< code file=layouts/_default/_markup/render-heading.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-heading.html" copy=true}
 <h{{ .Level }} id="{{ .Anchor }}" {{- with .Attributes.class }} class="{{ . }}" {{- end }}>
  {{- .Text -}}
 </h{{ .Level }}>
-{{< /code >}}
+```

 To add an anchor link to the right of each heading:

-{{< code file=layouts/_default/_markup/render-heading.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-heading.html" copy=true}
 <h{{ .Level }} id="{{ .Anchor }}" {{- with .Attributes.class }} class="{{ . }}" {{- end }}>
  {{ .Text }}
  <a href="#{{ .Anchor }}">#</a>
 </h{{ .Level }}>
-{{< /code >}}
+```

 {{% include "/_common/render-hooks/pageinner.md" %}}
@@ -70,17 +70,17 @@ In its default configuration, Hugo renders Markdown images according to the [Com

 [CommonMark specification]: https://spec.commonmark.org/current/

-{{< code file=layouts/_default/_markup/render-image.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-image.html" copy=true}
 <img src="{{ .Destination | safeURL }}"
  {{- with .PlainText }} alt="{{ . }}"{{ end -}}
  {{- with .Title }} title="{{ . }}"{{ end -}}
 >
 {{- /* chomp trailing newline */ -}}
-{{< /code >}}
+```

 To render standalone images within `figure` elements:

-{{< code file=layouts/_default/_markup/render-image.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-image.html" copy=true}
 {{- if .IsBlock -}}
  <figure>
    <img src="{{ .Destination | safeURL }}"
@@ -94,7 +94,7 @@ To render standalone images within `figure` elements:
    {{- with .Title }} title="{{ . }}"{{ end -}}
  >
 {{- end -}}
-{{< /code >}}
+```

 Note that the above requires the following site configuration:

@@ -53,18 +53,18 @@ In its default configuration, Hugo renders Markdown links according to the [Comm

 [CommonMark specification]: https://spec.commonmark.org/current/

-{{< code file=layouts/_default/_markup/render-link.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-link.html" copy=true}
 <a href="{{ .Destination | safeURL }}"
  {{- with .Title }} title="{{ . }}"{{ end -}}
 >
  {{- with .Text }}{{ . }}{{ end -}}
 </a>
 {{- /* chomp trailing newline */ -}}
-{{< /code >}}
+```

 To include a `rel` attribute set to `external` for external links:

-{{< code file=layouts/_default/_markup/render-link.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-link.html" copy=true}
 {{- $u := urls.Parse .Destination -}}
 <a href="{{ .Destination | safeURL }}"
  {{- with .Title }} title="{{ . }}"{{ end -}}
@@ -73,7 +73,7 @@ To include a `rel` attribute set to `external` for external links:
  {{- with .Text }}{{ . }}{{ end -}}
 </a>
 {{- /* chomp trailing newline */ -}}
-{{< /code >}}
+```

 ## Default

@@ -17,7 +17,7 @@ Hugo uses [Goldmark] to render Markdown to HTML. Goldmark supports custom extens

 Depending on your choice of delimiters, Hugo will classify a passthrough element as either _block_ or _inline_. Consider this contrived example:

-{{< code file=content/sample.md >}}
+```text {file="content/example.md"}
 This is a

 \[block\]
@@ -25,7 +25,7 @@ This is a
 passthrough element with opening and closing block delimiters.

 This is an \(inline\) passthrough element with opening and closing inline delimiters.
-{{< /code >}}
+```

 Update your site configuration to enable the Passthrough extension and define opening and closing delimiters for each passthrough element type, either `block` or `inline`. For example:

@@ -86,7 +86,7 @@ Instead of client-side JavaScript rendering of mathematical markup using MathJax

 [`transform.ToMath`]: /functions/transform/tomath/

-{{< code file=layouts/_default/_markup/render-passthrough.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-passthrough.html" copy=true}
 {{- $opts := dict "output" "htmlAndMathml" "displayMode" (eq .Type "block") }}
 {{- with try (transform.ToMath .Inner $opts) }}
  {{- with .Err }}
@@ -96,18 +96,18 @@ Instead of client-side JavaScript rendering of mathematical markup using MathJax
    {{- $.Page.Store.Set "hasMath" true }}
  {{- end }}
 {{- end -}}
-{{< /code >}}
+```

 Then, in your base template, conditionally include the KaTeX CSS within the head element:

-{{< code file=layouts/_default/baseof.html copy=true >}}
+```go-html-template {file="layouts/_default/baseof.html" copy=true}
 <head>
  {{ $noop := .WordCount }}
  {{ if .Page.Store.Get "hasMath" }}
    <link href="https://cdn.jsdelivr.net/npm/katex@0.16.21/dist/katex.min.css" rel="stylesheet">
  {{ end }}
 </head>
-{{< /code >}}
+```

 In the above, note the use of a [noop](g) statement to force content rendering before we check the value of `hasMath` with the `Store.Get` method.

@@ -57,7 +57,7 @@ In its default configuration, Hugo renders Markdown tables according to the [Git

 [GitHub Flavored Markdown specification]: https://github.github.com/gfm/#tables-extension-

-{{< code file=layouts/_default/_markup/render-table.html copy=true >}}
+```go-html-template {file="layouts/_default/_markup/render-table.html" copy=true}
 <table
  {{- range $k, $v := .Attributes }}
    {{- if $v }}
@@ -95,6 +95,6 @@ In its default configuration, Hugo renders Markdown tables according to the [Git
    {{- end }}
  </tbody>
 </table>
-{{< /code >}}
+```

 {{% include "/_common/render-hooks/pageinner.md" %}}
@@ -89,12 +89,12 @@ This is some {{< highlight go "hl_inline=true, noClasses=true" >}}fmt.Println("i

 Given the verbosity of the example above, if you need to frequently highlight inline code snippets, create your own shortcode using a shorter name with preset options.

-{{< code file=layouts/shortcodes/hl.html >}}
+```go-html-template {file="layouts/shortcodes/hl.html"}
 {{ $code := .Inner | strings.TrimSpace }}
 {{ $lang := or (.Get 0) "go" }}
 {{ $opts := dict "hl_inline" true "noClasses" true }}
 {{ transform.Highlight $code $lang $opts }}
-{{< /code >}}
+```

 ```text
 This is some {{</* hl */>}}fmt.Println("inline"){{</* /hl */>}} code.
@@ -13,7 +13,7 @@ To override Hugo's embedded `param` shortcode, copy the [source code] to a file

 The `param` shortcode renders a parameter from front matter, falling back to a site parameter of the same name. The shortcode throws an error if the parameter does not exist.

-{{< code file=example.md >}}
+```text {file="content/example.md"}
 ---
 title: Example
 date: 2025-01-15T23:29:46-08:00
@@ -23,7 +23,7 @@ params:
 ---

 We found a {{%/* param "color" */%}} shirt.
-{{< /code >}}
+```

 Hugo renders this to:

@@ -60,9 +60,6 @@ Rendered:
 <a href="https://example.org/de/books/book-1/index.json">Link D</a>
 ```

-
-
-
 ## Error handling

 {{% include "_common/ref-and-relref-error-handling.md" %}}
@@ -9,7 +9,7 @@ weight: 190

 To render a 404 error page in the root of your site, create a 404 template in the root of the `layouts` directory. For example:

-{{< code file=layouts/404.html >}}
+```go-html-template {file="layouts/404.html"}
 {{ define "main" }}
  <h1>404 Not Found</h1>
  <p>The page you requested cannot be found.</p>
@@ -19,7 +19,7 @@ To render a 404 error page in the root of your site, create a 404 template in th
    </a>
  </p>
 {{ end }}
-{{< /code >}}
+```

 For multilingual sites, add the language key to the file name:

@@ -21,7 +21,7 @@ See [Template Lookup Order](/templates/lookup-order/) for details and examples.

 The following defines a simple base template at `_default/baseof.html`. As a default template, it is the shell from which all your pages will be rendered unless you specify another `*baseof.html` closer to the beginning of the lookup order.

-{{< code file=layouts/_default/baseof.html >}}
+```go-html-template {file="layouts/_default/baseof.html"}
 <!DOCTYPE html>
 <html>
  <head>
@@ -41,13 +41,13 @@ The following defines a simple base template at `_default/baseof.html`. As a def
    {{ end }}
  </body>
 </html>
-{{< /code >}}
+```

 ## Override the base template

 The default list template will inherit all of the code defined above and can then implement its own `"main"` block from:

-{{< code file=layouts/_default/list.html >}}
+```go-html-template {file="layouts/_default/list.html"}
 {{ define "main" }}
  <h1>Posts</h1>
  {{ range .Pages }}
@@ -57,7 +57,7 @@ The default list template will inherit all of the code defined above and can the
    </article>
  {{ end }}
 {{ end }}
-{{< /code >}}
+```

 This replaces the contents of our (basically empty) "main" block with something useful for the list template. In this case, we didn't define a `"title"` block, so the contents from our base template remain unchanged in lists.

@@ -75,7 +75,7 @@ Code that you put outside the block definitions *can* break your layout. This ev

 The following shows how you can override both the `"main"` and `"title"` block areas from the base template with code unique to your default [single template]:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ define "title" }}
  <!-- This will override the default value set in baseof.html; i.e., "{{ .Site.Title }}" in the original example-->
  {{ .Title }} &ndash; {{ .Site.Title }}
@@ -84,6 +84,6 @@ The following shows how you can override both the `"main"` and `"title"` block a
  <h1>{{ .Title }}</h1>
  {{ .Content }}
 {{ end }}
-{{< /code >}}
+```

 [single template]: /templates/types/#single
@@ -45,7 +45,7 @@ The following is the lookup order for content views ordered by specificity.

 In this example, `.Render` is passed into the template to call the [render function][render]. `.Render` is a special function that instructs content to render itself with the view template provided as the first argument. In this case, the template is going to render the `summary.html` view that follows:

-{{< code file=layouts/_default/list.html >}}
+```go-html-template {file="layouts/_default/list.html"}
 <main id="main">
  <div>
    <h1 id="title">{{ .Title }}</h1>
@@ -54,13 +54,13 @@ In this example, `.Render` is passed into the template to call the [render funct
    {{ end }}
  </div>
 </main>
-{{< /code >}}
+```

 ### summary.html

 Hugo passes the `Page` object to the following `summary.html` view template.

-{{< code file=layouts/_default/summary.html >}}
+```go-html-template {file="layouts/_default/summary.html"}
 <article class="post">
  <header>
    <h2><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
@@ -71,18 +71,18 @@ Hugo passes the `Page` object to the following `summary.html` view template.
  <a href='{{ .RelPermalink }}'>Read&nbsp;more&nbsp;&raquo;</a>
  </footer>
 </article>
-{{< /code >}}
+```

 ### li.html

 Continuing on the previous example, we can change our render function to use a smaller `li.html` view by changing the argument in the call to the `.Render` function (i.e., `{{ .Render "li" }}`).

-{{< code file=layouts/_default/li.html >}}
+```go-html-template {file="layouts/_default/li.html"}
 <li>
  <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
  <div class="meta">{{ .Date.Format "Mon, Jan 2, 2006" }}</div>
 </li>
-{{< /code >}}
+```

 [render]: /methods/page/render/
 [single template]: /templates/types/#single
@@ -11,14 +11,14 @@ aliases: [/layout/homepage/,/templates/homepage-template/,/templates/homepage/]

 A home page template is used to render your site's home page, and is the only template required for a single-page website. For example, the home page template below inherits the site's shell from the base template and renders the home page content, such as a list of other pages.

-{{< code file=layouts/_default/home.html >}}
+```go-html-template {file="layouts/_default/home.html"}
 {{ define "main" }}
  {{ .Content }}
  {{ range site.RegularPages }}
    <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
  {{ end }}
 {{ end }}
-{{< /code >}}
+```

 {{% include "/_common/filter-sort-group.md" %}}

@@ -48,7 +48,7 @@ params:

 The home page template below inherits the site's shell from the base template, renders the subtitle and content as defined in the&nbsp;`_index.md`&nbsp;file, then renders of list of the site's [regular pages](g).

-{{< code file=layouts/_default/home.html >}}
+```go-html-template {file="layouts/_default/home.html"}
 {{ define "main" }}
  <h3>{{ .Params.Subtitle }}</h3>
  {{ .Content }}
@@ -56,4 +56,4 @@ The home page template below inherits the site's shell from the base template, r
    <h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
  {{ end }}
 {{ end }}
-{{< /code >}}
+```
@@ -46,9 +46,9 @@ For example, a template for a single page receives a `Page` object, and the `Pag

 Within a template, the dot (`.`) represents the current context.

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 <h2>{{ .Title }}</h2>
-{{< /code >}}
+```

 In the example above the dot represents the `Page` object, and we call its [`Title`] method to return the title as defined in [front matter].

@@ -60,7 +60,7 @@ The current context may change within a template. For example, at the top of a t
 [`range`]: /functions/go-template/range/
 [`with`]: /functions/go-template/with/

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 <h2>{{ .Title }}</h2>

 {{ range slice "foo" "bar" }}
@@ -70,7 +70,7 @@ The current context may change within a template. For example, at the top of a t
 {{ with "baz" }}
  <p>{{ . }}</p>
 {{ end }}
-{{< /code >}}
+```

 In the example above, the context changes as we `range` through the [slice](g) of values. In the first iteration the context is "foo", and in the second iteration the context is "bar". Inside of the `with` block the context is "baz". Hugo renders the above to:

@@ -85,11 +85,11 @@ In the example above, the context changes as we `range` through the [slice](g) o

 Within a `range` or `with` block you can access the context passed into the template by prepending a dollar sign (`$`) to the dot:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ with "foo" }}
  <p>{{ $.Title }} - {{ . }}</p>
 {{ end }}
-{{< /code >}}
+```

 Hugo renders this to:

@@ -107,12 +107,12 @@ In the examples above the paired opening and closing braces represent the beginn

 A template action may contain literal values ([boolean](g), [string](g), [integer](g), and [float](g)), variables, functions, and methods.

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ $convertToLower := true }}
 {{ if $convertToLower }}
  <h2>{{ strings.ToLower .Title }}</h2>
 {{ end }}
-{{< /code >}}
+```

 In the example above:

@@ -134,12 +134,12 @@ Hugo renders the above to:

 Notice the blank lines and indentation in the previous example? Although irrelevant in production when you typically minify the output, you can remove the adjacent whitespace by using template action delimiters with hyphens:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{- $convertToLower := true -}}
 {{- if $convertToLower -}}
  <h2>{{ strings.ToLower .Title }}</h2>
 {{- end -}}
-{{< /code >}}
+```

 Hugo renders this to:

@@ -296,24 +296,24 @@ Chain the method to its object with a dot (`.`) as shown below, remembering that

 [current context]: #current-context

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ .Site.Title }} → My Site Title
 {{ .Page.Title }} → My Page Title
-{{< /code >}}
+```

 The context passed into most templates is a `Page` object, so this is equivalent to the previous example:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ .Site.Title }} → My Site Title
 {{ .Title }} → My Page Title
-{{< /code >}}
+```

 Some methods take an argument. Separate the argument from the method with a space. For example:

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ $page := .Page.GetPage "/books/les-miserables" }}
 {{ $page.Title }} → Les Misérables
-{{< /code >}}
+```

 ## Comments

@@ -23,7 +23,7 @@ The example below handles every combination.

 This partial template recursively "walks" a menu structure, rendering a localized, accessible nested list.

-{{< code file=layouts/partials/menu.html copy=true >}}
+```go-html-template {file="layouts/partials/menu.html" copy=true}
 {{- $page := .page }}
 {{- $menuID := .menuID }}

@@ -66,14 +66,14 @@ This partial template recursively "walks" a menu structure, rendering a localize
    </li>
  {{- end }}
 {{- end }}
-{{< /code >}}
+```

 Call the partial above, passing a menu ID and the current page in context.

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{ partial "menu.html" (dict "menuID" "main" "page" .) }}
 {{ partial "menu.html" (dict "menuID" "footer" "page" .) }}
-{{< /code >}}
+```

 ## Page references

@@ -81,7 +81,7 @@ Regardless of how you [define menu entries], an entry associated with a page has

 This simplistic example renders a page parameter named `version` next to each entry's `name`. Code defensively using `with` or `if` to handle entries where (a) the entry points to an external resource, or (b) the `version` parameter is not defined.

-{{< code file=layouts/_default/single.html >}}
+```go-html-template {file="layouts/_default/single.html"}
 {{- range site.Menus.main }}
  <a href="{{ .URL }}">
    {{ .Name }}
@@ -92,7 +92,7 @@ This simplistic example renders a page parameter named `version` next to each en
    {{- end }}
  </a>
 {{- end }}
-{{< /code >}}
+```

 ## Menu entry parameters

@@ -103,13 +103,13 @@ When you define menu entries [in site configuration] or [in front matter], you c

 This simplistic example renders a `class` attribute for each anchor element. Code defensively using `with` or `if` to handle entries where `params.class` is not defined.

-{{< code file=layouts/partials/menu.html >}}
+```go-html-template {file="layouts/partials/menu.html"}
 {{- range site.Menus.main }}
  <a {{ with .Params.class -}} class="{{ . }}" {{ end -}} href="{{ .URL }}">
    {{ .Name }}
  </a>
 {{- end }}
-{{< /code >}}
+```

 ## Localize

@@ -121,7 +121,7 @@ The `partialCached` template function provides significant performance gains for

 The following `header.html` partial template is used for [spf13.com](https://spf13.com/):

-{{< code file=layouts/partials/header.html >}}
+```go-html-template {file="layouts/partials/header.html"}
 <!DOCTYPE html>
 <html class="no-js" lang="en-US" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb#">
 <head>
@@ -136,7 +136,7 @@ The following `header.html` partial template is used for [spf13.com](https://spf

    {{ partial "head_includes.html" . }}
 </head>
-{{< /code >}}
+```

 {{< note >}}
 The `header.html` example partial was built before the introduction of block templates to Hugo. Read more on [base templates and blocks](/templates/base/) for defining the outer chrome or shell of your master templates (i.e., your site's head, header, and footer). You can even combine blocks and partials for added flexibility.
@@ -146,7 +146,7 @@ The `header.html` example partial was built before the introduction of block tem

 The following `footer.html` partial template is used for [spf13.com](https://spf13.com/):

-{{< code file=layouts/partials/footer.html >}}
+```go-html-template {file="layouts/partials/footer.html"}
 <footer>
  <div>
    <p>
@@ -156,7 +156,7 @@ The following `footer.html` partial template is used for [spf13.com](https://spf
    </p>
  </div>
 </footer>
-{{< /code >}}
+```

 [context]: /templates/introduction/
 [customize]: /hugo-modules/theme-components/
@@ -33,12 +33,12 @@ You may overwrite the internal template with a custom template. Hugo selects the

 ## robots.txt template example

-{{< code file=layouts/robots.txt >}}
+```text {file="cayouts/robots.txt"}
 User-agent: *
 {{ range .Pages }}
 Disallow: {{ .RelPermalink }}
 {{ end }}
-{{< /code >}}
+```

 This template creates a robots.txt file with a `Disallow` directive for each page on the site. Search engines that honor the Robots Exclusion Protocol will not crawl any page on the site.

--- a/Show More
+++ b/Show More