Removing the Height From WordPress Embeds

Nov 02 2011

A while back I switched the theme for my other WordPress blog, Cracker and Cheese, to the swanky new Twenty Eleven theme. It’s a great theme, but I ran into an issue with my embeds. See, almost all the photos posted on that blog in the last year or so are oEmbeds from our Flickr account. Flickr delivers the properly sized image for embedding based on the size you choose in the Settings > Media admin screen.

The issue I was running into was that the file delivered by Flickr was less wide than my content area and if I went to a larger size, the height parameter would stretch the image vertically. What to do?

After some Googling that led me to a post from my good friend and cohort Joe Pahl, I decided that what I really wanted to do was remove the height attribute from embedded elements, but only the ones coming from Flickr. Since the max-width is handled by WordPress, I figure this is a low risk maneuver, but it’s not for everyone. If you decide to do it, here’s some code to help:

function strip_height_from_embeds($content) {
    if (false !== strpos($content,"flickr")) {
        $content = preg_replace("/height=\"(\d*)\"/","",$content);
    }  
    return $content;
}

add_filter('embed_oembed_html','strip_height_from_embeds');

2 responses so far

  1. technabob on "YouTube oEmbed auto-resizes to the wrong size" | Upgrade Wordpress
    on 14 Dec 2011 at 6:20 pm

    [...] think a filter similar to this: http://www.bsdeluxe.com/removing-the-height-from-wordpress-embeds/ or [...]

  2. wrogs
    on 08 Feb 2012 at 9:40 am

    hi!!!

Leave a Reply

  • About bsdeluxe

    Hello. My name is Bob Sherron and I make websites for fun and profit. I live in St. Louis with my wife and kid and dog and the blog about that is right over here. Disclaimer: The opinions expressed within are my own, and in no way reflect the opinions of any of my employers.

    Follow me on Twitter