Option 1: Add the Video URL Directly (The Easy Way)

If you’re embedding a YouTube or Vimeo video, the simplest approach is to paste the video URL directly into the WordPress editor, without using the embed code at all.

Here’s how to do it:

1. Copy the URL from your YouTube or Vimeo video (just the regular link from your browser’s address bar).
2. In the WordPress editor, paste the URL on its own line in the content area.
3. WordPress will automatically detect it and display it as a full-width, responsive video that fills your content area.

This is the recommended method because it’s responsive, clean, and requires no extra code. The video will look great on both desktop and mobile.

Option 2: Use HTML to Center Align an Embed Code

Sometimes you need to use the full embed code, for example when you want to control the video size or use a platform other than YouTube or Vimeo. In that case, you’ll need to wrap the embed code in a small snippet of HTML to center it on the page.

Here’s how to do it:

1. Go to the page or post where you want to add the video.
2. Switch from the Visual editor to the Text (HTML) editor. In the classic editor, you’ll find this tab in the top right corner of the content area. In the block editor, you can add an HTML block.
3. Wrap your embed code with the following HTML:

<div style="text-align: center;">
  YOUR EMBED CODE HERE
</div>

So if your embed code looks something like this:

<iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEOID" frameborder="0" allowfullscreen></iframe>

The final code would look like this:

<div style="text-align: center;">
  <iframe width="560" height="315" src="https://www.youtube.com/embed/VIDEOID" frameborder="0" allowfullscreen></iframe>
</div>

4. Save your changes and preview the page. Your video should now be centered in the content area.

A Quick Note About Uploading Videos Directly to WordPress

It’s generally not recommended to upload video files directly to WordPress. Video files are large and can slow your site down significantly, which affects both user experience and your search rankings. Hosting your videos on YouTube or Vimeo and embedding them is a much better approach for site performance.

If you do upload a video directly and it’s not filling the content area, the same HTML centering trick above will work as long as the video’s width is smaller than your content area.

Using the Block Editor? Here’s the Shortcut

If you’re using the WordPress block editor (Gutenberg), centering a video is even easier. When you add a Video block or an Embed block, look for the alignment options in the block toolbar at the top. You’ll see icons for left, center, and right alignment. Just click the center icon and you’re done.

Need help with your WordPress site? We’re happy to help.