beer planet » fs=1 http://beerpla.net where things have nothing to do with beer - tutorials, tips, how-tos, thoughts, hacks, and other techy nonsense Sun, 08 Aug 2010 23:59:10 +0000 en hourly 1 http://wordpress.org/?v=3.0.1 Are Your Youtube Video Embeds Missing The Full Screen Button? Here Is How To Fix It http://beerpla.net/2010/01/12/are-your-youtube-video-embeds-missing-the-full-screen-button-here-is-how-to-fix-it/ http://beerpla.net/2010/01/12/are-your-youtube-video-embeds-missing-the-full-screen-button-here-is-how-to-fix-it/#comments Tue, 12 Jan 2010 08:35:46 +0000 Artem Russakovskii http://beerpla.net/?p=1350 youtube thumb Don't you just hate it when you visit somebody's blog, see an embedded Youtube video, play it, and find that the player is missing the full screen button.

Yeah, this one: youtube fullscreen button.

Well, I hate it too, so please, try not to be that guy. I realize sometimes you copy the embed code wrong or, on a larger scale, you add the wrong embed code to your generic template.

Not a problem. If your Youtube embeds are missing this button, here is how you can easily fix...

Read the rest of this article »

]]> youtube thumb Don't you just hate it when you visit somebody's blog, see an embedded Youtube video, play it, and find that the player is missing the full screen button.

Yeah, this one: youtube fullscreen button.

Well, I hate it too, so please, try not to be that guy. I realize sometimes you copy the embed code wrong or, on a larger scale, you add the wrong embed code to your generic template.

Not a problem. If your Youtube embeds are missing this button, here is how you can easily fix it.

The Problem

Here's an example video that doesn't have the button (it's really good too, if you haven't seen it yet):

The fullscreen button is nowhere to be found because by default the Youtube player doesn't include it and the embed code is missing the correct pieces.

Here is the embed code for the video above without the full screen button:

<object width="425" height="344">
  <param
    name="movie"
    value="http://www.youtube.com/v/sdUUx5FdySs&hl=en_US">
  </param>
  <param
    name="allowscriptaccess"
    value="always">
  </param>
  <embed
    src="http://www.youtube.com/v/sdUUx5FdySs&hl=en_US"
    type="application/x-shockwave-flash"
    allowscriptaccess="always"
    width="425"
    height="344">
  </embed>
</object>

The Solution

Modify the code by adding the following:

  • put this after the last <param> and before the <embed>: <param name="allowFullScreen" value="true"></param>
  • add this after any parameter to <embed>: allowfullscreen="true"
  • append this to both the "value" parameter of the <param> tag with the name="movie" as well as the src parameter of the <embed> tag: &fs=1

The first 2 parameters give Flash access to go full screen. The last one instructs the Youtube player to add the full screen button.

Here is the final embed code:

<object width="425" height="344">
  <param
    name="movie"
    value="http://www.youtube.com/v/sdUUx5FdySs&hl=en_US&fs=1">
  </param>
  <param
    name="allowscriptaccess"
    value="always">
  </param>
  <param
    name="allowFullScreen"
    value="true">
  </param>
  <embed
    src="http://www.youtube.com/v/sdUUx5FdySs&hl=en_US&fs=1"
    type="application/x-shockwave-flash"
    allowscriptaccess="always"
    allowfullscreen="true"
    width="425"
    height="344">
  </embed>
</object>

Voila!

By the way, if you are wondering why you have to include both the object and embed tags, duplicating parameters left and right, well, it's to satisfy both IE and other browsers. Firefox, for example, uses the embed part, while IE uses the object one.

Similar Posts:

Share/Bookmark

]]> http://beerpla.net/2010/01/12/are-your-youtube-video-embeds-missing-the-full-screen-button-here-is-how-to-fix-it/feed/ 5