Add paige/youtube.html shortcode

README.md

@@ -639,6 +639,52 @@ Parameters:
 
 It has the other parameters of the `paige/figure` shortcode.
 
+### YouTube
+
+The `paige/youtube` shortcode provides a responsive YouTube video.
+
+```
+{{< paige/youtube
+    autoplay=false
+    controls=true
+    end=20
+    fullscreen=true
+    list=PL2WkvfelorAFjpzGUWc4OWAWmiJpwL97L
+    loop=true
+    mute=true
+    start=10
+    title="My title"
+    video="dQw4w9WgXcQ"
+>}}
+```
+
+Inner content: None.
+
+Parameters:
+
+<dl>
+    <dt><code>autoplay</code></dt>
+    <dd>Optional. Boolean. Automatically play the video.</dd>
+    <dt><code>controls</code></dt>
+    <dd>Optional. Boolean. Show video controls. Default is <code>true</code>.</dd>
+    <dt><code>end</code></dt>
+    <dd>Optional. Integer. Elapsed seconds. Stop the video here.</dd>
+    <dt><code>fullscreen</code></dt>
+    <dd>Optional. Boolean. Enable full screen. Default is <code>true</code>.</dd>
+    <dt><code>list</code></dt>
+    <dd>Optional. String. Playlist ID.</dd>
+    <dt><code>loop</code></dt>
+    <dd>Optional. Boolean. Loop the video.</dd>
+    <dt><code>mute</code></dt>
+    <dd>Optional. Boolean. Mute the video.</dd>
+    <dt><code>start</code></dt>
+    <dd>Optional. Integer. Elapsed seconds. Start the video here.</dd>
+    <dt><code>title</code></dt>
+    <dd>Optional. String. Video description. Used for screen readers. Default is <code>YouTube video</code>.</dd>
+    <dt><code>video</code></dt>
+    <dd>Optional. Position 0. String. Video ID.</dd>
+</dl>
+
 ## Customize
 
 If `partials/paige/head-last.html` exists in the site, it is included at the end of the head tag.

exampleSite/content/blog/youtube.md

@@ -0,0 +1,59 @@
+---
+categories: [paige]
+date: 2023-01-20
+description: Demonstration of the Paige YouTube shortcode.
+tags: [shortcodes, videos]
+title: YouTube Shortcode
+---
+
+Code:
+
+```go-text-template
+{{</* paige/youtube "dQw4w9WgXcQ" */>}}
+```
+
+Result:
+
+{{< paige/youtube "dQw4w9WgXcQ" >}}
+
+---
+
+Code:
+
+```go-text-template
+{{</* paige/youtube video="dQw4w9WgXcQ" */>}}
+```
+
+Result:
+
+{{< paige/youtube video="dQw4w9WgXcQ" >}}
+
+---
+
+Code:
+
+```go-text-template
+{{</* paige/youtube
+    controls=true
+    end=20
+    fullscreen=true
+    loop=true
+    mute=true
+    start=10
+    title="My title"
+    video="dQw4w9WgXcQ"
+*/>}}
+```
+
+Result:
+
+{{< paige/youtube
+    controls=true
+    end=20
+    fullscreen=true
+    loop=true
+    mute=true
+    start=10
+    title="My title"
+    video="dQw4w9WgXcQ"
+>}}

layouts/shortcodes/paige/youtube.html

@@ -0,0 +1,62 @@
+{{ $autoplay := .Get "autoplay" }}
+{{ $controls := .Get "controls" | default true }}
+{{ $end := .Get "end" }}
+{{ $fullscreen := .Get "fullscreen" | default true }}
+{{ $list := .Get "list" }}
+{{ $loop := .Get "loop" }}
+{{ $mute := .Get "mute" }}
+{{ $start := .Get "start" }}
+{{ $title := .Get "title" | default "YouTube video" }}
+{{ $video := .Get 0 | default (.Get "video") | default "dQw4w9WgXcQ" }}
+
+{{ $host := cond .Page.Site.Config.Privacy.YouTube.PrivacyEnhanced "www.youtube-nocookie.com" "www.youtube.com" }}
+
+{{ $path := "" }}
+
+{{ if $list }}
+    {{ $path = printf "embed?list=%v&listtype=playlist" $list }}
+{{ else }}
+    {{ $path = printf "embed/%v" $video }}
+{{ end }}
+
+{{ $params := slice (printf "hl=es" (.Site.LanguageCode | default .Site.Language.Lang)) "modestbranding=1" }}
+
+{{ if $autoplay }}
+    {{ $params = $params | append "autoplay=1" | append "mute=1" }}
+{{ end }}
+
+{{ if not $controls }}
+    {{ $params = $params | append "controls=0" }}
+{{ end }}
+
+{{ with $end }}
+    {{ $params = $params | append (printf "end=%v" .) }}
+{{ end }}
+
+{{ if not $fullscreen }}
+    {{ $params = $params | append "fs=0" }}
+{{ end }}
+
+{{ if $loop }}
+    {{ $params = $params | append "loop=1" }}
+
+    {{ if $video }}
+        {{ $params = $params | append (printf "playlist=%v" $video) }}
+    {{ end }}
+{{ end }}
+
+{{ if $mute }}
+    {{ $params = $params | append "mute=1" }}
+{{ end }}
+
+{{ with $start }}
+    {{ $params = $params | append (printf "start=%v" .) }}
+{{ end }}
+
+{{ if $params }}
+    {{ $params = delimit (uniq (sort $params)) "&" }}
+{{ end }}
+
+<div class="mb-3 ratio ratio-16x9">
+    <iframe src="https://{{ $host | safeURL }}/{{ $path | safeURL }}?{{ $params | safeURL }}" {{ with $title }} title="{{ . }}" {{ end }} {{ if $fullscreen }} allowfullscreen {{ end }}></iframe>
+</div>