Why Centering Videos in WordPress Matters

A properly centered video:

• Improves visual balance and readability
• Keeps users focused on your content
• Creates a more professional, modern layout
• Enhances mobile responsiveness

Misaligned videos can distract users and disrupt your page design, which ultimately hurts engagement.

Method 1: Center Align a Video in Gutenberg (Block Editor)

If you’re using the modern WordPress editor (Gutenberg), this is the easiest method.

Step-by-Step Instructions

1. Open your post or page in WordPress
2. Click the “+” (Add Block) button
3. Select the Video block or paste a video URL (YouTube, Vimeo, etc.)
4. Click on the video block
5. In the toolbar above the block, select “Align Center”

WordPress provides built-in alignment options including left, center, right, wide, and full width.

Pro Tip

If your video still looks off-center, adjust the width using block settings or drag the resize handles before applying center alignment.

Method 2: Center Align Video in the Classic Editor

Still using the Classic Editor? No problem.

Visual Editor Method

1. Click Add Media and insert your video
2. Select the video inside the editor
3. Click the center alignment button in the toolbar

HTML (Text) Method

If the visual editor doesn’t work, switch to the Text tab and wrap your video embed code like this:

This forces the video to center regardless of editor limitations.

Method 3: Center Align Videos with Custom CSS

If your theme overrides alignment settings, CSS gives you full control.

Option 1: Quick Inline Fix

Add a custom class to your video block:

Then add this CSS:

Option 2: Theme Customizer

1. Go to Appearance → Customize → Additional CSS
2. Paste the CSS above
3. Publish your changes

This is especially useful when alignment settings don’t work due to theme conflicts—a common issue WordPress users run into.

Method 4: Center Videos Using Page Builders (Elementor, etc.)

If you’re using a page builder:

Elementor Example

1. Edit your page with Elementor
2. Drag in the Video widget
3. Go to the Style tab
4. Set Alignment → Center

Page builders make alignment extremely simple with visual controls—no code required.

Common Issues (And Fixes)

Video Won’t Center

• Your theme may override alignment → use custom CSS

Looks Centered in Editor But Not Live

• Clear cache (browser + plugins)
• Check for conflicting plugins

Video Too Wide

• Set a max width (e.g., 800px) before centering

Not Mobile Responsive

• Use percentage widths (e.g., 100%) instead of fixed pixels

Best Practices for Centering Videos

• Keep video widths consistent across pages
• Avoid full-width videos unless intentional
• Use responsive embeds for mobile devices
• Pair videos with supporting text or captions
• Test on desktop and mobile before publishing

Final Thoughts

Centering a video in WordPress is simple—but doing it correctly makes a big difference in how your content is perceived.

For most users, the Gutenberg editor’s built-in alignment tools will do the job. For more control, CSS and page builders offer flexible alternatives.

If your videos look off, don’t ignore it—fixing alignment is a quick win for both user experience and SEO.