Videos

Embed videos on your website while making sure they look great on mobile and desktop.

What it looks like

 

YouTube

 

<div class="video-wrapper"> <iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" src="https://www.youtube.com/embed/XXXXXX" title="YouTube video player"></iframe> </div>

 

Vimeo

 

<div class="video-wrapper"> <iframe src="https://player.vimeo.com/video/XXXXXX" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe> </div>

 

How to add a video to your page

  1. Upload to a video hosting site

    First upload your video to either YouTube or Vimeo. This will generate a URL for your video that we'll need soon.

  2. Copy and paste the code above

    Look up - below the video is a code you can copy and paste into your page.

  3. Update the video ID in the code

    In the code you'll see 'XXXXXX'. Just paste your video ID in place of this.

Not sure what your video ID is?

Easy - just look at the URL of your video and you'll be able to pick out the ID. Look at the highlighted characters in the examples below.

YouTube

https://www.youtube.com/watch?v=RWjnC8HSRdU

Vimeo

https://vimeo.com/529254176