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

This commit is contained in:
Joe Mooring authored and GitHub committed 2025-03-06 02:49:11 -08:00
1 parent b23c9a583a
commit fd628be6ed
110 files changed
+483 -555

No files matched your search

+8 -8
View File
@@ -19,29 +19,29 @@ Some shortcodes support positional arguments, some support named arguments, and
This shortcode call uses positional arguments:
{{< code file=content/about.md lang=text >}}
```text {file="content/about.md"}
{{</* myshortcode "Hello" "world" */>}}
{{< /code >}}
```
To retrieve arguments by position:
{{< code file=layouts/shortcodes/myshortcode.html >}}
```go-html-template {file="layouts/shortcodes/myshortcode.html"}
{{ printf "%s %s." (.Get 0) (.Get 1) }} → Hello world.
{{< /code >}}
```
## Named arguments
This shortcode call uses named arguments:
{{< code file=content/about.md lang=text >}}
```text {file="content/about.md"}
{{</* myshortcode greeting="Hello" firstName="world" */>}}
{{< /code >}}
```
To retrieve arguments by name:
{{< code file=layouts/shortcodes/myshortcode.html >}}
```go-html-template {file="layouts/shortcodes/myshortcode.html"}
{{ printf "%s %s." (.Get "greeting") (.Get "firstName") }} → Hello world.
{{< /code >}}
```
{{< note >}}
Argument names are case-sensitive.
+10 -10
View File
@@ -11,15 +11,15 @@ params:
This content:
{{< code file=content/services.md lang=text >}}
```text {file="content/services.md"}
{{</* card title="Product Design" */>}}
We design the **best** widgets in the world.
{{</* /card */>}}
{{< /code >}}
```
With this shortcode:
{{< code file=layouts/shortcodes/card.html >}}
```go-html-template {file="layouts/shortcodes/card.html"}
<div class="card">
{{ with .Get "title" }}
<div class="card-title">{{ . }}</div>
@@ -28,7 +28,7 @@ With this shortcode:
{{ .Inner | strings.TrimSpace }}
</div>
</div>
{{< /code >}}
```
Is rendered to:
@@ -57,7 +57,7 @@ Let's modify the example above to pass the value returned by `Inner` through the
[`RenderString`]: /methods/page/renderstring/
{{< code file=layouts/shortcodes/card.html >}}
```go-html-template {file="layouts/shortcodes/card.html"}
<div class="card">
{{ with .Get "title" }}
<div class="card-title">{{ . }}</div>
@@ -66,7 +66,7 @@ Let's modify the example above to pass the value returned by `Inner` through the
{{ .Inner | strings.TrimSpace | .Page.RenderString }}
</div>
</div>
{{< /code >}}
```
Hugo renders this to:
@@ -88,11 +88,11 @@ You can use the [`markdownify`] function instead of the `RenderString` method, b
Instead of calling the shortcode with the `{{</* */>}}` notation, use the `{{%/* */%}}` notation:
{{< code file=content/services.md lang=text >}}
```text {file="content/services.md"}
{{%/* card title="Product Design" */%}}
We design the **best** widgets in the world.
{{%/* /card */%}}
{{< /code >}}
```
When you use the `{{%/* */%}}` notation, Hugo renders the entire shortcode as Markdown, requiring the following changes.
@@ -107,7 +107,7 @@ This configuration is not unsafe if _you_ control the content. Read more about H
Second, because we are rendering the entire shortcode as Markdown, we must adhere to the rules governing [indentation] and inclusion of [raw HTML blocks] as provided in the [CommonMark] specification.
{{< code file=layouts/shortcodes/card.html >}}
```go-html-template {file="layouts/shortcodes/card.html"}
<div class="card">
{{ with .Get "title" }}
<div class="card-title">{{ . }}</div>
@@ -117,7 +117,7 @@ Second, because we are rendering the entire shortcode as Markdown, we must adher
{{ .Inner | strings.TrimSpace }}
</div>
</div>
{{< /code >}}
```
The difference between this and the previous example is subtle but required. Note the change in indentation, the addition of a blank line, and removal of the `RenderString` method.
@@ -15,7 +15,7 @@ This allows us to effectively bypass the rules governing [indentation] as provid
Consider this Markdown, an unordered list with a small gallery of thumbnail images within each list item:
{{< code file=content/about.md lang=text >}}
```text {file="content/about.md"}
- Gallery one
{{</* gallery */>}}
@@ -29,17 +29,17 @@ Consider this Markdown, an unordered list with a small gallery of thumbnail imag
![kitten c](thumbnails/c.jpg)
![kitten d](thumbnails/d.jpg)
{{</* /gallery */>}}
{{< /code >}}
```
In the example above, notice that the content between the opening and closing shortcode tags is indented by four spaces. Per the CommonMark specification, this is treated as an indented code block.
With this shortcode, calling `Inner` instead of `InnerDeindent`:
{{< code file=layouts/shortcodes/gallery.html >}}
```go-html-template {file="layouts/shortcodes/gallery.html"}
<div class="gallery">
{{ .Inner | strings.TrimSpace | .Page.RenderString }}
</div>
{{< /code >}}
```
Hugo renders the Markdown to:
@@ -66,11 +66,11 @@ Hugo renders the Markdown to:
Although technically correct per the CommonMark specification, this is not what we want. If we remove the indentation using the `InnerDeindent` method:
{{< code file=layouts/shortcodes/gallery.html >}}
```go-html-template {file="layouts/shortcodes/gallery.html"}
<div class="gallery">
{{ .InnerDeindent | strings.TrimSpace | .Page.RenderString }}
</div>
{{< /code >}}
```
Hugo renders the Markdown to:
@@ -13,17 +13,17 @@ To support both positional and named arguments when calling a shortcode, use the
With this shortcode template:
{{< code file=layouts/shortcodes/myshortcode.html >}}
```go-html-template {file="layouts/shortcodes/myshortcode.html"}
{{ if .IsNamedParams }}
{{ printf "%s %s." (.Get "greeting") (.Get "firstName") }}
{{ else }}
{{ printf "%s %s." (.Get 0) (.Get 1) }}
{{ end }}
{{< /code >}}
```
Both of these calls return the same value:
{{< code file=content/about.md lang=text >}}
```text {file="content/about.md"}
{{</* myshortcode greeting="Hello" firstName="world" */>}}
{{</* myshortcode "Hello" "world" */>}}
{{< /code >}}
```
+2 -2
View File
@@ -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:
+4 -4
View File
@@ -18,15 +18,15 @@ Hugo increments the ordinal with each shortcode call, regardless of the specific
This method is useful for, among other things, assigning unique element IDs when a shortcode is called two or more times from the same page. For example:
{{< code file=content/about.md lang=text >}}
```text {file="content/about.md"}
{{</* img src="images/a.jpg" */>}}
{{</* img src="images/b.jpg" */>}}
{{< /code >}}
```
This shortcode performs error checking, then renders an HTML `img` element with a unique `id` attribute:
{{< code file=layouts/shortcodes/img.html >}}
```go-html-template {file="layouts/shortcodes/img.html"}
{{ $src := "" }}
{{ with .Get "src" }}
{{ $src = . }}
@@ -39,7 +39,7 @@ This shortcode performs error checking, then renders an HTML `img` element with
{{ else }}
{{ errorf "The %q shortcode requires a 'src' argument. See %s" .Name .Position }}
{{ end }}
{{< /code >}}
```
Hugo renders the page to:
+2 -2
View File
@@ -27,11 +27,11 @@ Calling this shortcode:
We can access the front matter values using the `Page` method:
{{< code file=layouts/shortcodes/book-details.html >}}
```go-html-template {file="layouts/shortcodes/book-details.html"}
<ul>
<li>Title: {{ .Page.Title }}</li>
<li>Author: {{ .Page.Params.author }}</li>
<li>Published: {{ .Page.Params.publication_year }}</li>
<li>ISBN: {{ .Page.Params.isbn }}</li>
</ul>
{{< /code >}}
```
+8 -8
View File
@@ -11,22 +11,22 @@ params:
When you call a shortcode using positional arguments, the `Params` method returns a slice.
{{< code file=content/about.md lang=text >}}
```text {file="content/about.md"}
{{</* myshortcode "Hello" "world" */>}}
{{< /code >}}
```
{{< code file=layouts/shortcodes/myshortcode.html >}}
```go-html-template {file="layouts/shortcodes/myshortcode.html"}
{{ index .Params 0 }} → Hello
{{ index .Params 1 }} → world
{{< /code >}}
```
When you call a shortcode using named arguments, the `Params` method returns a map.
{{< code file=content/about.md lang=text >}}
```text {file="content/about.md"}
{{</* myshortcode greeting="Hello" name="world" */>}}
{{< /code >}}
```
{{< code file=layouts/shortcodes/myshortcode.html >}}
```go-html-template {file="layouts/shortcodes/myshortcode.html"}
{{ .Params.greeting }} → Hello
{{ .Params.name }} → world
{{< /code >}}
```
+6 -6
View File
@@ -14,19 +14,19 @@ This is useful for inheritance of common shortcode arguments from the root.
In this contrived example, the "greeting" shortcode is the parent, and the "now" shortcode is child.
{{< code file=content/welcome.md lang=text >}}
```text {file="content/welcome.md"}
{{</* greeting dateFormat="Jan 2, 2006" */>}}
Welcome. Today is {{</* now */>}}.
{{</* /greeting */>}}
{{< /code >}}
```
{{< code file=layouts/shortcodes/greeting.html >}}
```go-html-template {file="layouts/shortcodes/greeting.html"}
<div class="greeting">
{{ .Inner | strings.TrimSpace | .Page.RenderString }}
</div>
{{< /code >}}
```
{{< code file=layouts/shortcodes/now.html >}}
```go-html-template {file="layouts/shortcodes/now.html"}
{{- $dateFormat := "January 2, 2006 15:04:05" }}
{{- with .Params }}
@@ -42,7 +42,7 @@ Welcome. Today is {{</* now */>}}.
{{- end }}
{{- now | time.Format $dateFormat -}}
{{< /code >}}
```
The "now" shortcode formats the current time using:
+2 -2
View File
@@ -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:
-1
View File
@@ -9,7 +9,6 @@ params:
signatures: [SHORTCODE.Ref OPTIONS]
---
## Usage
The `Ref` method accepts a single argument: an options map.