How can I force oEmbed to display fixed height & width dimensions?

I'm trying to explore new ways of embedding videos on to my site as a few of my contributors are having trouble viewing flash embeds when they use the preview function.

Ideally it would be easiest to use oEmbed via the [embed] shortcode but i'm running into a problem that I don't seem to be able to find a solution for.

I know that you can specify the maximum dimensions of the embed via the Media tab, but that is not what I want to do. Every single photo or video displayed on our site is 560px x 340px for continuity purposes and those are the dimensions I want to force onto the oEmbeds, but I cannot find a way to do it!

Looking for help here as Google has been useless!

Topic flash embed oembed Wordpress

Category Web


When you're referring to using oEmbed codes, I'm assuming that you're referring to WordPress' ability to take a URL to media (such as one from YouTube) and automatically embed that into a post.

If that's the case, then you can take advantage of the embed_oembed_html hook that WordPress provides.

Here's how you can do it with a custom function:

function example_custom_oembed_dimensions($html, $url, $args) {

    // Set the height of the video
    $height_pattern = "/height=\"[0-9]*\"/";
    $html = preg_replace($height_pattern, "height='560'", $html);

    // Set the width of the video
    $width_pattern = "/width=\"[0-9]*\"/";
    $html = preg_replace($width_pattern, "width='340'", $html);

    // Now return the updated markup
    return $html;

} // end example_custom_oembed_dimensions
add_filter('embed_oembed_html', 'example_custom_oembed_dimensions', 10, 3);

You mention that you're using a consistent width and height for media across your site, but you're not interested in using the Media Settings page.

For consistency, you can programmatically force the values in the Media Settings and them use them in filters throughout your work.

For example, first we need to set the media size:

function example_force_media_size() {

    if(get_option('embed_size_w') != 560) {
        update_option('embed_size_w', 560);
    } // end if

    if(get_option('embed_size_h') != 340) {
        update_option('embed_size_h', 340);
    } // end if

} // end example_force_media_size
add_action('init', 'example_force_media_size');

Now, whenever anyone tries to overwrite those settings in the Media Settings page, this function will fire and force the values.

Next, you can retrieve those values and then use them when embedding your media:

function example_custom_oembed_dimensions($html, $url, $args) {

    // Find the height value, replace it with Media Settings value
    $height_pattern = "/height=\"[0-9]*\"/";
    $height = get_option('embed_size_h');
    $html = preg_replace($height_pattern, "height='$height'", $html);

    // Find the width value, replace it with Media Settings value
    $width_pattern = "/height=\"[0-9]*\"/";
    $width = get_option('embed_size_w');
    $html = preg_replace($width_pattern, "width='$width'", $html);

    // Now return the updated markup
    return $html;

} // end example_custom_oembed_dimensions
add_filter('embed_oembed_html', 'example_custom_oembed_dimensions', 10, 3);

The first function may be all that you need, but forcing the values for the Media Settings could make it easier to write custom filters around other types of media, as well.


If you are trying to embed flash videos you should try kimili falsh embed plugin.. makes embedding flash easier and makes it easier to control size and more.

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.