(while using YouTube videos)
Have you noticed when you embed a video, at the end you get a box of “related video” tiles? This is YouTube giving customer service of showing people what it thinks are related videos. But it gives a big distraction to visitors.
The fix is quick, easy and powerfully good at keeping people focused on your content, even if you’re using someone else’s videos.
Well that’s nice when you’re surfing YouTube, but not when people are reading and learning on your blog. You went through the effort of getting them to your blog, you don’t need YouTube to offer them another shiny object for them to follow and go away from your site!
There’s a really simple change you can make to the embed code YouTube gives you that stops the tiles.
Here’s what the embed code looks like straight out of YouTube.
In yellow, you’ll see the URL of the video. This is where we’re going to add just six characters.
Simply add the question mark, then rel=0. Remember to do this inside* the quote marks.
Now when readers reach the end of the video, they’ll see the start of the video, like this:
And now, they’re more likely to read anything you’ve put after the video and stick around on your blog.
There are a few other changes we can make to the video display and function. As with the related videos, these go at the end of the URL. To put multiple parameters together, simply add a & between them.
|parameter||comments||set value to|
|loop||cycle the video – when it finishes, it starts again. Use with caution||1|
|modestbranding||reduces the amount of YouTube branding||1|
|start||start the video at this time offset||positive number in seconds|
|end||end the video at this time offset||positive number in seconds, from the start of the video|
Here’s an example of using multiple parameters together. Using this code:
<iframe width=”560″ height=”315″ src=”http://www.youtube.com/embed/QGJuMBdaqIw?modestbranding=1&loop=1&rel=0&start=44&end=92″ frameborder=”0″></iframe>
This is the result:
If this seems a little daunting, there’s a handy tool here: http://www.classynemesis.com/projects/ytembed/ to help you create these modifications to the standard display, and a whole lot more than I’ve mentioned above.