Videos can be added to your site in a couple of different ways. The first major thing to consider is where to host your videos. We recommend hosting your videos on Vimeo (though there is a cost associated with this). You could also host your videos on Youtube, which is free, though less customisable.
Embedding videos into a content box
Perhaps the easiest way to embed a video onto your website is to use a simple content box. When in edit mode, you should either edit an existing content box or add a new content box. One you are editing a content box, you should follow the steps below.
- Navigate to where your video is hosted.
- On Youtube: Right-click on the video and chose the embed code option. This will automatically copy some relevant code to your clipboard.
- On Vimeo: Open your video and in the top-right click embed. This will bring up a box that allows you to copy some code.
- Navigate back to the content box you want to add your video too and click edit.
- Put the cursor where you want to add the video amongst any other content.
- Switch to the code view by clicking source in the top-left corner of the editor options.
- Paste the code you copied from the video.
- Click source again and you should see a box appear with the word “iframe” in the middle of it.
- Click save and then preview your content changes to make sure the video looks as you expect it to.
Top accessibility tips
When adding a video to a website it is most likely going to be in an iframe. This acts as a 'window' to another website. To make this more accessible you need to add a title to the iframe explaining what the iframe contains so users who use assistive technologies such as screen readers can decide if they want to navigate to it.
To add a title right click on the iframe (whilst editing a content area) and click on iframe properties. In the popup window add text to the 'Advisory title' field.