summaryrefslogtreecommitdiffstats
path: root/layouts/shortcodes
diff options
context:
space:
mode:
Diffstat (limited to 'layouts/shortcodes')
-rw-r--r--layouts/shortcodes/video.html37
1 files changed, 37 insertions, 0 deletions
diff --git a/layouts/shortcodes/video.html b/layouts/shortcodes/video.html
new file mode 100644
index 0000000..aa30a13
--- /dev/null
+++ b/layouts/shortcodes/video.html
@@ -0,0 +1,37 @@
+{{/*
+ * The video shortcode:
+ * All arguments are optional, except for src which is where you define your video file
+ * This shortcode supports webm, mp4, and other HTML5 video formats.
+ * Args:
+ * src: [string] Path to video file (required)
+ * class: [string] The class(es) to give to the video block.
+ * width: [int] The width of the video
+ * height: [int] The height of the video
+ * autoplay: [bool] true or false for autoplay - defaults to false
+ * loop: [bool] true or false for loop - defaults to false
+ * muted: [bool] true or false for mute - defaults to false
+ *
+ * Usage:
+ * {{< video src="my-video.mp4" width=600 height=400 autoplay=true loop=true muted=true class="responsive-video" >}}
+ *
+ * Output:
+ * <video class="responsive-video" controls preload="auto" width="600" height="400" autoplay loop muted playsinline>
+ * <source src="my-video.mp4" type="video/mp4">
+ * </video>
+ *
+ */}}
+
+{{ $ext := (.Get "src") | path.Ext }}
+{{ $filetype := slicestr $ext 1}}
+
+<video{{ with .Get "class" }} class="{{ . }}"{{ end }}
+ controls
+ preload="auto"
+ {{ with .Get "width" }}width="{{.}}"{{ end }}
+ {{ with .Get "height" }}height="{{.}}"{{ end }}
+ {{ if eq (.Get "autoplay") "true" }}autoplay {{ end }}
+ {{ if eq (.Get "loop") "true" }}loop {{ end }}
+ {{ if eq (.Get "muted") "true" }}muted {{ end }}
+ playsinline >
+ <source src="{{ ( .Get "src" ) }}" type="video/{{ $filetype }}">
+</video>