Make WordPress Twitter Embeds Responsive

By default WordPress twitter embedded tweets have a fixed width of 550px which is added to the inline style with an !important declaration to stop you overriding it. This breaks responsive layouts and causes horizontal scrolling as soon as your site is viewed at less than 550px wide.

Add the following to your themes functions.php file:

  1. add_filter('oembed_result','twitter_no_width',10,3);
  2. function twitter_no_width($html, $url, $args) {
  3. if (false !== strpos($url, 'twitter.com')) {
  4. $html = str_replace('width="550"','',$html);
  5. }
  6. return $html;
  7. }

This removes the hardcoded 550px width from the generated output. If you've got existing embedded tweets you'll need to re-save the posts to regenerate the embed code.

Thanks to Otto for the tip.

6 thoughts on “Make WordPress Twitter Embeds Responsive

  1. Pingback: Jacob Bergmeier's Portfolio

Leave a Reply

Your email address will not be published.

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