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 8, replace “VIMEO EMBED DIV” with clipboard
  8. On line 9,  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

 

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.