Tips for embedding YouTube on your website

24 Jul 2018

Using video in your marketing is going through the roof! People get to see you or what you are telling them in a very clear way (if you are doing it right). And what could be more compelling than that?

With video being awesomely popular chance are (high) that you want to embed YouTube on your page or posts in WordPress. But how do you do that? And how do you make it look pretty? In this blog posts I am going to explain all about embedding YouTube videos on your website and how to customize the player to make it look the way you want it to.

Basis YouTube embedding

There are 2 ways to embed a video on your page or post. The first one is really really simple and the one I use most. You just post the link, like “https://www.youtube.com/watch?v=WJrs7tDYMdI”. The only thing you have to be careful of is that you are on a new line when you post the video and immediately hit enter after. You can’t type as much as an extra space. If you do this then the video should pop up.

Another way is to use the embed code. If you go to the YouTube video you want to embed you can hit ‘Share’ and then ‘Embed’. You then get a bit of code, starting with <iframe, that you can post on your page or post. Make sure you are in ‘text’mode when you post this.

 

Customize your YouTube player

So after you’ve posted the code or link the way I described above it looks like this:

But you might not want it to have the standard options when it comes to playing. And that is where custom features come in.

What you do is you add these codes directly behind your link. This does not work for the direct link, only the embed code. Find the link within that code, start by adding a question mark ? and add any code you want. And as many as you want. (You only add the question mark before the first one). Which codes do you want to use?

  • Turn off controls
    You don’t want the visitor to be able to see and use the controls? Use this code to remove them:
    &controls=0
  • Turn off display information
    This causes the video player not to display information like title before the video starts playing
    &showinfo=0
  • Turn off related videos
    Don’t want to show any related videos after playing this video with this code
    &rel=0
  • Force closed captions
    This code forces captions to be shown, no matter if they user preference is turned off. Not really sure why you would want this, but hey:
    &cc_load_policy=1
  • Turn on autoplay
    This is one I do not recommend in most instances but maybe you want the video to start automatically. Then you can add the following code
    &autoplay=1
  • Infinite loop
    Want people to watch your video over and over and over? Use this code to make the video play in a loop:
    &loop=1

 

You can find all parameters here in this YouTube article.

Categories

Archive

© 2018 | Web design Karlijn.net | Web development Digitalie.eu