YouTube oEmbed auto-resizes to the wrong size
Lately I’ve been having the same problem across multiple browsers and multiple WP blogs (all running 3.1.3 or 3.1.2) with the auto-embed/oEmbed functionality. Any YouTube video that’s embedded this way is displayed at a size that is just slightly too wide. This results in thin black bars on the left and right of the video, and happens with videos that are 16:9 or 4:3 aspect ratio.
Examples can be seen here: http://www.canopyco.com/blog/
Even when using the [embed] shortcode and specifying a width and height, that only defines the maximum width & height and still automatically sizes the video. I’m not sure if this is a YouTube/oEmbed problem or a WP problem.
Anyone else experiencing this? Anyone have a fix?
I have the same exact problem, and it’s been going on for a few iterations of WP now. Very annoying.
I took a look at your website, it looks fine to me (as far as I can tell). Take a look at mine, 2 videos, one has the correct size of 600px, the other is out of whack: http://tambnguyen.com/20110727/julia-roberts-makeup-ads-banned-in-uk-for-too-much-photoshop/
Here’s an example of both Vimeo and Youtube videos are embedded. Again, Vimeo looks perfect, while Youtube looks jacked: http://tambnguyen.com/20110724/a-few-fashion-videos-of-miss-universe-albania-angela-martini/
I use the method of inserting just a text-only link.
Have you tried:
– deactivating all plugins to see if this resolves the problem. If this works, re-activate the plugins one by one until you find the problematic plugin(s).
– switching to the Twenty Eleven theme to rule out any theme-specific problems.
– resetting the plugins folder by FTP or PhpMyAdmin. Sometimes, an apparently inactive plugin can still cause problems.
zOmg thank you esmi the Theme Diva! I found it.
Surprise surprise, it’s the WordPress’ Jetpack plugin that’s messing it up. Once the minute I turned it on, BAM! it broke.
How do I fix this?
Really?! Does it still happen if you use the Twenty Eleven theme? If so, this would be worth reporting as a bug in the plugin.
Actually, without the plugin, it works perfectly with my theme. I’ve checked all the theme files and searched for “embed” but nothing came up, so I know it has nothing to do with my theme.
I’ll dive into the youtube.php to see what I can find….
Hmm… this is a jungle that might take me a while to go through. It looks like someone did the math wrong, that’s my best guess at the moment.
My media max width is set to 600px, and this is the HTML code that was returned:
<p><object width="600" height="475"><param name="movie" value="http://www.youtube.com/v/sfAPT1_0TDg?version=3"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/sfAPT1_0TDg?version=3" type="application/x-shockwave-flash" width="600" height="475" allowscriptaccess="always" allowfullscreen="true"></embed></object></p> <p><span style='text-align:center; display: block;'><object width='640' height='390'><param name='movie' value='http://www.youtube.com/v/Ei6JvK0W60I?version=3&rel=1&fs=1&showsearch=0&showinfo=1&iv_load_policy=1'/><param name='allowfullscreen' value='true'/><param name='wmode' value='opaque'/><embed src='http://www.youtube.com/v/Ei6JvK0W60I?version=3&rel=1&fs=1&showsearch=0&showinfo=1&iv_load_policy=1' type='application/x-shockwave-flash' allowfullscreen='true' width='640' height='390' wmode='opaque'></embed></object></span></p>
How do we report a bug?
Post it via http://wordpress.org/tags/jetpack?forum_id=10#postform That should ensure that it is tagged & highlighted correctly to attract the right attention.
Thanks. I’ve submitted it here http://wordpress.org/support/topic/plugin-jetpack-by-wordpresscom-problem-with-youtubephp-embedding-the-wrong-size?replies=1
This is a recurring issue indeed. Whenever I use oEmbed the video is displayed with the proper width (as I have it in the media settings of the dashboard), but the height of the video is weird, so that the video isn’t shown completely.
I must mention that I didn’t put a value under the “height” in the media settings of the dashboard. This is because I thought the oEmbed would adjust the height to whatever the width was just in case the video’s ratio was 4:3 instead of 16:9
Yup, I have the “height” in media setting as 0 as well. It doesn’t look like anyone’s working on this though. Meh, WP’s built-in works just well for now, and I’m fine with it not making a few extra PHP function calls.
Same here – using oEmbed the video is displayed with the proper width but doesn’t seem to account for the 35px height of the YT player bar – not sure if this is an Oembed, WP or youtube issue though but someone needs to sort it – I’ve noticed it on at least 3 different sites today!
Likewise, I have the same issue. As Zissou noted, the auto-selected height is simply not accounting for the 35px height added by the YouTube player bar.
I’d use the <iframe> embed offerred by YouTube but then it won’t resize automatically for mobile via WPTouch.
If anyone knows of a solution, please share it as I’d like video tutorial series to finally appear properly… http://learningdslr.com/category/back-to-basics/
It’s YouTube having changed things. Which is annoying.
Try using Viper’s Video Quicktags (or the shortcodes in Jetpack) which seem to handle this a little better.
just disable jetpack’s shortcode and you should be okay for now. although, if you’d embedded those things with special parameters, obviously they’ll break.
I don’t want to set a fixed height and width as parameters as my goal is to allow the mobile theme to adjust the size on its own as needed (i.e. for the given device screen size).
I guess I’ll have to test more to see if WPTouch is smart enough to ignore those directives.
- The topic ‘YouTube oEmbed auto-resizes to the wrong size’ is closed to new replies.