How to center oEmbedded content

I understand you have to paste the link that you’re embedding without any code wrapping around it, but how do I force the embedded content to be centered? Currently, the default is aligning to the left.

I could modify the core file, but it’s highly discouraged, so I’m asking to see if there’s any hook or filter to get around this.

Read More

Thanks!

Related posts

2 comments

  1. After some Googling, I found a solution that was originally done for a Twitter embed, but I modified it to work with all oEmbed contents. Keep in mind that for this to work on existing posts, you’ll need to do an “update” for the oEmbed content to refresh from the cache.

    add_filter('oembed_result','center_oembed',10,3);
    function center_oembed($html, $url, $args) {
        $html = '<p style="text-align: center;">' . $html . '</p>';
        return $html;
    }
    
  2. Quick and dirty CSS fix I came up with for Twitter oEmbed (.entry-content is specific to the theme):

    .entry-content > iframe {
        margin: 0 auto !important;
    }
    

    Seems to work, YMMV.

Comments are closed.