Envira Gallery Blog

Digital Photography Tips, Tutorials and Resources

Remove Black Bars from a Video

How to Remove Black Bars from a Video Embed in WordPress

by Waseem Abbas on Oct 23, 2017

Do you want to add fullscreen videos on your WordPress site? Sometimes you may need to display videos without the top and bottom black bars, so your users can view the video end-to-end on their screen. In this tutorial, we will share how to remove black bars from a video embed in WordPress.

By default, the video embed in WordPress from any resource like YouTube, Wistia, and more will appear as it is in the original video. You need to use a plugin like Envira Gallery to get full control on how you want to display your videos to the users.

To remove black bars from a video embed in WordPress, you’ll need to follow these 6 steps:

  • Step 1. Install and activate Envira Gallery plugin
  • Step 2. Install and activate Envira’s Videos Addon
  • Step 3. Create a new video gallery in WordPress
  • Step 4. Go to video settings and force larger videos
  • Step 5. Edit the videos to adjust width and height
  • Step 6. Show these videos in your WordPress pages

Ready to get started? Let’s go!

Step 1: Install and Activate Envira Gallery Plugin

The first thing you need to do is to install and activate Envira Gallery plugin on your WordPress site.

Envira Gallery

To learn about the installation process of this plugin, you should check out this guide on how to install and activate Envira Gallery.

Step 2: Install and Activate Envira’s Videos Addon

Upon activating the plugin, you need to go to Envira Gallery » Addons to install and activate Videos Addon.

To access this addon, you must have Envira Pro or higher license. Simply upgrade your Envira license here.

Videos Addon

Videos addon allows you to add videos on your WordPress site and gives you the full control on them.

Step 3: Create a New Video Gallery in WordPress

After you have installed the plugin and addon, simply go to Envira Gallery » Add New from your WordPress admin backend.

You need to add a title and drop your videos in the Native Envira Gallery section.

Add Videos

However, this will only take the self-hosted videos. If you want to add videos from other resources like YouTube, Wistia, and more, then click on the Select Files From Other Sources button.

It will open a popup where you can add your videos.

Add Videos

To learn about the other basic settings, you should check out this guide on how to create a responsive video gallery in WordPress.

Step 4: Go to Video Settings and Force Larger Videos

Once you have added your videos, scroll down to Videos tab and check mark to Force Larger Videos setting.

force larger videos without black bars

This will affect your YouTube and Wistia videos to display them on full screen instead of the original size and remove black bars from a video.

Step 5: Edit the Videos to Adjust Width and Height

The above settings will not affect your self-hosted or other videos. Though you can manually edit them.

Simply go to Images tab and click on the edit (pencil) icon. It will open a lightbox popup for you to edit metadata of the video. Scroll on the right side to add your video width and height.

Video Width and Height

You can change the width and height till you get the required result.

Step 6: Show These Videos in Your WordPress Pages

After all the settings, you need to click on the Publish button. Copy the shortcode from Envira Gallery Code widget.

Copy Shortcode

To display your videos, you need to go to WordPress Pages/Posts » Add New or edit an existing page/post. In the visual editor, simply paste the shortcode.

Paste Shortcode

Hit the Publish/Update button and visit your site to see the videos.

That’s all. We hope this tutorial has helped you to learn how to remove black bars from a video embed in WordPress. You may also want to check out our guide on how to create an image gallery with thumbnails in WordPress. In case, you videos are loading slow on your site, we recommend you to check this ultimate guide to boost speed and performance.

If you like this tutorial, then please follow us on Twitter and Facebook for more free WordPress guides and resources.

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.