Using videos in your posts, as well as other types of media, will enrich them, which is a very good thing for content marketing, user experience, and on-page SEO!
Usually, when you embed a video in your blog post, it will be displayed on the left side, which might look ugly. So, in this article, we’ll give you a tip on how to center a video in WordPress!
For our example, we’ll use YouTube, which is the most common way of adding videos to your posts.
This tip also applies to other video-sharing websites, like Vimeo, Vine, and others.
How to embed a video in WordPress
The simplest way to embed a video in WordPress is to just copy the video’s link (e.g. https://www.youtube.com/watch?v=pov5VBarQt8 ), then paste it into your post’s text editor, and WordPress will automatically load it.
Usually, when you use this method, the video will cover the whole width of your content area:
This method won’t work for all video-sharing websites!
If you want the YouTube video to be smaller in size or you want to toggle different options, like “Show player controls”, “Show video title and player actions”, etc., you’ll need to get the Embed code, which looks something like this:
<iframe width="400" height="225" src="https://www.youtube.com/embed/pov5VBarQt8" frameborder="0" allowfullscreen></iframe>
The thing is that after you insert the embed code in your post, your video will most likely appear like this:
As you can see, it’s not centered, a thing which leads us to our main topic.
How to center the video
In order to center a video, you’ll need to add a piece of code around the embed part. Don’t worry, it’s simple.
After you added your embed code in your post’s Text (not Visual) editor, you need to wrap this code around it:
<div style="text-align: center"></div>
So it should look something like this (click to enlarge):
After adding that code, our example video should be centered. Let’s check it out:
Yep, it’s centered!
Note that on a lot of themes, the video won’t be responsive anymore when using an embed code. So, check this guide on how to make embedded YouTube videos responsive.
Conclusion
Now that you know how to center a video in WordPress, your content will look more organized and appealing!
Note that if you just paste the video’s link, not the embed code, as I mentioned above, you won’t need to center it anymore, of course, because it will cover the whole width of your post!
Hope you enjoyed our post! If you have any questions or thoughts, please drop a comment!
Hi
Nice one. This was a great help. But you need to update your post. there is a slight error. The picture with the code is correct but the text with the code explaining it has an extra colon in there…. … just after center
Feel free to update this comment box after you do the edit to just the first two sentences and the last two.
Thanks for your help.
Donncha
Hello! Thanks for the heads-up! I’ve made the modification.
Great tip. Been scratching my head over this for a while :-)
Pasting the link, or embedding it, shows the video on the page when I refresh. But when I try to centre it by adding the code around it, it only shows up as the URL. Any idea why?
Just pasting the link won’t work, you need the embed code. If that doesn’t work as well, then different things can interfere with it, like your theme, a plugin, a page builder, if you’re trying to add it using that…