From fd628be6ed3f1150d0030ba1424cc8f2da72efbb Mon Sep 17 00:00:00 2001 From: Joe Mooring Date: Thu, 6 Mar 2025 02:49:11 -0800 Subject: [PATCH] content: Replace calls to the code shortcode with fenced code blocks --- README.md | 4 +- .../en/_common/methods/page/next-and-prev.md | 8 +- .../page/nextinsection-and-previnsection.md | 8 +- .../en/_common/methods/pages/next-and-prev.md | 12 +-- .../methods/taxonomy/get-a-taxonomy-object.md | 4 +- content/en/_common/render-hooks/pageinner.md | 8 +- content/en/configuration/cascade.md | 1 - content/en/configuration/http-cache.md | 1 - content/en/configuration/imaging.md | 1 - content/en/configuration/markup.md | 4 +- content/en/configuration/menus.md | 1 - content/en/configuration/module.md | 2 - content/en/configuration/output-formats.md | 1 - content/en/configuration/params.md | 1 - content/en/configuration/permalinks.md | 2 +- content/en/configuration/related-content.md | 4 +- content/en/configuration/services.md | 1 - content/en/content-management/archetypes.md | 4 +- .../en/content-management/build-options.md | 16 ++-- .../en/content-management/content-adapters.md | 32 ++++---- content/en/content-management/data-sources.md | 12 +-- content/en/content-management/diagrams.md | 4 +- content/en/content-management/front-matter.md | 12 +-- content/en/content-management/mathematics.md | 16 ++-- content/en/content-management/multilingual.md | 8 +- .../en/content-management/related-content.md | 4 +- content/en/content-management/sections.md | 4 +- content/en/content-management/shortcodes.md | 24 +++--- content/en/content-management/summaries.md | 12 +-- .../content-management/syntax-highlighting.md | 12 +-- content/en/content-management/urls.md | 4 +- content/en/contribute/documentation.md | 51 +++++------- content/en/functions/collections/After.md | 4 +- content/en/functions/collections/Where.md | 4 +- content/en/functions/css/PostCSS.md | 4 +- content/en/functions/css/TailwindCSS.md | 16 ++-- content/en/functions/diagrams/Goat.md | 10 +-- content/en/functions/go-template/block.md | 12 +-- content/en/functions/go-template/return.md | 16 ++-- content/en/functions/images/AutoOrient.md | 1 - content/en/functions/images/QR.md | 4 +- content/en/functions/js/Babel.md | 1 - .../en/functions/partials/IncludeCached.md | 4 +- .../functions/resources/ExecuteAsTemplate.md | 10 ++- content/en/functions/resources/PostProcess.md | 4 +- .../en/functions/transform/PortableText.md | 19 ++--- content/en/functions/transform/ToMath.md | 12 +-- content/en/functions/transform/XMLEscape.md | 4 +- content/en/functions/urls/RelRef.md | 1 - .../en/host-and-deploy/deploy-with-rsync.md | 4 +- .../host-on-aws-amplify/index.md | 4 +- .../host-on-github-pages/index.md | 4 +- .../host-and-deploy/host-on-gitlab-pages.md | 4 +- .../host-and-deploy/host-on-netlify/index.md | 8 +- .../host-on-sourcehut-pages.md | 4 +- content/en/methods/menu-entry/PageRef.md | 8 +- content/en/methods/page/Description.md | 4 +- content/en/methods/page/GetPage.md | 4 +- content/en/methods/page/HasShortcode.md | 12 +-- content/en/methods/page/InSection.md | 2 - content/en/methods/page/Page.md | 12 +-- content/en/methods/page/Paginate.md | 4 +- content/en/methods/page/Paginator.md | 4 +- content/en/methods/page/RenderShortcodes.md | 12 +-- content/en/methods/page/Sitemap.md | 4 +- content/en/methods/pages/Related.md | 8 +- content/en/methods/resource/Content.md | 4 +- content/en/methods/resource/ResourceType.md | 4 +- content/en/methods/shortcode/Get.md | 16 ++-- content/en/methods/shortcode/Inner.md | 20 ++--- content/en/methods/shortcode/InnerDeindent.md | 12 +-- content/en/methods/shortcode/IsNamedParams.md | 8 +- content/en/methods/shortcode/Name.md | 4 +- content/en/methods/shortcode/Ordinal.md | 8 +- content/en/methods/shortcode/Page.md | 4 +- content/en/methods/shortcode/Params.md | 16 ++-- content/en/methods/shortcode/Parent.md | 12 +-- content/en/methods/shortcode/Position.md | 4 +- content/en/methods/shortcode/Ref.md | 1 - content/en/methods/site/Data.md | 8 +- content/en/methods/site/Pages.md | 2 - content/en/methods/site/Taxonomies.md | 4 +- content/en/render-hooks/blockquotes.md | 20 ++--- content/en/render-hooks/code-blocks.md | 16 ++-- content/en/render-hooks/headings.md | 8 +- content/en/render-hooks/images.md | 8 +- content/en/render-hooks/links.md | 8 +- content/en/render-hooks/passthrough.md | 12 +-- content/en/render-hooks/tables.md | 4 +- content/en/shortcodes/highlight.md | 4 +- content/en/shortcodes/param.md | 4 +- content/en/shortcodes/ref.md | 3 - content/en/templates/404.md | 4 +- content/en/templates/base.md | 12 +-- content/en/templates/content-view.md | 12 +-- content/en/templates/home.md | 8 +- content/en/templates/introduction.md | 32 ++++---- content/en/templates/menu.md | 16 ++-- content/en/templates/partial.md | 8 +- content/en/templates/robots.md | 4 +- content/en/templates/section.md | 4 +- content/en/templates/shortcode.md | 81 +++++++++---------- content/en/templates/single.md | 8 +- content/en/templates/taxonomy.md | 20 ++--- content/en/templates/term.md | 8 +- content/en/templates/types.md | 48 +++++------ content/en/troubleshooting/audit/index.md | 4 +- .../_default/_markup/render-codeblock.html | 9 ++- layouts/shortcodes/code-toggle.html | 2 +- layouts/shortcodes/code.html | 38 --------- 110 files changed, 483 insertions(+), 555 deletions(-) delete mode 100644 layouts/shortcodes/code.html diff --git a/README.md b/README.md index 64ba31a48..58d0e748c 100644 --- a/README.md +++ b/README.md @@ -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. \ No newline at end of file +**Note:** We're working on removing the need to run `npm i` for local development. Stay tuned. diff --git a/content/en/_common/methods/page/next-and-prev.md b/content/en/_common/methods/page/next-and-prev.md index babc88ff4..f859961a4 100644 --- a/content/en/_common/methods/page/next-and-prev.md +++ b/content/en/_common/methods/page/next-and-prev.md @@ -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 }}

{{ .LinkTitle }}

{{ end }} -{{< /code >}} +``` -{{< code file=layouts/_default/single.html >}} +```go-html-template {file="layouts/_default/single.html"} {{ with .Prev }} Previous {{ end }} @@ -46,7 +46,7 @@ And these templates: {{ with .Next }} Next {{ end }} -{{< /code >}} +``` When you visit page-2: diff --git a/content/en/_common/methods/page/nextinsection-and-previnsection.md b/content/en/_common/methods/page/nextinsection-and-previnsection.md index 3d87a2d7a..54d240eb4 100644 --- a/content/en/_common/methods/page/nextinsection-and-previnsection.md +++ b/content/en/_common/methods/page/nextinsection-and-previnsection.md @@ -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 }}

{{ .LinkTitle }}

{{ end }} -{{< /code >}} +``` -{{< code file=layouts/_default/single.html >}} +```go-html-template {file="layouts/_default/single.html"} {{ with .PrevInSection }} Previous {{ end }} @@ -46,7 +46,7 @@ And these templates: {{ with .NextInSection }} Next {{ end }} -{{< /code >}} +``` When you visit page-2: diff --git a/content/en/_common/methods/pages/next-and-prev.md b/content/en/_common/methods/pages/next-and-prev.md index 621d6b079..462545c3f 100644 --- a/content/en/_common/methods/pages/next-and-prev.md +++ b/content/en/_common/methods/pages/next-and-prev.md @@ -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 }}

{{ .LinkTitle }}

{{ 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 . }} Next {{ 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 . }} Next {{ end }} -{{< /code >}} +``` [`Reverse`]: /methods/pages/reverse/ diff --git a/content/en/_common/methods/taxonomy/get-a-taxonomy-object.md b/content/en/_common/methods/taxonomy/get-a-taxonomy-object.md index d52f7ee4c..6fb729c17 100644 --- a/content/en/_common/methods/taxonomy/get-a-taxonomy-object.md +++ b/content/en/_common/methods/taxonomy/get-a-taxonomy-object.md @@ -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: diff --git a/content/en/_common/render-hooks/pageinner.md b/content/en/_common/render-hooks/pageinner.md index 29c7eaa2b..ecd50b8a9 100644 --- a/content/en/_common/render-hooks/pageinner.md +++ b/content/en/_common/render-hooks/pageinner.md @@ -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: diff --git a/content/en/configuration/cascade.md b/content/en/configuration/cascade.md index 403c8f2a7..04723c95a 100644 --- a/content/en/configuration/cascade.md +++ b/content/en/configuration/cascade.md @@ -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 diff --git a/content/en/configuration/http-cache.md b/content/en/configuration/http-cache.md index bbd092946..862e17ab9 100644 --- a/content/en/configuration/http-cache.md +++ b/content/en/configuration/http-cache.md @@ -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: diff --git a/content/en/configuration/imaging.md b/content/en/configuration/imaging.md index 021e82ecf..a8fc75a3a 100644 --- a/content/en/configuration/imaging.md +++ b/content/en/configuration/imaging.md @@ -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`. diff --git a/content/en/configuration/markup.md b/content/en/configuration/markup.md index 4a46e5ba0..fe8982ec3 100644 --- a/content/en/configuration/markup.md +++ b/content/en/configuration/markup.md @@ -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"} ... {{ with resources.Get "css/syntax.css" }} @@ -308,7 +308,7 @@ In your base template add a link to the CSS file: {{ end }} ... -{{< /code >}} +``` Then add the code to be highlighted to your markup: diff --git a/content/en/configuration/menus.md b/content/en/configuration/menus.md index 533ac9098..f851152a3 100644 --- a/content/en/configuration/menus.md +++ b/content/en/configuration/menus.md @@ -97,7 +97,6 @@ pageRef taxonomy|`/tags` term|`/tags/foo` - url : (`string`) The destination URL. Use this for external destinations only. diff --git a/content/en/configuration/module.md b/content/en/configuration/module.md index dca63a494..2b9add881 100644 --- a/content/en/configuration/module.md +++ b/content/en/configuration/module.md @@ -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/ diff --git a/content/en/configuration/output-formats.md b/content/en/configuration/output-formats.md index e1264e27c..53bfd5b94 100644 --- a/content/en/configuration/output-formats.md +++ b/content/en/configuration/output-formats.md @@ -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: diff --git a/content/en/configuration/params.md b/content/en/configuration/params.md index 03308e5d1..239b0c2da 100644 --- a/content/en/configuration/params.md +++ b/content/en/configuration/params.md @@ -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 }} ``` diff --git a/content/en/configuration/permalinks.md b/content/en/configuration/permalinks.md index 294b44e15..c2a50df21 100644 --- a/content/en/configuration/permalinks.md +++ b/content/en/configuration/permalinks.md @@ -154,7 +154,7 @@ public/ │ │ └── index.html │ └── index.html └── index.html -```` +``` ## Tokens diff --git a/content/en/configuration/related-content.md b/content/en/configuration/related-content.md index 230231742..18e440ffb 100644 --- a/content/en/configuration/related-content.md +++ b/content/en/configuration/related-content.md @@ -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 }}

Related content:

{{ end }} -{{< /code >}} +``` diff --git a/content/en/configuration/services.md b/content/en/configuration/services.md index 1c433449f..dbe3893a7 100644 --- a/content/en/configuration/services.md +++ b/content/en/configuration/services.md @@ -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 diff --git a/content/en/content-management/archetypes.md b/content/en/content-management/archetypes.md index 5e25b54a5..db0838504 100644 --- a/content/en/content-management/archetypes.md +++ b/content/en/content-management/archetypes.md @@ -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. diff --git a/content/en/content-management/build-options.md b/content/en/content-management/build-options.md index c003347ed..e3bdeaab8 100644 --- a/content/en/content-management/build-options.md +++ b/content/en/content-management/build-options.md @@ -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" }} {{ 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"}
{{ range .Pages }}
{{ .Title }}
{{ .Content }}
{{ end }}
-{{< /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/ diff --git a/content/en/content-management/content-adapters.md b/content/en/content-management/content-adapters.md index 1163fb75a..33200272d 100644 --- a/content/en/content-management/content-adapters.md +++ b/content/en/content-management/content-adapters.md @@ -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" }} {{ 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" }}

{{ .Title }}

@@ -269,7 +269,7 @@ Create a single template to render each book review. {{ .Content }} {{ end }} -{{< /code >}} +``` ## Multilingual sites diff --git a/content/en/content-management/data-sources.md b/content/en/content-management/data-sources.md index 586fcc9d8..b0ce08e41 100644 --- a/content/en/content-management/data-sources.md +++ b/content/en/content-management/data-sources.md @@ -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"} {{}} -{{< /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: diff --git a/content/en/content-management/diagrams.md b/content/en/content-management/diagrams.md index 4c233dbec..e90a7e213 100644 --- a/content/en/content-management/diagrams.md +++ b/content/en/content-management/diagrams.md @@ -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"}
   {{- .Inner | htmlEscape | safeHTML }}
 
{{ .Page.Store.Set "hasMermaid" true }} -{{< /code >}} +``` And then include this snippet at the _bottom_ of the content template, before the closing `body` tag: diff --git a/content/en/content-management/front-matter.md b/content/en/content-management/front-matter.md index 954364278..30110c604 100644 --- a/content/en/content-management/front-matter.md +++ b/content/en/content-management/front-matter.md @@ -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" }}

Tags

{{ 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/ diff --git a/content/en/content-management/mathematics.md b/content/en/content-management/mathematics.md index 5c9e71bd7..50f33af4e 100644 --- a/content/en/content-management/mathematics.md +++ b/content/en/content-management/mathematics.md @@ -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} -{{< /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"} ... {{ if .Param "math" }} @@ -120,7 +120,7 @@ Conditionally call the partial template from the base template. {{ end }} ... -{{< /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} -{{< /code >}} +``` The delimiters above must match the delimiters in your site configuration. diff --git a/content/en/content-management/multilingual.md b/content/en/content-management/multilingual.md index 9a5d1a0e6..745e5917b 100644 --- a/content/en/content-management/multilingual.md +++ b/content/en/content-management/multilingual.md @@ -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 }}

{{ i18n "translations" }}

{{ 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"} -{{< /code >}} +``` ## Translation of strings diff --git a/content/en/content-management/related-content.md b/content/en/content-management/related-content.md index 6552f7bb1..48fd246c4 100644 --- a/content/en/content-management/related-content.md +++ b/content/en/content-management/related-content.md @@ -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 }}

Related content:

{{ end }} -{{< /code >}} +``` The `Related` method takes one argument which may be a `Page` or an options map. The options map has these options: diff --git a/content/en/content-management/sections.md b/content/en/content-management/sections.md index 70440bde3..6fbe7aacc 100644 --- a/content/en/content-management/sections.md +++ b/content/en/content-management/sections.md @@ -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"} -{{< /code >}} +``` With this CSS: diff --git a/content/en/content-management/shortcodes.md b/content/en/content-management/shortcodes.md index 25bb95315..31e36826b 100644 --- a/content/en/content-management/shortcodes.md +++ b/content/en/content-management/shortcodes.md @@ -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") }} {{ end }} -{{< /code >}} +``` Then call the shortcode from within markup: -{{< code file=content/example.md lang=text >}} +```text {file="content/example.md"} {{}} -{{< /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 {{}} {{- now | time.Format (.Get 0) -}} {{}}. Today is {{}}. -{{< /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 */%}} {{}} ## Section 2 {{}} -{{< /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"} {{}} {{}} {{}} {{}} {{}} -{{< /code >}} +``` The [shortcode templates][nesting] section provides a detailed explanation and examples. diff --git a/content/en/content-management/summaries.md b/content/en/content-management/summaries.md index 894548f46..da61c2c8e 100644 --- a/content/en/content-management/summaries.md +++ b/content/en/content-management/summaries.md @@ -20,7 +20,7 @@ Review the [comparison table](#comparison) below to understand the characteristi Use a `` 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. 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: diff --git a/content/en/content-management/syntax-highlighting.md b/content/en/content-management/syntax-highlighting.md index 589101785..253add224 100644 --- a/content/en/content-management/syntax-highlighting.md +++ b/content/en/content-management/syntax-highlighting.md @@ -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-2 */*/%}} ``` -{{< /code >}} +```` Hugo renders this to: diff --git a/content/en/content-management/urls.md b/content/en/content-management/urls.md index f399bd6cb..8b6ab27d1 100644 --- a/content/en/content-management/urls.md +++ b/content/en/content-management/urls.md @@ -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"} @@ -247,7 +247,7 @@ The alias from the previous URL to the new URL is a client-side redirect: -{{< /code >}} +``` Collectively, the elements in the `head` section: diff --git a/content/en/contribute/documentation.md b/content/en/contribute/documentation.md index 0421991a4..d38f128cb 100644 --- a/content/en/contribute/documentation.md +++ b/content/en/contribute/documentation.md @@ -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 {{}} ``` -### Other code examples - -Use the [code shortcode] for code examples that require a file name: - -```text -{{}} -{{ range .Site.RegularPages }} -

{{ .LinkTitle }}

-{{ end }} -{{}} -``` - ## 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 -{{}} -Some code here -{{}} -``` ### 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 diff --git a/content/en/functions/collections/After.md b/content/en/functions/collections/After.md index e1553f99a..c8a822846 100644 --- a/content/en/functions/collections/After.md +++ b/content/en/functions/collections/After.md @@ -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" }}

Featured Article

@@ -61,7 +61,7 @@ You can use `after` in combination with the [`first`] function and Hugo's [power {{ end }} {{ end }} -{{< /code >}} +``` [`first`]: /functions/collections/first/ [`slice`]: /functions/collections/slice/ diff --git a/content/en/functions/collections/Where.md b/content/en/functions/collections/Where.md index 4254560eb..05dafe3c9 100644 --- a/content/en/functions/collections/Where.md +++ b/content/en/functions/collections/Where.md @@ -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: diff --git a/content/en/functions/css/PostCSS.md b/content/en/functions/css/PostCSS.md index 77432dc57..8741f7330 100644 --- a/content/en/functions/css/PostCSS.md +++ b/content/en/functions/css/PostCSS.md @@ -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" %}} diff --git a/content/en/functions/css/TailwindCSS.md b/content/en/functions/css/TailwindCSS.md index 9da079f1d..4c5bbac75 100644 --- a/content/en/functions/css/TailwindCSS.md +++ b/content/en/functions/css/TailwindCSS.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"} ... {{ partialCached "css.html" . }} ... -{{< /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 diff --git a/content/en/functions/diagrams/Goat.md b/content/en/functions/diagrams/Goat.md index 483dcb26f..6b7dc0019 100644 --- a/content/en/functions/diagrams/Goat.md +++ b/content/en/functions/diagrams/Goat.md @@ -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 }}
{{ $caption }}
-{{< /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: diff --git a/content/en/functions/go-template/block.md b/content/en/functions/go-template/block.md index c0f1c9b0c..bffab1f8c 100644 --- a/content/en/functions/go-template/block.md +++ b/content/en/functions/go-template/block.md @@ -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"}
{{ block "main" . }} @@ -31,16 +31,16 @@ The typical use is to define a set of root templates that are then customized by {{ end }}
-{{< /code >}} +``` -{{< code file=layouts/_default/single.html >}} +```go-html-template {file="layouts/_default/single.html"} {{ define "main" }}

{{ .Title }}

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

{{ .Title }}

{{ .Content }} @@ -48,6 +48,6 @@ The typical use is to define a set of root templates that are then customized by

{{ .LinkTitle }}

{{ end }} {{ end }} -{{< /code >}} +``` {{% include "/_common/functions/go-template/text-template.md" %}} diff --git a/content/en/functions/go-template/return.md b/content/en/functions/go-template/return.md index 68c9baeed..8d43d2d31 100644 --- a/content/en/functions/go-template/return.md +++ b/content/en/functions/go-template/return.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 }}

{{ . }} is even

{{ else }}

{{ . }} is odd

{{ 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 >}} +``` diff --git a/content/en/functions/images/AutoOrient.md b/content/en/functions/images/AutoOrient.md index 4a5e221a8..5af396e59 100644 --- a/content/en/functions/images/AutoOrient.md +++ b/content/en/functions/images/AutoOrient.md @@ -20,7 +20,6 @@ Create the filter: {{ $filter := images.AutoOrient }} ``` - {{% include "/_common/functions/images/apply-image-filter.md" %}} {{< note >}} diff --git a/content/en/functions/images/QR.md b/content/en/functions/images/QR.md index 6d6a5485a..a8375b904 100644 --- a/content/en/functions/images/QR.md +++ b/content/en/functions/images/QR.md @@ -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 }} {{ end }} -{{< /code >}} +``` Then hide the QR code with CSS unless printing the page: diff --git a/content/en/functions/js/Babel.md b/content/en/functions/js/Babel.md index 69bd21636..d0007aaa0 100644 --- a/content/en/functions/js/Babel.md +++ b/content/en/functions/js/Babel.md @@ -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` diff --git a/content/en/functions/partials/IncludeCached.md b/content/en/functions/partials/IncludeCached.md index 21482cd3e..01dac0b99 100644 --- a/content/en/functions/partials/IncludeCached.md +++ b/content/en/functions/partials/IncludeCached.md @@ -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: diff --git a/content/en/functions/resources/ExecuteAsTemplate.md b/content/en/functions/resources/ExecuteAsTemplate.md index 0c90a03b3..0e7d244b2 100644 --- a/content/en/functions/resources/ExecuteAsTemplate.md +++ b/content/en/functions/resources/ExecuteAsTemplate.md @@ -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 >}} +``` diff --git a/content/en/functions/resources/PostProcess.md b/content/en/functions/resources/PostProcess.md index 25be1274d..c331f76b2 100644 --- a/content/en/functions/resources/PostProcess.md +++ b/content/en/functions/resources/PostProcess.md @@ -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" %}} diff --git a/content/en/functions/transform/PortableText.md b/content/en/functions/transform/PortableText.md index db2264b1b..f501f6059 100644 --- a/content/en/functions/transform/PortableText.md +++ b/content/en/functions/transform/PortableText.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 diff --git a/content/en/functions/transform/ToMath.md b/content/en/functions/transform/ToMath.md index 6f3312e94..0661a7ec9 100644 --- a/content/en/functions/transform/ToMath.md +++ b/content/en/functions/transform/ToMath.md @@ -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} {{ $noop := .WordCount }} {{ if .Page.Store.Get "hasMath" }} {{ end }} -{{< /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 diff --git a/content/en/functions/transform/XMLEscape.md b/content/en/functions/transform/XMLEscape.md index 234dec6bb..11a5d0228 100644 --- a/content/en/functions/transform/XMLEscape.md +++ b/content/en/functions/transform/XMLEscape.md @@ -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"} {{ .Summary | transform.XMLEscape | safeHTML }} -{{< /code >}} +``` [disallowed characters]: https://www.w3.org/TR/xml/#charsets [html entities]: https://developer.mozilla.org/en-us/docs/glossary/entity diff --git a/content/en/functions/urls/RelRef.md b/content/en/functions/urls/RelRef.md index 33e25a953..aa7acf50b 100644 --- a/content/en/functions/urls/RelRef.md +++ b/content/en/functions/urls/RelRef.md @@ -13,7 +13,6 @@ params: aliases: [/functions/relref] --- - ## Usage The `relref` function takes two arguments: diff --git a/content/en/host-and-deploy/deploy-with-rsync.md b/content/en/host-and-deploy/deploy-with-rsync.md index 1c7b2fe36..d073107fe 100644 --- a/content/en/host-and-deploy/deploy-with-rsync.md +++ b/content/en/host-and-deploy/deploy-with-rsync.md @@ -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: diff --git a/content/en/host-and-deploy/host-on-aws-amplify/index.md b/content/en/host-and-deploy/host-on-aws-amplify/index.md index 234bee0b5..aadb89116 100644 --- a/content/en/host-and-deploy/host-on-aws-amplify/index.md +++ b/content/en/host-and-deploy/host-on-aws-amplify/index.md @@ -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 diff --git a/content/en/host-and-deploy/host-on-github-pages/index.md b/content/en/host-and-deploy/host-on-github-pages/index.md index 0ea777331..ded284b1e 100644 --- a/content/en/host-and-deploy/host-on-github-pages/index.md +++ b/content/en/host-and-deploy/host-on-github-pages/index.md @@ -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 diff --git a/content/en/host-and-deploy/host-on-gitlab-pages.md b/content/en/host-and-deploy/host-on-gitlab-pages.md index c6e19cbd6..b00c2108f 100644 --- a/content/en/host-and-deploy/host-on-gitlab-pages.md +++ b/content/en/host-and-deploy/host-on-gitlab-pages.md @@ -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 diff --git a/content/en/host-and-deploy/host-on-netlify/index.md b/content/en/host-and-deploy/host-on-netlify/index.md index f58c09494..f3601331a 100644 --- a/content/en/host-and-deploy/host-on-netlify/index.md +++ b/content/en/host-and-deploy/host-on-netlify/index.md @@ -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 >}} +``` diff --git a/content/en/host-and-deploy/host-on-sourcehut-pages.md b/content/en/host-and-deploy/host-on-sourcehut-pages.md index a1409dcef..6b092fbf2 100644 --- a/content/en/host-and-deploy/host-on-sourcehut-pages.md +++ b/content/en/host-and-deploy/host-on-sourcehut-pages.md @@ -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 `.srht.site` (or your custom domain, if applicable) and pushing your local project. Here's an example using Git: diff --git a/content/en/methods/menu-entry/PageRef.md b/content/en/methods/menu-entry/PageRef.md index 959433133..2680324c7 100644 --- a/content/en/methods/menu-entry/PageRef.md +++ b/content/en/methods/menu-entry/PageRef.md @@ -75,13 +75,13 @@ weight = 20 With this template code: -{{< code file=layouts/partials/menu.html >}} +```go-html-template {file="layouts/partials/menu.html"} -{{< /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"} -{{< /code >}} +``` Hugo renders this HTML: diff --git a/content/en/methods/page/Description.md b/content/en/methods/page/Description.md index f5907116f..5287aa699 100644 --- a/content/en/methods/page/Description.md +++ b/content/en/methods/page/Description.md @@ -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"} ... ... -{{< /code >}} +``` [content summary]: /content-management/summaries/ diff --git a/content/en/methods/page/GetPage.md b/content/en/methods/page/GetPage.md index 766e86e23..02f6888e0 100644 --- a/content/en/methods/page/GetPage.md +++ b/content/en/methods/page/GetPage.md @@ -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 >}} +``` diff --git a/content/en/methods/page/HasShortcode.md b/content/en/methods/page/HasShortcode.md index 3b1c3de10..6ddf69df4 100644 --- a/content/en/methods/page/HasShortcode.md +++ b/content/en/methods/page/HasShortcode.md @@ -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"} {{}} { "data": [ @@ -26,21 +26,21 @@ By example, let's use [Plotly] to render a chart: ], } {{}} -{{< /code >}} +``` The shortcode is simple: -{{< code file=layouts/shortcodes/plotly.html >}} +```go-html-template {file="layouts/shortcodes/plotly.html"} {{ $id := printf "plotly-%02d" .Ordinal }}
-{{< /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"} ... {{ if .HasShortcode "plotly" }} @@ -48,4 +48,4 @@ Now we can selectively load the required JavaScript on pages that call the "plot {{ end }} ... -{{< /code >}} +``` diff --git a/content/en/methods/page/InSection.md b/content/en/methods/page/InSection.md index c6feeb8ab..4b4cca1ad 100644 --- a/content/en/methods/page/InSection.md +++ b/content/en/methods/page/InSection.md @@ -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 diff --git a/content/en/methods/page/Page.md b/content/en/methods/page/Page.md index bbbf240a6..bdd7b5962 100644 --- a/content/en/methods/page/Page.md +++ b/content/en/methods/page/Page.md @@ -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`. diff --git a/content/en/methods/page/Paginate.md b/content/en/methods/page/Paginate.md index a43b2cb3d..fdf67ef2e 100644 --- a/content/en/methods/page/Paginate.md +++ b/content/en/methods/page/Paginate.md @@ -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 }}

{{ .Title }}

{{ end }} {{ template "_internal/pagination.html" . }} -{{< /code >}} +``` In the example above, we: diff --git a/content/en/methods/page/Paginator.md b/content/en/methods/page/Paginator.md index 8e39a9981..a97f6461c 100644 --- a/content/en/methods/page/Paginator.md +++ b/content/en/methods/page/Paginator.md @@ -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 }}

{{ .LinkTitle }}

{{ end }} {{ template "_internal/pagination.html" . }} -{{< /code >}} +``` In the example above, the embedded pagination template creates navigation links between pagers. diff --git a/content/en/methods/page/RenderShortcodes.md b/content/en/methods/page/RenderShortcodes.md index c91e9ef8d..d124606f0 100644 --- a/content/en/methods/page/RenderShortcodes.md +++ b/content/en/methods/page/RenderShortcodes.md @@ -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 {{}} An *emphasized* word. -{{< /code >}} +``` With this template code: diff --git a/content/en/methods/page/Sitemap.md b/content/en/methods/page/Sitemap.md index 772460ab3..80ad0b3b6 100644 --- a/content/en/methods/page/Sitemap.md +++ b/content/en/methods/page/Sitemap.md @@ -59,7 +59,7 @@ changeFreq = 'hourly' And this simplistic sitemap template: -{{< code file=layouts/_default/sitemap.xml >}} +```xml {file="layouts/_default/sitemap.xml"} {{ printf "" | safeHTML }} @@ -75,7 +75,7 @@ And this simplistic sitemap template: {{ end }} -{{< /code >}} +``` The change frequency will be `hourly` for the news page, and `monthly` for other pages. diff --git a/content/en/methods/pages/Related.md b/content/en/methods/pages/Related.md index f021347c6..22eeb4dfa 100644 --- a/content/en/methods/pages/Related.md +++ b/content/en/methods/pages/Related.md @@ -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 }}

Related pages:

    @@ -24,11 +24,11 @@ The argument passed to the `Related` method may be a `Page` or an options map. F {{ end }}
{{ 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 }} {{ end }} -{{< /code >}} +``` ## Options diff --git a/content/en/methods/resource/Content.md b/content/en/methods/resource/Content.md index d30b6b1b3..f2a0f235a 100644 --- a/content/en/methods/resource/Content.md +++ b/content/en/methods/resource/Content.md @@ -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: diff --git a/content/en/methods/resource/ResourceType.md b/content/en/methods/resource/ResourceType.md index 56e60856f..9ced93396 100644 --- a/content/en/methods/resource/ResourceType.md +++ b/content/en/methods/resource/ResourceType.md @@ -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 >}} +``` diff --git a/content/en/methods/shortcode/Get.md b/content/en/methods/shortcode/Get.md index 6e5297bf1..7bdecb78f 100644 --- a/content/en/methods/shortcode/Get.md +++ b/content/en/methods/shortcode/Get.md @@ -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"} {{}} -{{< /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"} {{}} -{{< /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. diff --git a/content/en/methods/shortcode/Inner.md b/content/en/methods/shortcode/Inner.md index 4f34c2f2e..8df179589 100644 --- a/content/en/methods/shortcode/Inner.md +++ b/content/en/methods/shortcode/Inner.md @@ -11,15 +11,15 @@ params: This content: -{{< code file=content/services.md lang=text >}} +```text {file="content/services.md"} {{}} We design the **best** widgets in the world. {{}} -{{< /code >}} +``` With this shortcode: -{{< code file=layouts/shortcodes/card.html >}} +```go-html-template {file="layouts/shortcodes/card.html"}
{{ with .Get "title" }}
{{ . }}
@@ -28,7 +28,7 @@ With this shortcode: {{ .Inner | strings.TrimSpace }}
-{{< /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"}
{{ with .Get "title" }}
{{ . }}
@@ -66,7 +66,7 @@ Let's modify the example above to pass the value returned by `Inner` through the {{ .Inner | strings.TrimSpace | .Page.RenderString }}
-{{< /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"}
{{ with .Get "title" }}
{{ . }}
@@ -117,7 +117,7 @@ Second, because we are rendering the entire shortcode as Markdown, we must adher {{ .Inner | strings.TrimSpace }}
-{{< /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. diff --git a/content/en/methods/shortcode/InnerDeindent.md b/content/en/methods/shortcode/InnerDeindent.md index 7faa297ca..0b8c8e2d8 100644 --- a/content/en/methods/shortcode/InnerDeindent.md +++ b/content/en/methods/shortcode/InnerDeindent.md @@ -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 {{}} @@ -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) {{}} -{{< /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"} -{{< /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"} -{{< /code >}} +``` Hugo renders the Markdown to: diff --git a/content/en/methods/shortcode/IsNamedParams.md b/content/en/methods/shortcode/IsNamedParams.md index 4d4cc5134..1e0a7f00e 100644 --- a/content/en/methods/shortcode/IsNamedParams.md +++ b/content/en/methods/shortcode/IsNamedParams.md @@ -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"} {{}} {{}} -{{< /code >}} +``` diff --git a/content/en/methods/shortcode/Name.md b/content/en/methods/shortcode/Name.md index 78ed91e69..b5f9b6c17 100644 --- a/content/en/methods/shortcode/Name.md +++ b/content/en/methods/shortcode/Name.md @@ -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: diff --git a/content/en/methods/shortcode/Ordinal.md b/content/en/methods/shortcode/Ordinal.md index fcbea1bab..605494dd5 100644 --- a/content/en/methods/shortcode/Ordinal.md +++ b/content/en/methods/shortcode/Ordinal.md @@ -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"} {{}} {{}} -{{< /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: diff --git a/content/en/methods/shortcode/Page.md b/content/en/methods/shortcode/Page.md index b5ca5d6cd..007294c8a 100644 --- a/content/en/methods/shortcode/Page.md +++ b/content/en/methods/shortcode/Page.md @@ -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"}
  • Title: {{ .Page.Title }}
  • Author: {{ .Page.Params.author }}
  • Published: {{ .Page.Params.publication_year }}
  • ISBN: {{ .Page.Params.isbn }}
-{{< /code >}} +``` diff --git a/content/en/methods/shortcode/Params.md b/content/en/methods/shortcode/Params.md index e8347e710..f001e737f 100644 --- a/content/en/methods/shortcode/Params.md +++ b/content/en/methods/shortcode/Params.md @@ -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"} {{}} -{{< /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"} {{}} -{{< /code >}} +``` -{{< code file=layouts/shortcodes/myshortcode.html >}} +```go-html-template {file="layouts/shortcodes/myshortcode.html"} {{ .Params.greeting }} → Hello {{ .Params.name }} → world -{{< /code >}} +``` diff --git a/content/en/methods/shortcode/Parent.md b/content/en/methods/shortcode/Parent.md index d18bc8139..69533e2bc 100644 --- a/content/en/methods/shortcode/Parent.md +++ b/content/en/methods/shortcode/Parent.md @@ -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"} {{}} Welcome. Today is {{}}. {{}} -{{< /code >}} +``` -{{< code file=layouts/shortcodes/greeting.html >}} +```go-html-template {file="layouts/shortcodes/greeting.html"}
{{ .Inner | strings.TrimSpace | .Page.RenderString }}
-{{< /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 {{}}. {{- end }} {{- now | time.Format $dateFormat -}} -{{< /code >}} +``` The "now" shortcode formats the current time using: diff --git a/content/en/methods/shortcode/Position.md b/content/en/methods/shortcode/Position.md index d62818189..5ee25ade4 100644 --- a/content/en/methods/shortcode/Position.md +++ b/content/en/methods/shortcode/Position.md @@ -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: diff --git a/content/en/methods/shortcode/Ref.md b/content/en/methods/shortcode/Ref.md index 6fd669a0c..3a877d568 100644 --- a/content/en/methods/shortcode/Ref.md +++ b/content/en/methods/shortcode/Ref.md @@ -9,7 +9,6 @@ params: signatures: [SHORTCODE.Ref OPTIONS] --- - ## Usage The `Ref` method accepts a single argument: an options map. diff --git a/content/en/methods/site/Data.md b/content/en/methods/site/Data.md index d65c0a0e0..e720d14e7 100644 --- a/content/en/methods/site/Data.md +++ b/content/en/methods/site/Data.md @@ -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): diff --git a/content/en/methods/site/Pages.md b/content/en/methods/site/Pages.md index a19988780..a6ba5e029 100644 --- a/content/en/methods/site/Pages.md +++ b/content/en/methods/site/Pages.md @@ -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/ diff --git a/content/en/methods/site/Taxonomies.md b/content/en/methods/site/Taxonomies.md index 5b69efff3..bb8a2d228 100644 --- a/content/en/methods/site/Taxonomies.md +++ b/content/en/methods/site/Taxonomies.md @@ -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 {{ end }} {{ end }} -{{< /code >}} +``` diff --git a/content/en/render-hooks/blockquotes.md b/content/en/render-hooks/blockquotes.md index 7b099372e..cb8d71f8b 100755 --- a/content/en/render-hooks/blockquotes.md +++ b/content/en/render-hooks/blockquotes.md @@ -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}
{{ .Text }}
-{{< /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}
{{ .Text }} @@ -77,7 +77,7 @@ To render a blockquote as an HTML `figure` element with an optional citation and {{ end }}
-{{< /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 `+` or `-`, 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 }} {{ end }} -{{< /code >}} +``` To override the label, create these entries in your i18n files: diff --git a/content/en/render-hooks/code-blocks.md b/content/en/render-hooks/code-blocks.md index 8e46532a5..56d5a7530 100755 --- a/content/en/render-hooks/code-blocks.md +++ b/content/en/render-hooks/code-blocks.md @@ -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}
   {{- .Inner | htmlEscape | safeHTML }}
 
{{ .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" }} {{ end }} -{{< /code >}} +``` See the [diagrams] page for details. diff --git a/content/en/render-hooks/headings.md b/content/en/render-hooks/headings.md index f4ded9b70..89868d478 100755 --- a/content/en/render-hooks/headings.md +++ b/content/en/render-hooks/headings.md @@ -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} {{- .Text -}} -{{< /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} {{ .Text }} # -{{< /code >}} +``` {{% include "/_common/render-hooks/pageinner.md" %}} diff --git a/content/en/render-hooks/images.md b/content/en/render-hooks/images.md index c443c38c1..bfa51c567 100755 --- a/content/en/render-hooks/images.md +++ b/content/en/render-hooks/images.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} {{ . }} {{- /* 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 -}}
{{- end -}} -{{< /code >}} +``` Note that the above requires the following site configuration: diff --git a/content/en/render-hooks/links.md b/content/en/render-hooks/links.md index cd7e043df..63fcae567 100755 --- a/content/en/render-hooks/links.md +++ b/content/en/render-hooks/links.md @@ -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} {{- with .Text }}{{ . }}{{ end -}} {{- /* 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 -}} {{- /* chomp trailing newline */ -}} -{{< /code >}} +``` ## Default diff --git a/content/en/render-hooks/passthrough.md b/content/en/render-hooks/passthrough.md index bfbf4d5fb..5e73a65b5 100755 --- a/content/en/render-hooks/passthrough.md +++ b/content/en/render-hooks/passthrough.md @@ -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} {{ $noop := .WordCount }} {{ if .Page.Store.Get "hasMath" }} {{ end }} -{{< /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. diff --git a/content/en/render-hooks/tables.md b/content/en/render-hooks/tables.md index eeda80692..c7671aff4 100755 --- a/content/en/render-hooks/tables.md +++ b/content/en/render-hooks/tables.md @@ -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}
-{{< /code >}} +``` {{% include "/_common/render-hooks/pageinner.md" %}} diff --git a/content/en/shortcodes/highlight.md b/content/en/shortcodes/highlight.md index 74d8e7d65..f4e133ad7 100755 --- a/content/en/shortcodes/highlight.md +++ b/content/en/shortcodes/highlight.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 {{}}fmt.Println("inline"){{}} code. diff --git a/content/en/shortcodes/param.md b/content/en/shortcodes/param.md index 77b8f7711..0caa33411 100755 --- a/content/en/shortcodes/param.md +++ b/content/en/shortcodes/param.md @@ -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: diff --git a/content/en/shortcodes/ref.md b/content/en/shortcodes/ref.md index de915a5ce..63ba78692 100755 --- a/content/en/shortcodes/ref.md +++ b/content/en/shortcodes/ref.md @@ -60,9 +60,6 @@ Rendered:
Link D ``` - - - ## Error handling {{% include "_common/ref-and-relref-error-handling.md" %}} diff --git a/content/en/templates/404.md b/content/en/templates/404.md index 7162378c4..1a1a3c146 100644 --- a/content/en/templates/404.md +++ b/content/en/templates/404.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" }}

404 Not Found

The page you requested cannot be found.

@@ -19,7 +19,7 @@ To render a 404 error page in the root of your site, create a 404 template in th

{{ end }} -{{< /code >}} +``` For multilingual sites, add the language key to the file name: diff --git a/content/en/templates/base.md b/content/en/templates/base.md index b4550fcd4..bf861fbab 100644 --- a/content/en/templates/base.md +++ b/content/en/templates/base.md @@ -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"} @@ -41,13 +41,13 @@ The following defines a simple base template at `_default/baseof.html`. As a def {{ end }} -{{< /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" }}

Posts

{{ range .Pages }} @@ -57,7 +57,7 @@ The default list template will inherit all of the code defined above and can the {{ 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" }} {{ .Title }} – {{ .Site.Title }} @@ -84,6 +84,6 @@ The following shows how you can override both the `"main"` and `"title"` block a

{{ .Title }}

{{ .Content }} {{ end }} -{{< /code >}} +``` [single template]: /templates/types/#single diff --git a/content/en/templates/content-view.md b/content/en/templates/content-view.md index 07b2589a4..f001e400e 100644 --- a/content/en/templates/content-view.md +++ b/content/en/templates/content-view.md @@ -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"}

{{ .Title }}

@@ -54,13 +54,13 @@ In this example, `.Render` is passed into the template to call the [render funct {{ end }}
-{{< /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"} -{{< /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"}
  • {{ .LinkTitle }}
    {{ .Date.Format "Mon, Jan 2, 2006" }}
  • -{{< /code >}} +``` [render]: /methods/page/render/ [single template]: /templates/types/#single diff --git a/content/en/templates/home.md b/content/en/templates/home.md index e50c21d73..cbb47d4aa 100644 --- a/content/en/templates/home.md +++ b/content/en/templates/home.md @@ -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 }}

    {{ .LinkTitle }}

    {{ 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 `_index.md` 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" }}

    {{ .Params.Subtitle }}

    {{ .Content }} @@ -56,4 +56,4 @@ The home page template below inherits the site's shell from the base template, r

    {{ .LinkTitle }}

    {{ end }} {{ end }} -{{< /code >}} +``` diff --git a/content/en/templates/introduction.md b/content/en/templates/introduction.md index c6e49f18b..4f4081729 100644 --- a/content/en/templates/introduction.md +++ b/content/en/templates/introduction.md @@ -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"}

    {{ .Title }}

    -{{< /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"}

    {{ .Title }}

    {{ 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" }}

    {{ . }}

    {{ 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" }}

    {{ $.Title }} - {{ . }}

    {{ 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 }}

    {{ strings.ToLower .Title }}

    {{ 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 -}}

    {{ strings.ToLower .Title }}

    {{- 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 diff --git a/content/en/templates/menu.md b/content/en/templates/menu.md index b6ec3f9bd..4ff423255 100644 --- a/content/en/templates/menu.md +++ b/content/en/templates/menu.md @@ -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 {{- 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 }} {{ .Name }} @@ -92,7 +92,7 @@ This simplistic example renders a page parameter named `version` next to each en {{- end }} {{- 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 }} {{ .Name }} {{- end }} -{{< /code >}} +``` ## Localize diff --git a/content/en/templates/partial.md b/content/en/templates/partial.md index f3322b4d2..ba63ae37f 100644 --- a/content/en/templates/partial.md +++ b/content/en/templates/partial.md @@ -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"} @@ -136,7 +136,7 @@ The following `header.html` partial template is used for [spf13.com](https://spf {{ partial "head_includes.html" . }} -{{< /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"}

    @@ -156,7 +156,7 @@ The following `footer.html` partial template is used for [spf13.com](https://spf

    -{{< /code >}} +``` [context]: /templates/introduction/ [customize]: /hugo-modules/theme-components/ diff --git a/content/en/templates/robots.md b/content/en/templates/robots.md index 7909334e2..72ddf81b6 100644 --- a/content/en/templates/robots.md +++ b/content/en/templates/robots.md @@ -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. diff --git a/content/en/templates/section.md b/content/en/templates/section.md index 8f4f5ae3b..8bc0f9dab 100644 --- a/content/en/templates/section.md +++ b/content/en/templates/section.md @@ -17,7 +17,7 @@ See [Template Lookup](/templates/lookup-order/). ## Example: creating a default section template -{{< code file=layouts/_default/section.html >}} +```go-html-template {file="layouts/_default/section.html"} {{ define "main" }}
    {{ .Content }} @@ -32,7 +32,7 @@ See [Template Lookup](/templates/lookup-order/). {{ template "_internal/pagination.html" . }}
    {{ end }} -{{< /code >}} +``` ### Example: using `.Site.GetPage` diff --git a/content/en/templates/shortcode.md b/content/en/templates/shortcode.md index 0c65c4932..a223c2e7c 100644 --- a/content/en/templates/shortcode.md +++ b/content/en/templates/shortcode.md @@ -86,15 +86,15 @@ These examples range in complexity from simple to moderately advanced, with some Create a shortcode to insert the current year: -{{< code file=layouts/shortcodes/year.html >}} +```go-html-template {file="layouts/shortcodes/year.html"} {{- now.Format "2006" -}} -{{< /code >}} +``` Then call the shortcode from within your markup: -{{< code file=content/example.md lang=text >}} +```text {file="content/example.md"} This is {{}}, and look at how far we've come. -{{< /code >}} +``` This shortcode can be used inline or as a block on its own line. If a shortcode might be used inline, remove the surrounding [whitespace] by using [template action](g) delimiters with hyphens. @@ -114,19 +114,19 @@ content/ Create a shortcode to capture an image as a page resource, resize it to the given width, convert it to the WebP format, and add an `alt` attribute: -{{< code file=layouts/shortcodes/image.html >}} +```go-html-template {file="layouts/shortcodes/image.html"} {{- with .Page.Resources.Get (.Get "path") }} {{- with .Process (printf "resize %dx wepb" ($.Get "width")) }} {{ $.Get {{- end }} {{- end -}} -{{< /code >}} +``` Then call the shortcode from within your markup: -{{< code file=content/example/index.md lang=text >}} +```text {file="content/example/index.md"} {{}} -{{< /code >}} +``` The example above uses: @@ -149,7 +149,7 @@ Read more about context in the [introduction to templating]. The previous example, while functional, silently fails if the image is missing, and does not gracefully exit if a required argument is missing. We'll add error handling to address these issues: -{{< code file=layouts/shortcodes/image.html >}} +```go-html-template {file="layouts/shortcodes/image.html"} {{ with .Get "path" }} {{- with $r := $.Page.Resources.Get ($.Get "path") }} {{- with $.Get "width" }} @@ -166,7 +166,7 @@ The previous example, while functional, silently fails if the image is missing, {{- else }} {{ errorf "The %q shortcode requires a 'path' argument: see %s" .Name .Position }} {{- end -}} -{{< /code >}} +``` This template throws an error and gracefully fails the build if the author neglected to provide a `path` or `width` argument, and it emits a warning if it cannot find the image at the specified path. If the author does not provide an `alt` argument, the `alt` attribute is set to an empty string. @@ -185,23 +185,23 @@ Shortcode arguments can be [named or positional]. We used named arguments previo [named or positional]: /content-management/shortcodes/#arguments -{{< code file=content/example/index.md lang=text >}} +```text {file="content/example/index.md"} {{}} -{{< /code >}} +``` Here's how to call it with positional arguments: -{{< code file=content/example/index.md lang=text >}} +```text {file="content/example/index.md"} {{}} -{{< /code >}} +``` Using the `Get` method with zero-indexed keys, we'll initialize variables with descriptive names in our template: -{{< code file=layouts/shortcodes/image.html >}} +```go-html-template {file="layouts/shortcodes/image.html"} {{- $path := .Get 0 }} {{- $width := .Get 1 }} {{- $alt := .Get 2 }} -{{< /code >}} +``` {{< note >}} Positional arguments work well for frequently used shortcodes with one or two arguments. Since you'll use them often, the argument order will be easy to remember. For less frequently used shortcodes, or those with more than two arguments, named arguments improve readability and reduce the chance of errors. @@ -211,11 +211,11 @@ Positional arguments work well for frequently used shortcodes with one or two ar You can create a shortcode that will accept both named and positional arguments, but not at the same time. Use the [`IsNamedParams`] method to determine whether the shortcode call used named or positional arguments: -{{< code file=layouts/shortcodes/image.html >}} +```go-html-template {file="layouts/shortcodes/image.html"} {{- $path := cond (.IsNamedParams) (.Get "path") (.Get 0) }} {{- $width := cond (.IsNamedParams) (.Get "width") (.Get 1) }} {{- $alt := cond (.IsNamedParams) (.Get "alt") (.Get 2) }} -{{< /code >}} +``` This example uses the `cond` alias for the [`compare.Conditional`] function to get the argument by name if `IsNamedParams` returns `true`, otherwise get the argument by position. @@ -230,27 +230,27 @@ Use the [`Params`] method to access the arguments as a collection. When using named arguments, the `Params` method returns a map: -{{< code file=content/example/index.md lang=text >}} +```text {file="content/example/index.md"} {{}} -{{< /code >}} +``` -{{< code file=layouts/shortcodes/image.html >}} +```go-html-template {file="layouts/shortcodes/image.html"} {{- .Params.path }} → a.jpg {{- .Params.width }} → 300 {{- .Params.alt }} → A white kitten -{{< /code >}} +``` When using positional arguments, the `Params` method returns a slice: -{{< code file=content/example/index.md lang=text >}} +```text {file="content/example/index.md"} {{}} -{{< /code >}} +``` -{{< code file=layouts/shortcodes/image.html >}} +```go-html-template {file="layouts/shortcodes/image.html"} {{- index .Params 0 }} → a.jpg {{- index .Params 1 }} → 300 {{- index .Params 1 }} → A white kitten -{{< /code >}} +``` Combine the `Params` method with the [`collections.IsSet`] function to determine if a parameter is set, even if its value is falsy. @@ -262,18 +262,18 @@ Extract the content enclosed within shortcode tags using the [`Inner`] method. T [`Inner`]: /methods/shortcode/inner/ -{{< code file=content/example.md lang=text >}} +```text {file="content/example.md"} {{}} This is a **bold** word, and this is an _emphasized_ word. {{}} -{{< /code >}} +``` -{{< code file=layouts/shortcodes/contrived.html >}} +```go-html-template {file="layouts/shortcodes/contrived.html"}

    {{ .Get "title" }}

    {{ .Inner | .Page.RenderString }}
    -{{< /code >}} +``` The preceding example called the shortcode using [standard notation], requiring us to process the inner content with the [`RenderString`] method to convert the Markdown to HTML. This conversion is unnecessary when calling a shortcode using [Markdown notation]. @@ -289,33 +289,32 @@ The [`Parent`] method provides access to the parent shortcode context when the The following example is contrived but demonstrates the concept. Assume you have a `gallery` shortcode that expects one named `class` argument: -{{< code file=layouts/shortcodes/gallery.html >}} +```go-html-template {file="layouts/shortcodes/gallery.html"}
    {{ .Inner }}
    -{{< /code >}} +``` You also have an `img` shortcode with a single named `src` argument that you want to call inside of `gallery` and other shortcodes, so that the parent defines the context of each `img`: -{{< code file=layouts/shortcodes/img.html >}} +```go-html-template {file="layouts/shortcodes/img.html"} {{ $src := .Get "src" }} {{ with .Parent }} {{ else }} {{ end }} -{{< /code >}} +``` You can then call your shortcode in your content as follows: -{{< code file=content/example.md lang=text >}} +```text {file="content/example.md"} {{}} {{}} {{}} {{}} {{}} -{{< /code >}} - +``` This will output the following HTML. Note how the first two `img` shortcodes inherit the `class` value of `content-gallery` set with the call to the parent `gallery`, whereas the third `img` only uses `src`: @@ -337,13 +336,13 @@ For guidance, consider examining Hugo's embedded shortcodes. The source code, av The [`HasShortcode`] method allows you to check if a specific shortcode has been called on a page. For example, consider a custom audio shortcode: -{{< code file=content/example.md lang=text >}} +```text {file="content/example.md"} {{}} -{{< /code >}} +``` You can use the `HasShortcode` method in your base template to conditionally load CSS if the audio shortcode was used on the page: -{{< code file=layouts/_default/baseof.html >}} +```go-html-template {file="layouts/_default/baseof.html"} ... {{ if .HasShortcode "audio" }} @@ -351,6 +350,6 @@ You can use the `HasShortcode` method in your base template to conditionally loa {{ end }} ... -{{< /code >}} +``` [`HasShortcode`]: /methods/page/hasshortcode/ diff --git a/content/en/templates/single.md b/content/en/templates/single.md index 983b0522a..6f244ef10 100644 --- a/content/en/templates/single.md +++ b/content/en/templates/single.md @@ -11,12 +11,12 @@ The single template below inherits the site's shell from the [base template]. [base template]: /templates/types/ -{{< code file=layouts/_default/single.html >}} +```go-html-template {file="layouts/_default/single.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} {{ end }} -{{< /code >}} +``` Review the [template lookup order] to select a template path that provides the desired level of specificity. @@ -24,7 +24,7 @@ Review the [template lookup order] to select a template path that provides the d The single template below inherits the site's shell from the base template, and renders the page title, creation date, content, and a list of associated terms in the "tags" taxonomy. -{{< code file=layouts/_default/single.html >}} +```go-html-template {file="layouts/_default/single.html"} {{ define "main" }}

    {{ .Title }}

    @@ -48,4 +48,4 @@ The single template below inherits the site's shell from the base template, and
    {{ end }} -{{< /code >}} +``` diff --git a/content/en/templates/taxonomy.md b/content/en/templates/taxonomy.md index 80d54a49d..96c93ec95 100644 --- a/content/en/templates/taxonomy.md +++ b/content/en/templates/taxonomy.md @@ -11,7 +11,7 @@ The [taxonomy](g) template below inherits the site's shell from the [base templa [base template]: /templates/types/ -{{< code file=layouts/_default/taxonomy.html >}} +```go-html-template {file="layouts/_default/taxonomy.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -19,7 +19,7 @@ The [taxonomy](g) template below inherits the site's shell from the [base templa

    {{ .LinkTitle }}

    {{ end }} {{ end }} -{{< /code >}} +``` Review the [template lookup order] to select a template path that provides the desired level of specificity. @@ -64,7 +64,7 @@ Once we have the `Taxonomy` object, we can call any of its [methods], allowing u The taxonomy template below inherits the site's shell from the base template, and renders a list of terms in the current taxonomy. Hugo sorts the list alphabetically by term, and displays the number of pages associated with each term. -{{< code file=layouts/_default/taxonomy.html >}} +```go-html-template {file="layouts/_default/taxonomy.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -72,13 +72,13 @@ The taxonomy template below inherits the site's shell from the base template, an

    {{ .Page.LinkTitle }} ({{ .Count }})

    {{ end }} {{ end }} -{{< /code >}} +``` ## Sort by term count The taxonomy template below inherits the site's shell from the base template, and renders a list of terms in the current taxonomy. Hugo sorts the list by the number of pages associated with each term, and displays the number of pages associated with each term. -{{< code file=layouts/_default/taxonomy.html >}} +```go-html-template {file="layouts/_default/taxonomy.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -86,7 +86,7 @@ The taxonomy template below inherits the site's shell from the base template, an

    {{ .Page.LinkTitle }} ({{ .Count }})

    {{ end }} {{ end }} -{{< /code >}} +``` ## Include content links @@ -97,7 +97,7 @@ The [`Alphabetical`] and [`ByCount`] methods used in the previous examples retur The taxonomy template below inherits the site's shell from the base template, and renders a list of terms in the current taxonomy. Hugo sorts the list by the number of pages associated with each term, displays the number of pages associated with each term, then lists the content to which each term is assigned. -{{< code file=layouts/_default/taxonomy.html >}} +```go-html-template {file="layouts/_default/taxonomy.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -110,7 +110,7 @@ The taxonomy template below inherits the site's shell from the base template, an {{ end }} {{ end }} -{{< /code >}} +``` ## Display metadata @@ -145,7 +145,7 @@ affiliation = "University of Chicago" Then create a taxonomy template specific to the "authors" taxonomy: -{{< code file=layouts/authors/taxonomy.html >}} +```go-html-template {file="layouts/authors/taxonomy.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -159,6 +159,6 @@ Then create a taxonomy template specific to the "authors" taxonomy: {{ end }} {{ end }} {{ end }} -{{< /code >}} +``` In the example above we list each author including their affiliation and portrait. diff --git a/content/en/templates/term.md b/content/en/templates/term.md index d6e11b0f7..cf1097e86 100644 --- a/content/en/templates/term.md +++ b/content/en/templates/term.md @@ -10,7 +10,7 @@ The [term](g) template below inherits the site's shell from the [base template], [base template]: /templates/types/ -{{< code file=layouts/_default/term.html >}} +```go-html-template {file="layouts/_default/term.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -18,7 +18,7 @@ The [term](g) template below inherits the site's shell from the [base template],

    {{ .LinkTitle }}

    {{ end }} {{ end }} -{{< /code >}} +``` Review the [template lookup order] to select a template path that provides the desired level of specificity. @@ -88,7 +88,7 @@ affiliation = "University of Chicago" Then create a term template specific to the "authors" taxonomy: -{{< code file=layouts/authors/term.html >}} +```go-html-template {file="layouts/authors/term.html"} {{ define "main" }}

    {{ .Title }}

    Affiliation: {{ .Params.affiliation }}

    @@ -102,6 +102,6 @@ Then create a term template specific to the "authors" taxonomy:

    {{ .LinkTitle }}

    {{ end }} {{ end }} -{{< /code >}} +``` In the example above we display the author with their affiliation and portrait, then a list of associated content. diff --git a/content/en/templates/types.md b/content/en/templates/types.md index 8dd47aca1..e623b8be2 100644 --- a/content/en/templates/types.md +++ b/content/en/templates/types.md @@ -54,7 +54,7 @@ For example, the base template below calls the [partial] function to include par [block]: /functions/go-template/block/ [partial]: /functions/partials/include/ -{{< code file=layouts/_default/baseof.html >}} +```go-html-template {file="layouts/_default/baseof.html"} @@ -72,7 +72,7 @@ For example, the base template below calls the [partial] function to include par -{{< /code >}} +``` Learn more about [base templates](/templates/base/). @@ -80,14 +80,14 @@ Learn more about [base templates](/templates/base/). 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 }}

    {{ .LinkTitle }}

    {{ end }} {{ end }} -{{< /code >}} +``` {{% include "/_common/filter-sort-group.md" %}} @@ -99,12 +99,12 @@ A single template renders a single page. For example, the single template below inherits the site's shell from the base template, and renders the title and content of each page. -{{< code file=layouts/_default/single.html >}} +```go-html-template {file="layouts/_default/single.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} {{ end }} -{{< /code >}} +``` Learn more about [single templates](/templates/single/). @@ -114,7 +114,7 @@ A section template typically renders a list of pages within a section. For example, the section template below inherits the site's shell from the base template, and renders a list of pages in the current section. -{{< code file=layouts/_default/section.html >}} +```go-html-template {file="layouts/_default/section.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -122,7 +122,7 @@ For example, the section template below inherits the site's shell from the base

    {{ .LinkTitle }}

    {{ end }} {{ end }} -{{< /code >}} +``` {{% include "/_common/filter-sort-group.md" %}} @@ -134,7 +134,7 @@ A taxonomy template renders a list of terms in a [taxonomy](g). For example, the taxonomy template below inherits the site's shell from the base template, and renders a list of terms in the current taxonomy. -{{< code file=layouts/_default/taxonomy.html >}} +```go-html-template {file="layouts/_default/taxonomy.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -142,7 +142,7 @@ For example, the taxonomy template below inherits the site's shell from the base

    {{ .LinkTitle }}

    {{ end }} {{ end }} -{{< /code >}} +``` {{% include "/_common/filter-sort-group.md" %}} @@ -154,7 +154,7 @@ A term template renders a list of pages associated with a [term](g). For example, the term template below inherits the site's shell from the base template, and renders a list of pages associated with the current term. -{{< code file=layouts/_default/term.html >}} +```go-html-template {file="layouts/_default/term.html"} {{ define "main" }}

    {{ .Title }}

    {{ .Content }} @@ -162,7 +162,7 @@ For example, the term template below inherits the site's shell from the base tem

    {{ .LinkTitle }}

    {{ end }} {{ end }} -{{< /code >}} +``` {{% include "/_common/filter-sort-group.md" %}} @@ -180,9 +180,9 @@ Unlike other template types, you cannot create partial templates to target a par For example, the partial template below renders copyright information. -{{< code file=layouts/partials/footer.html >}} +```go-html-template {file="layouts/partials/footer.html"}

    Copyright {{ now.Year }}. All rights reserved.

    -{{< /code >}} +``` Learn more about [partial templates](/templates/partial/). @@ -197,7 +197,7 @@ A content view template is similar to a partial template, invoked by calling the For example, the home template below inherits the site's shell from the base template, and renders a card component for each page within the "articles" section of your site. -{{< code file=layouts/_default/home.html >}} +```go-html-template {file="layouts/_default/home.html"} {{ define "main" }} {{ .Content }}
      @@ -206,14 +206,14 @@ For example, the home template below inherits the site's shell from the base tem {{ end }}
    {{ end }} -{{< /code >}} +``` -{{< code file=layouts/articles/card.html >}} +```go-html-template {file="layouts/articles/card.html"}

    {{ .LinkTitle }}

    {{ .Summary }}
    -{{< /code >}} +``` Learn more about [content view templates](/templates/content-view/). @@ -223,7 +223,7 @@ A render hook template overrides the conversion of Markdown to HTML. For example, the render hook template below adds a `rel` attribute to external links. -{{< code file=layouts/_default/_markup/render-link.html >}} +```go-html-template {file="layouts/_default/_markup/render-link.html"} {{- $u := urls.Parse .Destination -}} {{- /* chomp trailing newline */ -}} -{{< /code >}} +``` Learn more about [render hook templates](/render-hooks/). @@ -242,17 +242,17 @@ A shortcode template is used to render a component of your site. Unlike partial For example, the shortcode template below renders an audio element from a [global resource](g). -{{< code file=layouts/shortcodes/audio.html >}} +```go-html-template {file="layouts/shortcodes/audio.html"} {{ with resources.Get (.Get "src") }} {{ end }} -{{< /code >}} +``` Then call the shortcode from within markup: -{{< code file=content/example.md lang=text >}} +```text {file="content/example.md"} {{}} -{{< /code >}} +``` Learn more about [shortcode templates](/templates/shortcode/). diff --git a/content/en/troubleshooting/audit/index.md b/content/en/troubleshooting/audit/index.md index 40deb6615..2efad55e3 100644 --- a/content/en/troubleshooting/audit/index.md +++ b/content/en/troubleshooting/audit/index.md @@ -8,9 +8,9 @@ keywords: [] There are several conditions that can produce errors in your published site which are not detected during the build. Run this audit before your final build. -{{< code copy=true >}} +```text {copy=true} HUGO_MINIFY_TDEWOLFF_HTML_KEEPCOMMENTS=true HUGO_ENABLEMISSINGTRANSLATIONPLACEHOLDERS=true hugo && grep -inorE "<\!-- raw HTML omitted -->|ZgotmplZ|\[i18n\]|\(\)|(<nil>)|hahahugo" public/ -{{< /code >}} +``` _Tested with GNU Bash 5.1 and GNU grep 3.7._ diff --git a/layouts/_default/_markup/render-codeblock.html b/layouts/_default/_markup/render-codeblock.html index cb0938a25..8afc5b076 100644 --- a/layouts/_default/_markup/render-codeblock.html +++ b/layouts/_default/_markup/render-codeblock.html @@ -16,7 +16,7 @@ may also specify the following parameters: fmt.Println("Hello world!") ``` - ```go {linenos=true copy=true file="layouts/index.html"} + ```go {linenos=true file="layouts/index.html" copy=true} fmt.Println("Hello world!") ``` */}} @@ -26,9 +26,12 @@ may also specify the following parameters: {{- $file := or .Attributes.file "" }} {{- $ext := strings.TrimPrefix "." (path.Ext $file) }} {{- $lang := or .Type $ext "text" }} -{{- if eq $lang "html" }} +{{- if in (slice "html" "gotmpl") $lang }} {{- $lang = "go-html-template" }} {{- end }} +{{- if eq $lang "md" }} + {{- $lang = "text" }} +{{- end }} {{- with .Attributes.copy }} {{- if in (slice true "true" 1) . }} @@ -46,7 +49,7 @@ may also specify the following parameters: {{- if $copy }} {{- $fileSelectClass = "select-text" }} diff --git a/layouts/shortcodes/code-toggle.html b/layouts/shortcodes/code-toggle.html index 1b2c82df9..a22c378be 100644 --- a/layouts/shortcodes/code-toggle.html +++ b/layouts/shortcodes/code-toggle.html @@ -72,7 +72,7 @@ Renders syntax-highlighted configuration data in JSON, TOML, and YAML formats.
    {{- if $copy }} diff --git a/layouts/shortcodes/code.html b/layouts/shortcodes/code.html deleted file mode 100644 index ae50aa2f0..000000000 --- a/layouts/shortcodes/code.html +++ /dev/null @@ -1,38 +0,0 @@ -{{- $codeLang := or (.Get "lang") "" }} -
    - {{ if (.Get "copy") }} - - - - {{ end }} - {{- with .Get "file" -}} - {{- if not $codeLang }} - {{- $ext := strings.TrimPrefix "." (path.Ext .) }} - {{- $codeLang = cond (eq $ext "html") "go-html-template" $ext }} - {{- end }} -
    - {{ . }} -
    - {{- end -}} - - -
    - {{ $inner := trim .Inner "\n" | safeHTML }} - {{ if .Get "nocode" }} - {{ $inner }} - {{ else }} - {{ with $codeLang }} - {{ highlight $inner . "" }} - {{ else }} -
    {{ $inner }}
    -        
    - {{ end }} - {{ end }} -
    -