Vimeo

Vimeo is a non-Williams service that hosts video for sharing on the web.

Automatic embedding

WordPress can automatically embed Vimeo videos in your page/post- all you have to do is put the Vimeo URL on a line by itself.

Getting a Vimeo URL

1. Find your video on Vimeo.

2. Click the share icon, located in the upper right corner of the video- it looks like a paper airplane- this will launch a popup window called “Share This Video”.

vimeo-share1

3. Copy the URL in the link box, outlined in red below.

vimeo-share2

Overview

WordPress allows you to automatically embed video, audio and other content from most popular media hosting sites simply by placing a URL on a line by itself in a page or post.

Full list of supported sites

Getting the URL

Finding the URL to paste into WordPress is a bit different for each media hosting site. In most cases, you’ll be looking for a share icon that looks something like one of these:

shareicons

More specific instructions for finding the correct URLs, and demos of the embedded content, can be found on these pages:

Inserting the URL

This example uses a YouTube video, but the process is the same for all automatically embedded media: simply paste the URL on a line by itself, as shown in the “correct” example below.

embed1

Preview

If you are editing your page/post in visual mode (orange arrow, below), you will see a preview of your movie (or other type of content) where you placed the URL.

Embedded content toolbar

Click on the preview of your embedded content to reveal a toolbar, outlined in red below. To edit the embedded content’s URL, click the pencil. To delete the content, click X.

embed2

  • This is useful if you don't want to clutter your page with videos, or if you have a gallery of screenshots you want to link to the corresponding videos. Important: Be sure you use the 'embed' version of the URL.

    • For a text-only link, use the text editor (rather than the visual editor) and add the following to the link HTML: data-featherlight="iframe"

    <a href="https://www.youtube.com/embed/sIpBh3-hb2s" data-featherlight="iframe">Youtube</a>

    Youtube

    • For an image link, add the following to the link html (make sure there is only one 'class' attribute or the link will break): class="type-video" 

    <a href="https://www.youtube.com/embed/sIpBh3-hb2s" class="type-video"><img class="alignnone size-thumbnail wp-image-4447" src="https://admission.dev.williams.edu/files/Zach-Babat-150x150.png" alt="" width="150" height="150"></a>


Demo

Here's what an embedded Vimeo video looks like: