First time using this responsive video embed?

Make sure to read the Info & Notes section so you know how it works.

Jump to Info & Notes

RESPONSIVE VIDEO EMBED: COPY & PASTE

The responsive video embed is available below for copying and pasting in the Visual Editor.

Selection bars are necessary for responsive video embeds.

The responsive video embed below includes a placeholder video. Insert your video immediately after the placeholder video, then delete the placeholder.

You can insert a video in the Rich Content Editor by clicking the plug icon > View All to open a menu of apps that includes Mediasite, Vimeo, and YouTube. Alternatively, you can copy the iframe embed code from the video platform and insert it by going to Insert in the dropdown menu and selecting Embed.

The Responsive Video Embed will look different in the Visual Editor, because it cannot be fully responsive in the editor. Don’t worry, it will look amazing on the front end!

Start of Selection

End of Selection

GIF showing process of copying and pasting responsive video embed

RESPONSIVE VIDEO EMBED: INFO & NOTES

By default, embedding a video in Canvas through Mediasite, YouTube, Vimeo, or other video platforms will result in a fixed size video. This is not optimal, as the video size does not adjust for different screen sizes, from mobile devices up to large desktop monitors.

The block here is used to make videos responsive, meaning they take up the full content width regardless of the device size.

Notes

This responsive video embed works with the iframe embed code from almost any video service, such as Mediasite, YouTube, and Vimeo.
This responsive video embed is locked to a 16:9 aspect ratio. This is the most common landscape aspect ratio for videos, supported by all major video platforms.
You may also use this responsive embed on other iframe embeds, such as a PowerPoint from OneDrive.

We recommend combining this responsive video embed with the Restrict Page Width option, since this will keep your videos from being huge on larger screens.

Back to Top