Shortcodes for videos

#Video

#Usage

• src: an array of video file paths (mandatory)
• width: the width of the video (optional)
• height: the height of the video (optional)
• autoplay: when set to "true", the video autoplays on load (optional)
• loop: when set to "true", the video plays on a loop (optional)
• muted: when set to "true", the audio will be initially silenced (optional)

#Input

{{ video(src=["over9000.mp4", "over9000.webm"]) }}

#Output

<div class="video-local">
  <video controls>
      <source src="https://halve-z.netlify.app/posts/video/over9000.mp4" type="video/mp4"/>
      <source src="https://halve-z.netlify.app/posts/video/over9000.webm" type="video/webm"/>
      Your browser does not support the video formats in use.
  </video>
</div>

#Input

{{ video(src=["over9000.mp4"], muted="true") }}

#Output

<div class="video-local">
  <video controls muted=true>
      <source src="https://halve-z.netlify.app/posts/video/over9000.mp4" type="video/mp4"/>
      Your browser does not support the video formats in use.
  </video>
</div>

#Vimeo

#Usage

• id: the video id (mandatory)
• autoplay: when set to "true", the video autoplays on load (optional)
• loop: when set to "true", the video plays on a loop (optional)
• noautopause: when set to "true", the video will not autopause (optional)
• title - set alt title for the iframe (optional, defaults to "Vimeo")
• cookie - set to "true" if you want tracking cookies, otherwise it defaults to false.

#Input

{{ vimeo(id="4340383") }}

#Output

<div class="video-embedded">
  <iframe
    src="https://player.vimeo.com/video/4340383?embedded=true&dnt=1"
    class="video-iframe"
    title="Vimeo"
    webkitallowfullscreen
    mozallowfullscreen
    allowfullscreen>
  </iframe>
</div>

#YouTube

#Usage

• id: the video id (mandatory)
• playlist: the playlist id (optional)
• autoplay: when set to "true", the video autoplays on load (optional)
• title - set alt title for the iframe (optional, defaults to "Youtube")
• cookie - set to "true" if you want tracking cookies, otherwise it defaults to false.

#Input

{{ youtube(id="frBzlP6t9Gw") }}

#Output

<div class="video-embedded">
  <iframe
    src="https://www.youtube-nocookie.com/embed/frBzlP6t9Gw"
    class="video-iframe"
    title="Youtube"
    webkitallowfullscreen
    mozallowfullscreen
    allowfullscreen>
  </iframe>
</div>