mirror/hugo
1
0
Fork 0
mirror of https://github.com/gohugoio/hugo.git synced 2025-08-16 20:53:59 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge commit '346b60358dd8ec2ca228e6635bff9d7914b398b7'

Browse Source
This commit is contained in:
Bjørn Erik Pedersen
2025-01-23 09:47:46 +01:00
parent 7f0f50b133 346b60358d
commit 43307b07f8
384 changed files with 3305 additions and 3271 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
docs/content/en/shortcodes/_index.md Normal file
View File

@@ -0,0 +1,16 @@
---
title: Shortcodes
linkTitle: In this section
description: Insert elements such as videos, images, and social media embeds into your content using Hugo's embedded shortcodes.
categories: []
keywords: []
menu:
docs:
identifier: shortcodes-in-this-section
parent: shortcodes
weight: 10
weight: 10
showSectionMenu: true
---
Insert elements such as videos, images, and social media embeds into your content using Hugo's embedded shortcodes.

39
docs/content/en/shortcodes/comment.md Executable file
View File

@@ -0,0 +1,39 @@
---
title: Comment
description: Include hidden comments in your content with the comment shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
identifier: shortcodes-comment
parent: shortcodes
weight:
weight:
expiryDate: 2025-01-22 # with v0.142.0 and later use HTML comments instead
---
{{% note %}}
To override Hugo's embedded `comment` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl comment %}}
{{% /note %}}
{{< new-in "0.137.1" >}}
Use the `comment` shortcode to include comments in your content. Hugo will ignore the text within these comments when rendering your site.
Use it inline:
```text
{{%/* comment */%}} rewrite the paragraph below {{%/* /comment */%}}
```
Or as a block comment:
```text
{{%/* comment */%}}
rewrite the paragraph below
{{%/* /comment */%}}
```
Although you can call this shortcode using the `{{</* */>}}` notation, computationally it is more efficient to call it using the `{{%/* */%}}` notation as shown above.

80
docs/content/en/shortcodes/details.md Executable file
View File

@@ -0,0 +1,80 @@
---
title: Details
description: Insert an HTML details element into your content using the details shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
toc: true
---
{{< new-in 0.140.0 >}}
{{% note %}}
To override Hugo's embedded `details` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl details %}}
{{% /note %}}
## Example
With this markup:
```text
{{</* details summary="See the details" */>}}
This is a **bold** word.
{{</* /details */>}}
```
Hugo renders this HTML:
```html
<details>
<summary>See the details</summary>
<p>This is a <strong>bold</strong> word.</p>
</details>
```
Which looks like this in your browser:
{{< details summary="See the details" >}}
This is a **bold** word.
{{< /details >}}
## Parameters
summary
: (`string`) The content of the child `summary` element rendered from Markdown to HTML. Default is `Details`.
open
: (`bool`) Whether to initially display the content of the `details` element. Default is `false`.
class
: (`string`) The `class` attribute of the `details` element.
name
: (`string`) The `name` attribute of the `details` element.
title
: (`string`) The `title` attribute of the `details` element.
## Styling
Use CSS to style the `details` element, the `summary` element, and the content itself.
```css
/* target the details element */
details { }
/* target the summary element */
details > summary { }
/* target the children of the summary element */
details > summary > * { }
/* target the content */
details > :not(summary) { }
```

115
docs/content/en/shortcodes/figure.md Executable file
View File

@@ -0,0 +1,115 @@
---
title: Figure
description: Insert an HTML figure element into your content using the figure shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
toc: true
---
{{% note %}}
To override Hugo's embedded `figure` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl figure %}}
{{% /note %}}
## Example
With this markup:
```text
{{</* figure
src="/images/examples/zion-national-park.jpg"
alt="A photograph of Zion National Park"
link="https://www.nps.gov/zion/index.htm"
caption="Zion National Park"
class="ma0 w-75"
*/>}}
```
Hugo renders this HTML:
```html
<figure class="ma0 w-75">
<a href="https://www.nps.gov/zion/index.htm">
<img
src="/images/examples/zion-national-park.jpg"
alt="A photograph of Zion National Park"
>
</a>
<figcaption>
<p>Zion National Park</p>
</figcaption>
</figure>
```
Which looks like this in your browser:
{{< figure
src="/images/examples/zion-national-park.jpg"
alt="A photograph of Zion National Park"
link="https://www.nps.gov/zion/index.htm"
caption="Zion National Park"
class="ma0 w-75"
>}}
## Parameters
src
: (`string`) The `src` attribute of the `img` element. Typically this is a [page resource](g) or a [global resource](g).
alt
: (`string`) The `alt` attribute of the `img` element.
width
: (`int`) The `width` attribute of the `img` element.
height
: (`int`) The `height` attribute of the `img` element.
loading
: (`string`) The `loading` attribute of the `img` element.
class
: (`string`) The `class` attribute of the `figure` element.
link
: (`string`) The `href` attribute of the anchor element that wraps the `img` element.
target
: (`string`) The `target` attribute of the anchor element that wraps the `img` element.
rel
: (`rel`) The `rel` attribute of the anchor element that wraps the `img` element.
title
: (`string`) Within the `figurecaption` element, the title is at the top, wrapped within an `h4` element.
caption
: (`string`) Within the `figurecaption` element, the caption is at the bottom and may contain plain text or markdown.
attr
: (`string`) Within the `figurecaption` element, the attribution appears next to the caption and may contain plain text or markdown.
attrlink
: (`string`) The `href` attribute of the anchor element that wraps the attribution.
## Image location
The `figure` shortcode resolves internal Markdown destinations by looking for a matching [page resource](g), falling back to a matching [global resource](g). Remote destinations are passed through, and the render hook will not throw an error or warning if unable to resolve a destination.
You must place global resources in the `assets` directory. If you have placed your resources in the `static` directory, and you are unable or unwilling to move them, you must mount the `static` directory to the `assets` directory by including both of these entries in your site configuration:
{{< code-toggle file=hugo >}}
[[module.mounts]]
source = 'assets'
target = 'assets'
[[module.mounts]]
source = 'static'
target = 'assets'
{{< /code-toggle >}}

41
docs/content/en/shortcodes/gist.md Executable file
View File

@@ -0,0 +1,41 @@
---
title: Gist
description: Embed a GitHub Gist in your content using the gist shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
---
{{% note %}}
To override Hugo's embedded `gist` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl gist %}}
{{% /note %}}
To display a GitHub gist with this URL:
```text
https://gist.github.com/user/50a7482715eac222e230d1e64dd9a89b
```
Include this in your Markdown:
```text
{{</* gist user 23932424365401ffa5e9d9810102a477 */>}}
```
This will display all files in the gist alphabetically by file name.
{{< gist jmooring 23932424365401ffa5e9d9810102a477 >}}
To display a specific file within the gist:
```text
{{</* gist user 23932424365401ffa5e9d9810102a477 list.html */>}}
```
{{< gist jmooring 23932424365401ffa5e9d9810102a477 list.html >}}

117
docs/content/en/shortcodes/highlight.md Executable file
View File

@@ -0,0 +1,117 @@
---
title: Highlight
description: Insert syntax-highlighted code into your content using the highlight shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
toc: true
---
{{% note %}}
To override Hugo's embedded `highlight` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl highlight %}}
{{% /note %}}
{{% note %}}
With the Markdown [content format], the `highlight` shortcode is rarely needed because, by default, Hugo automatically applies syntax highlighting to fenced code blocks.
The primary use case for the `highlight` shortcode in Markdown is to apply syntax highlighting to inline code snippets.
[content format]: /content-management/formats/
{{% /note %}}
The `highlight` shortcode calls the [`transform.Highlight`] function which uses the [Chroma] syntax highlighter, supporting over 200 languages with more than 40 [available styles].
[chroma]: https://github.com/alecthomas/chroma
[available styles]: https://xyproto.github.io/splash/docs/
[`transform.Highlight`]: /functions/transform/highlight/
## Arguments
The `highlight` shortcode takes three arguments.
```text
{{</* highlight LANG OPTIONS */>}}
CODE
{{</* /highlight */>}}
```
CODE
: (`string`) The code to highlight.
LANG
: (`string`) The language of the code to highlight. Choose from one of the [supported languages]. This value is case-insensitive.
OPTIONS
: (`string`) Zero or more space-separated key-value pairs wrapped in quotation marks. Set default values for each option in your [site configuration]. The key names are case-insensitive.
[site configuration]: /getting-started/configuration-markup#highlight
[supported languages]: /content-management/syntax-highlighting/#list-of-chroma-highlighting-languages
## Example
```text
{{</* highlight go "linenos=inline, hl_Lines=3 6-8, style=emacs" */>}}
package main
import "fmt"
func main() {
for i := 0; i < 3; i++ {
fmt.Println("Value of i:", i)
}
}
{{</* /highlight */>}}
```
Hugo renders this to:
{{< highlight go "linenos=inline, hl_Lines=3 6-8, noClasses=true" >}}
package main
import "fmt"
func main() {
for i := 0; i < 3; i++ {
fmt.Println("Value of i:", i)
}
}
{{< /highlight >}}
You can also use the `highlight` shortcode for inline code snippets:
```text
This is some {{</* highlight go "hl_inline=true" */>}}fmt.Println("inline"){{</* /highlight */>}} code.
```
Hugo renders this to:
This is some {{< highlight go "hl_inline=true, noClasses=true" >}}fmt.Println("inline"){{< /highlight >}} code.
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 >}}
{{ $code := .Inner | strings.TrimSpace }}
{{ $lang := or (.Get 0) "go" }}
{{ $opts := dict "hl_inline" true "noClasses" true }}
{{ transform.Highlight $code $lang $opts }}
{{< /code >}}
```text
This is some {{</* hl */>}}fmt.Println("inline"){{</* /hl */>}} code.
```
Hugo renders this to:
This is some {{< hl >}}fmt.Println("inline"){{< /hl >}} code.
## Options
Pass the options when calling the shortcode. You can set their default values in your [site configuration].
{{% include "functions/_common/highlighting-options" %}}

48
docs/content/en/shortcodes/instagram.md Executable file
View File

@@ -0,0 +1,48 @@
---
title: Instagram
description: Embed an Instagram post in your content using the instagram shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
toc: true
---
{{% note %}}
To override Hugo's embedded `instagram` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl instagram %}}
{{% /note %}}
## Example
To display an Instagram post with this URL:
```text
https://www.instagram.com/p/CxOWiQNP2MO/
```
Include this in your Markdown:
```text
{{</* instagram CxOWiQNP2MO */>}}
```
Huge renders this to:
{{< instagram CxOWiQNP2MO >}}
## Privacy
Adjust the relevant privacy settings in your site configuration.
{{< code-toggle config=privacy.instagram />}}
disable
: (`bool`) Whether to disable the shortcode. Default is `false`.
simple
: (`bool`) Whether to enable simple mode for image card generation. If `true`, Hugo creates a static card without JavaScript. This mode only supports image cards, and the image is fetched directly from Instagram's servers. Default is `false`.

43
docs/content/en/shortcodes/param.md Executable file
View File

@@ -0,0 +1,43 @@
---
title: Param
description: Insert a parameter from front matter or site configuration into your content using the param shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
---
{{% note %}}
To override Hugo's embedded `param` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl param %}}
{{% /note %}}
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 lang=text >}}
---
title: Example
date: 2025-01-15T23:29:46-08:00
params:
color: red
size: medium
---
We found a {{</* param "color" */>}} shirt.
{{< /code >}}
Hugo renders this to:
```html
<p>We found a red shirt.</p>
```
Access nested values by [chaining](g) the [identifiers](g):
```text
{{</* param my.nested.param */>}}
```

113
docs/content/en/shortcodes/qr.md Executable file
View File

@@ -0,0 +1,113 @@
---
title: QR
description: Insert a QR code into your content using the qr shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
toc: true
---
{{< new-in 0.141.0 >}}
{{% note %}}
To override Hugo's embedded `qr` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl qr %}}
{{% /note %}}
The `qr` shortcode encodes the given text into a [QR code] using the specified options and renders the resulting image.
Internally this shortcode calls the `images.QR` function. Please read the [related documentation] for implementation details and guidance.
[QR code]: https://en.wikipedia.org/wiki/QR_code
[related documentation]: /functions/images/qr/
## Examples
Use the self-closing syntax to pass the text as an argument:
```text
{{</* qr text="https://gohugo.io" /*/>}}
```
Or insert the text between the opening and closing tags:
```text
{{</* qr */>}}
https://gohugo.io
{{</* /qr */>}}
```
Both of the above produce this image:
{{< qr text="https://gohugo.io" class="qrcode" />}}
To create a QR code for a phone number:
```text
{{</* qr text="tel:+12065550101" /*/>}}
```
{{< qr text="tel:+12065550101" class="qrcode" />}}
To create a QR code containing contact information in the [vCard] format:
[vCard]: https://en.wikipedia.org/wiki/VCard
```text
{{</* qr level="low" scale=2 alt="QR code of vCard for John Smith" */>}}
BEGIN:VCARD
VERSION:2.1
N;CHARSET=UTF-8:Smith;John;R.;Dr.;PhD
FN;CHARSET=UTF-8:Dr. John R. Smith, PhD.
ORG;CHARSET=UTF-8:ABC Widgets
TITLE;CHARSET=UTF-8:Vice President Engineering
TEL;TYPE=WORK:+12065550101
EMAIL;TYPE=WORK:jsmith@example.org
END:VCARD
{{</* /qr */>}}
```
{{< qr level="low" scale=2 alt="QR code of vCard for John Smith" class="qrcode" >}}
BEGIN:VCARD
VERSION:2.1
N;CHARSET=UTF-8:Smith;John;R.;Dr.;PhD
FN;CHARSET=UTF-8:Dr. John R. Smith, PhD.
ORG;CHARSET=UTF-8:ABC Widgets
TITLE;CHARSET=UTF-8:Vice President Engineering
TEL;TYPE=WORK:+12065550101
EMAIL;TYPE=WORK:jsmith@example.org
END:VCARD
{{< /qr >}}
## Parameters
text
: (`string`) The text to encode, falling back to the text between the opening and closing shortcode tags.
level
: (`string`) The error correction level to use when encoding the text, one of `low`, `medium`, `quartile`, or `high`. Default is `medium`.
scale
: (`int`) The number of image pixels per QR code module. Must be greater than or equal to 2. Default is `4`.
targetDir
: (`string`) The subdirectory within the [`publishDir`] where Hugo will place the generated image.
[`publishDir`]: /getting-started/configuration/#publishdir
alt
: (`string`) The `alt` attribute of the `img` element.
class
: (`string`) The `class` attribute of the `img` element.
id
: (`string`) The `id` attribute of the `img` element.
title
: (`string`) The `title` attribute of the `img` element.

48
docs/content/en/shortcodes/ref.md Executable file
View File

@@ -0,0 +1,48 @@
---
title: Ref
description: Insert a permalink to the given page reference using the ref shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
---
{{% note %}}
To override Hugo's embedded `ref` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl ref %}}
{{% /note %}}
{{% note %}}
When working with the Markdown [content format], this shortcode has become largely redundant. Its functionality is now primarily handled by [link render hooks], specifically the embedded one provided by Hugo. This hook effectively addresses all the use cases previously covered by this shortcode.
[content format]: /content-management/formats/
[link render hooks]: /render-hooks/images/#default
{{% /note %}}
The `ref` shortcode returns the permalink of the given page reference.
Example usage:
```text
[Post 1]({{%/* ref "/posts/post-1" */%}})
[Post 1]({{%/* ref "/posts/post-1.md" */%}})
[Post 1]({{%/* ref "/posts/post-1#foo" */%}})
[Post 1]({{%/* ref "/posts/post-1.md#foo" */%}})
```
Rendered:
```html
<a href="https://example.org/posts/post-1/">Post 1</a>
<a href="https://example.org/posts/post-1/">Post 1</a>
<a href="https://example.org/posts/post-1/#foo">Post 1</a>
<a href="https://example.org/posts/post-1/#foo">Post 1</a>
```
{{% note %}}
Always use the `{{%/* */%}}` notation when calling this shortcode.
{{% /note %}}

48
docs/content/en/shortcodes/relref.md Executable file
View File

@@ -0,0 +1,48 @@
---
title: Relref
description: Insert a relative permalink to the given page reference using the relref shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
---
{{% note %}}
To override Hugo's embedded `relref` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl relref %}}
{{% /note %}}
{{% note %}}
When working with the Markdown [content format], this shortcode has become largely redundant. Its functionality is now primarily handled by [link render hooks], specifically the embedded one provided by Hugo. This hook effectively addresses all the use cases previously covered by this shortcode.
[content format]: /content-management/formats/
[link render hooks]: /render-hooks/links/
{{% /note %}}
The `relref` shortcode returns the relative permalink of the given page reference.
Example usage:
```text
[Post 1]({{%/* relref "/posts/post-1" */%}})
[Post 1]({{%/* relref "/posts/post-1.md" */%}})
[Post 1]({{%/* relref "/posts/post-1#foo" */%}})
[Post 1]({{%/* relref "/posts/post-1.md#foo" */%}})
```
Rendered:
```html
<a href="/posts/post-1/">Post 1</a>
<a href="/posts/post-1/">Post 1</a>
<a href="/posts/post-1/#foo">Post 1</a>
<a href="/posts/post-1/#foo">Post 1</a>
```
{{% note %}}
Always use the `{{%/* */%}}` notation when calling this shortcode.
{{% /note %}}

72
docs/content/en/shortcodes/vimeo.md Executable file
View File

@@ -0,0 +1,72 @@
---
title: Vimeo
description: Embed a Vimeo video in your content using the vimeo shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
toc: true
---
{{% note %}}
To override Hugo's embedded `vimeo` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl vimeo %}}
{{% /note %}}
## Example
To display a Vimeo video with this URL:
```text
https://vimeo.com/channels/staffpicks/55073825
```
Include this in your Markdown:
```text
{{</* vimeo 55073825 */>}}
```
Hugo renders this to:
{{< vimeo 55073825 >}}
## Parameters
class
: (`string`) The `class` attribute of the wrapping `div` element. Adding one or more CSS classes disables inline styling.
id
: (`string`) The `id` of the Vimeo video
title
: (`string`) The `title` attribute of the `iframe` element.
If you proivde a `class` or `title` you must use a named parameter for the `id`.
```text
{{</* vimeo id=55073825 class="foo bar" title="My Video" */>}}
```
## Privacy
Adjust the relevant privacy settings in your site configuration.
{{< code-toggle config=privacy.vimeo />}}
disable
: (`bool`) Whether to disable the shortcode. Default is `false`.
enableDNT
: (`bool`) Whether to block the Vimeo player from tracking session data and analytics. Default is `false`.
simple
: (`bool`) Whether to enable simple mode. If `true`, the video thumbnail is fetched from Vimeo and overlaid with a play button. Clicking the thumbnail opens the video in a new Vimeo tab. Default is `false`.
The source code for the simple version of the shortcode is available [here].
[here]: {{% eturl vimeo_simple %}}

61
docs/content/en/shortcodes/x.md Executable file
View File

@@ -0,0 +1,61 @@
---
title: X
description: Embed an X post in your content using the x shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
toc: true
---
{{< new-in 0.141.0 >}}
{{% note %}}
To override Hugo's embedded `x` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl x %}}
{{% /note %}}
## Example
To display an X post with this URL:
```txt
https://x.com/SanDiegoZoo/status/1453110110599868418
```
Include this in your Markdown:
```text
{{</* x user="SanDiegoZoo" id="1453110110599868418" */>}}
```
Rendered:
{{< x user="SanDiegoZoo" id="1453110110599868418" >}}
## Privacy
Adjust the relevant privacy settings in your site configuration.
{{< code-toggle config=privacy.x />}}
disable
: (`bool`) Whether to disable the shortcode. Default is `false`.
enableDNT
: (`bool`) Whether to prevent X from using post and embedded page data for personalized suggestions and ads. Default is `false`.
simple
: (`bool`) Whether to enable simple mode. If `true`, Hugo builds a static version of the of the post without JavaScript. Default is `false`.
The source code for the simple version of the shortcode is available [here].
[here]: {{% eturl x_simple %}}
If you enable simple mode you may want to disable the hardcoded inline styles by setting `disableInlineCSS` to `true` in your site configuration. The default value for this setting is `false`.
{{< code-toggle config=services.x />}}

97
docs/content/en/shortcodes/youtube.md Executable file
View File

@@ -0,0 +1,97 @@
---
title: YouTube
description: Embed a YouTube video in your content using the youtube shortcode.
categories: [shortcodes]
keywords: []
menu:
docs:
parent: shortcodes
weight:
weight:
toc: true
---
{{% note %}}
To override Hugo's embedded `youtube` shortcode, copy the [source code] to a file with the same name in the `layouts/shortcodes` directory.
[source code]: {{% eturl youtube %}}
{{% /note %}}
## Example
To display a YouTube video with this URL:
```text
https://www.youtube.com/watch?v=0RKpf3rK57I
```
Include this in your Markdown:
```text
{{</* youtube 0RKpf3rK57I */>}}
```
Hugo renders this to:
{{< youtube 0RKpf3rK57I >}}
## Parameters
id
: (`string`) The video `id`. Optional if the `id` is provided as a positional argument as shown in the example above.
allowFullScreen
{{< new-in 0.125.0 >}}
: (`bool`) Whether the `iframe` element can activate full screen mode. Default is `true`.
autoplay
{{< new-in 0.125.0 >}}
: (`bool`) Whether to automatically play the video. Forces `mute` to `true`. Default is `false`.
class
: (`string`) The `class` attribute of the wrapping `div` element. When specified, removes the `style` attributes from the `iframe` element and its wrapping `div` element.
controls
{{< new-in 0.125.0 >}}
: (`bool`) Whether to display the video controls. Default is `true`.
end
{{< new-in 0.125.0 >}}
: (`int`) The time, measured in seconds from the start of the video, when the player should stop playing the video.
loading
{{< new-in 0.125.0 >}}
: (`string`) The loading attribute of the `iframe` element, either `eager` or `lazy`. Default is `eager`.
loop
{{< new-in 0.125.0 >}}
: (`bool`) Whether to indefinitely repeat the video. Ignores the `start` and `end` arguments after the first play. Default is `false`.
mute
{{< new-in 0.125.0 >}}
: (`bool`) Whether to mute the video. Always `true` when `autoplay` is `true`. Default is `false`.
start
{{< new-in 0.125.0 >}}
: (`int`) The time, measured in seconds from the start of the video, when the player should start playing the video.
title
: (`string`) The `title` attribute of the `iframe` element. Defaults to "YouTube video".
Example using some of the above:
```text
{{</* youtube id=0RKpf3rK57I start=30 end=60 loading=lazy */>}}
```
## Privacy
Adjust the relevant privacy settings in your site configuration.
{{< code-toggle config=privacy.youTube />}}
disable
: (`bool`) Whether to disable the shortcode. Default is `false`.
privacyEnhanced
: (`bool`) Whether to block YouTube from storing information about visitors on your website unless the user plays the embedded video. Default is `false`.