Skip to main content

Beginner’s Guide: How to Center Align a Video in WordPress

Do you want to center align a video in WordPress? By default, if your video’s width is less than your article area, then WordPress automatically aligns it to the left leaving extra white space on the right side. In this article, we will show you how to easily center align a video in WordPress.

How to center align a video in WordPress

Why Center Align Videos in WordPress?

By default, when you embed a video in WordPress it is automatically aligned to the left. This is because videos are external content embedded in the content, so WordPress is unable to guess how you would like to display it.

As a best practice, it automatically aligns it to the left. Leaving it up to you to adjust the alignment if needed.

Left aligned video in a WordPress post

We don’t recommend uploading videos directly to WordPress, but the same thing will happen with uploaded videos if their width is less than your content area.

That being said, let’s see how you can easily center align a video in WordPress or make it wider so that it looks good with in your content.

How to Center Align Video in WordPress

If you want your video to fill the width of your content area, then the best way to do this is by adding a YouTube or Vimeo video URL directly in post editor instead of using the embed code.

By simply entering the URL, WordPress automatically tries to display the video that fits your content area.

Add video URL to embed video in WordPress

However sometimes for one reason or another, you may need to use the embed code. In that case, you will need to add some simple HTML around your video’s embed code.

First, you need to switch to the text editor on post edit screen. After that, you need to add the following HTML code around your video embed code:

<div style="text-align:center;">

/// your video embed code goes here

</div>

You can now save your changes and preview the post or page. Your video will be neatly aligned in the center of your content area.

Video aligned to the center

Another approach is to increase the width of your video manually to fit the content area. To achieve this, you simply need to add or change the “width” parameter in your embed code.

<iframe width="760" height="315" src="https://www.youtube.com/embed/4YpyiJ05YOg" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

If you are uploading a video directly in WordPress, then you can increase the width by using the video shortcode.

After inserting your video using the default media uploader, switch to the ‘Text’ editor and increase the width parameter in video shortcode.

[video width="720" height="360" mp4="http://example.com/wp-content/uploads/2018/03/your-vide.mp4"][/video]

Video shortcode

We hope this article helped you learn how to center align a video in WordPress. You may also want to see our comparison of YouTube vs Vimeo to see which one is better for your website.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post Beginner’s Guide: How to Center Align a Video in WordPress appeared first on WPBeginner.

from: WPBeginner
via Editorial Staff

Source: Beginner’s Guide: How to Center Align a Video in WordPress Via Business Advice.

Comments

Post a Comment

Popular posts from this blog

7 Ways to Grow Your SaaS Startup Faster

Every startup looks for ways to catapult a business to success. Here are some tips for accelerating growth for SaaS (software as a service) companies. 1. Start charging early SaaS startups are often hesitant about charging customers. They think that their product is not yet ready, that it’s necessary to get traction and focus on expanding their customer base rather than on growing revenue. Deep inside, however, they often don’t just have enough faith in their product and are not sure if someone will buy it at all. They prefer keeping hundreds or thousands of free users to attempting to win a few serious customers. Big numbers are comforting but the product remains an unverified idea. Building a product should imply increasing revenue. So don’t hesitate too much—put it to the test by charging and see if it works in the real conditions. This is one way to minimize your risk too. Instead of waiting to launch until you’ve invested huge amounts of time and money, launch early. If...
Post a Comment
Read more

How to Add Web Push Notification to Your WordPress Site

Do you want to add push notifications to your WordPress site? Push notifications allow you to send notifications to users even when they are not visiting your website. In this article, we will show you how to easily add web push notifications to your WordPress site. We will also talk about the best WordPress push notification plugins and how to send desktop & mobile push notifications from your WordPress site. What is Push Notification? Push notifications are clickable messages displayed on top of user’s desktop or notification area on their mobile device. They can be shown even when the user’s browser is not open. Aside from desktop, web push notifications also work on mobile devices. This allows you to reach your users across devices with latest updates and offers. Web push notifications have proven to be a very effective way to convert website visitors into customers and loyal followers. Why Add Web Push Notifications to Your WordPress Site? We have already discussed tha...
Post a Comment
Read more

7 Best WordPress Job Board Plugins and Themes

Are you looking for the best WordPress job board plugin? There are several WordPress job board plugins that you can use to easily create a job board and charge other companies to post jobs. It is one of the ways to make money from your blog , and you can even use it to post your own job openings. In this article, we have picked the best WordPress job board plugins and themes that you can use. Building a Job Board Website with WordPress WordPress is currently one of the most popular website builders in the market, powering more than 30% of all websites on the internet. It can be used to build almost any kind of website including a job board website. There are two types of WordPress websites which often confuses new users. First, there is WordPress.com which is a hosted solution. Second, you have WordPress.org also called self-hosted WordPress. See our article on WordPress.com vs WordPress.org for a side-by-side comparison. We recommend using self-hosted WordPress.org because it g...
Post a Comment
Read more