Canton Becker

Jump to content.

How to change the width of an automatic WordPress embed

One of the superb things about WordPress is that it will automatically convert YouTube URLs into embeds (as well as URLs pointing to Vimeo, Flickr, Hulu etc.)

For example, the video you see embedded on this post was supplied from within the WordPress post editor like this:

How to change the size for an individual embed:

If you need to make an embed bigger or smaller for a particular page or post, you can override the global media settings by adding a little code to your post, like this:

[embed width="390" height="300"]http://www.youtube.com/watch?v=XYZ[/embed]

How to set the size of automatic embeds for your entire WordPress site in WP 3.5 and above:

Add this code to your theme’s functions.php document, setting your own width and height of course.


add_filter( 'embed_defaults', 'bigger_embed_size' );

function bigger_embed_size()
{ 
  return array( 'width' => 600, 'height' => 430 );
}

How to set the size of automatic embeds for your entire WordPress site in versions before 3.5:

Login as the WordPress admin and go to Settings: Media. There you’ll see boxes for setting your maximum embed height and width. This will change the width of your embeds throughout your whole site. It’s retroactive so if you change theses settings, they’ll impact embeds even on posts and pages you authored before making the update.

Login as admin, look for Settings: Media

9 comments

  1. Joe sam | Web Design Company posted on August 24, 2012:

    WordPress is really the great cms. Thanks for sharing the tutorial it really helps to change the width for embeds with in it .

  2. Roberto posted on October 18, 2012:

    Very tanks for de tuts, helped alot, great… mor users of wordpress.org, should know this tips, i spend an lot time to find… thanks!

  3. Brady Partridge posted on December 14, 2012:

    Alas, I have the latest version of WordPress and there is no setting for this.

  4. dli posted on January 23, 2013:

    I can;t find embeds in my admin panel, please help !

  5. izzie posted on April 7, 2013:

    Hello, I’ve tried this but it just won’t work for me. I’ve spent 2 days now figuring out how to make the youtube video’s smaller on my blog, but nothing seems to work and they take up the whole screen; what the heck am i doing wrong? It’s so frustrating!!!

  6. How to change the width of an automatic oEmbed in WordPress | The WP Guru posted on May 4, 2014:

    […] to your theme’s functions.php file and feel free to experiment with those values. Thanks to Canton Becker for this […]

  7. Ben Yanke posted on May 16, 2014:

    Do you know where the raw HTML for the embed code is actually stored? I want to completely customize the youtube embed code…

  8. OneBandMan posted on November 1, 2014:

    Thank you :)

  9. Adrian posted on February 11, 2015:

    Thank you, that works on my site !

RSS feed for comments on this post.

Leave a comment

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>



Read more

«
»