Vimeo Video

Xidipity WordPress Theme Vimeo Video Tutorial
Back To The Future • 1985 • Universal Pictures

 

lesson

 

Add a vimeo video to a post using the Xidipity template.

 

Design Notes

The template consists of a block quote which displays the reference in the editor and a Vimeo script tag which displays the video on the web. Vimeo supports a variety of aspect ratios.

 

Template

 


GitHub Gist

video / vimeo / caption


 

Required Information

  1. Name Of Video: Taking Pictures
  1. Source Link: https://vimeo.com/119520956
  2. Source Name: Vimeo
  3. Caption text: Taking Pictures

 

Installation

  1. Highlight  & copy template to clipboard
  2. Open sandbox editor & paste clipboard
  3. Go to Vimeo source link
  4. Click “Share
  5. Click “+ Show Options
    Make sure “Responsive” is checked.
  6. Highlight and copy “Embed” contents to clipboard
  7. On line 10, replace “VIMEO EMBED DIV” with clipboard
  8. On line 11,  replace “CAPTION” with caption text
  9. Highlight updated template & copy to clipboard
  10. Place cursor where video will be embedded
  11. Click the embed ( save_alt ) button
  12. Paste the updated clipboard content into the text box
  13. Click the “OK” button

 

demonstration

 

Editor View

 


Video

video / vimeo / caption


 

Web View

 


Video

video / vimeo / caption

Taking Pictures


 

vimeo full screen

 

Lesson

Link to a vimeo video in fullscreen mode. The thumbnail image is an image of your creation or choosing. I find an image with a 21×9 aspect ratio works well.

 

Template

 


GitHub Gist

video / vimeo / full screen


 

Installation

  1. Highlight  & copy template to clipboard
  2. Open sandbox editor & paste clipboard
  3. Go to Vimeo source link
  4. Highlight and copy video id  “119520956” from URL
  5. On line 3, replace “VIMEO-ID” with “119520956
  6. Highlight updated template & copy to clipboard
  7. Click the video thumbnail
  8. Click (  ) insert link button
  9. Paste link
  10. Press <return> or click the ( ↲) button

 

If the VIMEO-ID is not displayed in the URL, it will be available in the embed code.

 

demonstration

 

Editor & Web View

 

½×

Xidipity WordPress Theme Linked Vimeo Video

 

Click image to play video. * The Vimeo documentation states for autoplay to work the mute parameter must be included in the command line.