We provide lifetime video hosting for every corporate video project we create for our clients. This means you don’t have to worry about keeping master copies of your videos. Or dealing with the faff of uploading them to different sites when the project finishes. All you need is a simple video embed code.
What is a video embed code?
An “embed code” is a piece of programming text. You copy this text into the coding of a web page to display an object. You can embed pretty much anything onto a website this way – images, social media posts and, of course, video.
Video embed codes can be created and customised easily from popular video hosting sites like YouTube, Vimeo, Wistia, Facebook, Twitter, Instagram, and loads more.
How to use a video embed code
At the end of every project, we’ll provide our clients with a simple PDF that has their own embed code for their video production. It will look similar to the one you see below.
<iframe src=”https://player.vimeo.com/video/377584750″ width=”640″ height=”360″ frameborder=”0″ allow=”autoplay; fullscreen” allowfullscreen></iframe> |
To use it, the first thing you’ll need to do is copy the entire code to your clipboard. Highlight it and go to Edit > Copy in your PDF viewer or use Ctrl-C or Cmb-C for Mac users.
Next, go to the webpage where you want to embed the video. You’ll need permission to edit the page so you can see the ‘HTML view’ with all it’s complicated lines of code.
Then, navigate to the position on the page where you want to embed the video. You should be able to decipher some parts of the code by identifying headlines or paragraphs of text that appear on the page.
Click at the point where you want to embed the video and paste the code from your clipboard by using ‘Edit > Paste’ or Ctrl-V (Cmd-V on a Mac). Then save your changes.
Refresh the page and bingo! The internet has worked its magic! Your embedded video will look a little something like this.
How can I change the size of my embedded video
Video embed codes are highly customisable. One of the things you might want to do is change how big or small your video appears on your page.
When copying your video embed code to your desired web page, simply change the ‘width’ and ‘height’ parameters below to the settings you want and you’re all set!
<iframe src=”https://player.vimeo.com/video/377584750″ width=”640″ height=”360″ frameborder=”0″ allow=”autoplay; fullscreen” allowfullscreen></iframe> |
Download your free copy of my Video Marketing Roadmap
We will collect, use and protect your data in accordance with our Privacy Policy.
How can I change the playback settings of my embedded video?
There are also loads of cool hacks that you can do to the video embed code that affect video playback. All you need to do is add a little bit of text to the point in the code AFTER the 9 digit video ID at the end of the player.vimeo.com URL.
Here’s a few of the most popular embed code hacks we use.
How to autoplay your video
By adding ?autoplay=1 after the 9 digital video ID, your video will automatically start playing once it has loaded on the page!
<iframe src=”https://player.vimeo.com/video/377584750?autoplay=1” width=”640″ height=”360″ frameborder=”0″ allow=”autoplay; fullscreen” allowfullscreen></iframe> |
How to loop your video
By adding ?loop=1 after the 9 digital video ID, your video will automatically loop when the viewer has finished watching!
<iframe src=”https://player.vimeo.com/video/377584750?loop=1” width=”640″ height=”360″ frameborder=”0″ allow=”autoplay; fullscreen” allowfullscreen></iframe> |
How to use your video as a background
<iframe src=”https://player.vimeo.com/video/377584750?background=1” width=”640″ height=”360″ frameborder=”0″ allow=”autoplay; fullscreen” allowfullscreen></iframe> |
By adding ?background=1 after the 9 digital video ID, your video will automatically play on a loop with no sound, which is perfect for using as a background on a webpage! More magic!
How do you change the look of an embedded video player?
As you might have seen, there’s so many cool things you can do with embed codes. Here are a few more you may not have thought about!
- Captions or foreign subtitles can be added which can be toggled on and off during playback
- You can customise what playback buttons are shown. This allows you to restrict people fast forwarding through the video or skipping straight to the end
- You can choose the highlight colours for your buttons (we use our Boxset pink above)
- You can upload your logo to show in the bottom corner of the screen
- End screens can be customised with ‘call to action’ buttons to help drive engagement
- Videos can be restricted with domain-level privacy. That means you can specify the websites that are permitted to embed your video. Any sites not on that list won’t be able to embed it!
We will collect, use and protect your data in accordance with our Privacy Policy.
Where do I find my embed code on YouTube, Facebook or anywhere else?
You can generate an embed code relatively quickly.
There will usually be a link near the thing you want to embed – look for familiar icons or the words ‘Embed’ or ‘Share’. Click on that and highlight the piece of code it gives you and copy it to your clipboard by going to ‘Edit’ and ‘Copy’ in your browser or pressing Ctrl-C on a PC or Cmd-C on a Mac.
Being smart with embed codes give you more flexibility in the way your videos are viewed and shared. Take a minute to think what more you could get out of your videos online to improve the experience for customers . It just takes a little magic!