YouTube embed options can make your videos look less YouTube-y



Contributing Writer

YouTube embed options Photo: Handicam Credit: Sanja Gjenero


YouTube embed options are a great way to get a more professional look from your embedded videos.  The trick is to understand what codes to use and how to insert them into YouTube’s embed code. YouTube doesn’t make it so simple to do, though.  This is a short tutorial to go over some of my favorite options to personalize your embedded video.

This post was inspired in part by Ellen Bremen’s wonderful video post yesterday (if you haven’t seen it you need to check it out).  My intention was to make the video play automatically, to take away all of the visible bars and controls, and to hide suggested videos after the video completes.  So here’s how I went about it:

YouTube embed options: how to find the basic embed code

Once you have a video hosted on YouTube that you want to embed on your site, you simply have to push “share” and “embed” to get the basic embed code (see the arrow in the illustration).

YouTube Embed Options

YouTube embed options: How to customize your embedded video

The key to this is to understand where to input the additional code and what your options are.  YouTube gives you a rundown of all of your options on their developers site, though I’m only going to discuss a few.

The “autoplay” function allows for a video to immediately start when a page loads.  (the value “1″ enables this).  To insert this into the embed code, you would simply use the “?” character and then “autoplay=1″

<iframe width="640" height="480" src="http://www.youtube.com/embed/usi8OvRSGs0?autoplay=1" frameborder="0" allowfullscreen>iframe>

The “controls” function allows you to hide or show the video controls.  To hide the controls, I insert the character “&” and then “controls=0″ immediately after the last code entered.

<iframe width="640" height="480" src="http://www.youtube.com/embed/usi8OvRSGs0?autoplay=1&controls=0" frameborder="0" allowfullscreen>iframe>

The “showinfo” code shows and hides the YouTube header bar.  To hide the info bar, I insert the character “&” and “showinfo=0″

 <iframe width="640" height="480" src="http://www.youtube.com/embed/usi8OvRSGs0?autoplay=1&controls=0&showinfo=0" frameborder="0" allowfullscreen></iframe>

Finally, in order to remove related videos from the end of the video I insert “&” then “rel=0″ like this:

<iframe width="640" height="480" src="http://www.youtube.com/embed/usi8OvRSGs0?autoplay=1&controls=0&showinfo=0&rel=0" frameborder="0" allowfullscreen></iframe>

Selfish motives

In the spirit of full disclosure I should share my selfish motivation for this post: I needed to put all of this in one place so that I don’t have to look it up everytime I post a video. If you have favorite YouTube embed options to help me or others out, please leave a comment and share them!

Jim Dougherty

Jim Dougherty

Writer and chief of miscellany at leaderswest.com

I aspire to give people something to think about rather than tell them what to do. My favorite Google Alert is “social media research,” I am increasingly compelled by Gen Z, and I appreciate good writers agnostic of where they write. At one time I was Kred’s 12th most influential social media blogger and Klout’s most influential person on the topic of David Hasselhoff. Transplant from Seattle living in Cincinnati. Haven’t entirely adopted the local sports teams yet.

Jim Dougherty

@jimdougherty

Writer about social media and tech at Leaders West, I also tweet as @leaderswest.

Study: Most people are unaware of digital information collection http://t.co/f8xWz4UESo – 2 hours ago

Jim Dougherty

Jim Dougherty

  • Ben Baker

    Jim, great helpful information, thanks. Ben

  • http://www.wonderoftech.com Carolyn Nicander Mohr

    This is great information, Jim. I have to say though that I really, really don’t like it when I open a page and a video starts to play. I like very much being able to delete the related videos at the end of a YouTube video!

  • jimdougherty

    Thanks Ben and appreciate you sharing this on LinkedIn as well! Cheers!

  • jimdougherty

    Thanks Carolyn! I understand how that can be off-putting, but the rationale for autoplay (in my mind) is to give a message or a snippet of a message before a person can arbitrarily opt out. I think that’s a powerful and useful tool to give content the highest likelihood of being noticed. Thanks so much for reading and commenting!

  • http://twitter.com/talknologyfm Talknology

    so THAT’S how they do it! Great share, Jim.

  • http://twitter.com/Mompreneurmogul Lisa Cash Hanson

    Right selfish or not I”m glad you did LOL I need to book mark how do they add that white play button have you seen that?

  • TheTysonReport

    Very useful Jim, thank you.

  • jimdougherty

    Hi Lisa! I think that you would do everything I did without autofollow. For example:

    $controls=0&showinfo=0

    and that should give you a video screen with just the play button! Thanks for reading and commenting!

  • jimdougherty

    Thank you for reading and commenting!

  • jimdougherty

    Thanks for reading and commenting!

  • http://LisaLadrido.com Lisa Ladrido

    Thank you Jim! WordPress only allows me to add the URL to the video. I haven’t been able to use the html like I was able to with Blogger. Should I be using a specific WP plugin instead so I can edit the html? Thanks for another great post!

  • Samantha Gluck

    Lisa, you can add embed code if you’re self-hosting on a wp platform….

  • jimdougherty

    Hi Lisa, as Samantha said this is for self-hosted (wordpress.org) websites. If you are using wordpress.com, here is a post that describes how to embed youtube videos:

    http://en.support.wordpress.com/videos/youtube/

    It’s been awhile since I used wordpress.com, but it appears from that article that you can accomplish the same things by adding the codes to the end of the video link. I’m curious and happy to help if you ever find yourself wanting to do this. Shoot me a message! Thanks for reading and commenting!

  • http://LisaLadrido.com Lisa Ladrido

    I am on the self hosted WP. For some reason each time I would add the html code the video wouldn’t show up. However, it does when using the URL. Therefore, I am unable to edit the code. I will check it out again the next time I need to use a video on a post. Thanks Jim and Samantha!

  • jimdougherty

    Thanks Lisa! Next time (if you like) I’d be happy to help troubleshoot for my own educational purposes.

  • http://twitter.com/dave_guzman David Guzman

    Thanks Jim, GREAT article! Thanks for sharing!

  • Beena

    Thanks for help :)

  • jimdougherty

    Of course!

  • jimdougherty

    Appreciate the note, David – Thanks!

Top