How to Center a Video in WordPress

How to Center a Video in WordPress

Frustrated that you can’t get your videos centered in your WordPress posts? Maybe you have a post that looks like this:

not-centered

Continue reading, or jump ahead using these links:

Center a Video in WordPress

With WordPress, you can go to a place like YouTube, copy the URL, put it into your post, and your video will show up automatically.

With this little trick, however, you will need to get the full embed code (not just the URL).

embed-code

Once you have the embed code, go the TEXT tab in your editor, and put the your embed code in the middle of the following snippet of code where it says “embed-code.” (*Code updated.)

<div style="text-align:center">embed-code</div>

It should look something like this:

text-tab2

And that’s it. You should now get a centered video like the one below.

centered-video

Make the Video Full Width

While centered is better then left-aligned, what many people would actually prefer is a video that covers the full width of their post.

FREE EBOOK
Your step-by-step roadmap to a profitable web dev business. From landing more clients to scaling like crazy.

By downloading this ebook I consent to occasionally receive emails from WPMU DEV.
We keep your email 100% private and do not spam.

FREE EBOOK
Plan, build, and launch your next WP site without a hitch. Our checklist makes the process easy and repeatable.

By downloading this ebook I consent to occasionally receive emails from WPMU DEV.
We keep your email 100% private and do not spam.

You can do that by using the embed code too. On YouTube (or wherever), just change the embed to be a larger size. YouTube makes this very convenient. You only need to put in the width you want, and it will calculate the height for you in order to keep the video the same ratio.

Let’s say, for example, that I know the width of your post area is 700px. Just put that into the width box on YouTube. You will also see the sizes change in the embed code itself. If you don’t know the width of your posts, just play with it till you get it right.

(You’ll notice that YouTube has some common sizes already listed in a pull-down menu. You’ll need to choose “Custom size” if you want anything other than those sizes.)

custom

And here’s a full width look:

full

*Note: Of course if your video is the full width of your post, there’s no need to center it. You can just paste the embed code into your Text tab area.