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"]} page={page}/> }}

#Output

<div class="video-local">
  <video controls autoplay>
      <source src="/posts/video/over9000.mp4?v=14901c9ff1b7ed2de1fc3110dbf76eb3fb1f07338b57eca03524248062806b33cf2ae89164d97ec005393027c27d97b9e33f5bb38879a5cb32ad2f420985acde" type="video/mp4"/>
      <source src="/posts/video/over9000.webm?v=6c41618a856aaa7ef5895eed705e7519f05d31dde3fc6bc3f70e1c15cb430edeb24fff56dd1d48151cd26f45fab4bfeb520ea4249ac90ebf4c44a855bdf25eb6" type="video/webm"/>
      Your browser does not support the video formats in use.
  </video>
</div>

#Input

{{ <video src={["over9000.mp4"]} muted={true} page={page}/> }}

#Output

<div class="video-local">
  <video controls autoplay muted=true>
      <source src="/posts/video/over9000.mp4?v=14901c9ff1b7ed2de1fc3110dbf76eb3fb1f07338b57eca03524248062806b33cf2ae89164d97ec005393027c27d97b9e33f5bb38879a5cb32ad2f420985acde" 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&autoplay=1&loop=1&dnt=1"
    class="video-iframe"
    title="Vimeo"
    webkitallowfullscreen
    mozallowfullscreen
    allowfullscreen>
  </iframe>
</div>

#YouTube

#Usage

• id: the video id (mandatory)
• 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?autoplay=1"
    class="video-iframe"
    title="YouTube"
    webkitallowfullscreen
    mozallowfullscreen
    allowfullscreen>
  </iframe>
</div>