How to Add Video in UX Builder on WordPress and Display It on Mobile

Other than well-written articles or posts, adding photos and videos on your WordPress website is a great way to communicate and relay your message to visitors. In this article, we will teach you how to add a video using UX Builder through a step-by-step guide.

1. In the Admin panel, go to the Media tab and upload the video file as shown below.

How to Add Video in UX Builder on WordPress and Display It On Mobile

2. Once the upload is done, click the icon of the uploaded video file from the Media Library. The Attachment Details window will appear. Copy the URL or link of the file.

How to Add Video in UX Builder on WordPress and Display It On Mobile

3. Then go to Pages and select the page you want to add a video in.  

How to Add Video in UX Builder on WordPress and Display It On Mobile

4. Click Edit with UX Builder.

How to Add Video in UX Builder on WordPress and Display It On Mobile

5. Click + Add Elements on the left. The Add Content panel will appear. From the choices, select Banner under Content. Afterwards, choose Blank from the Preset options. Then scroll down and click the Apply button.  

How to Add Video in UX Builder on WordPress and Display It On Mobile

6. Before adding the video, make sure to delete the text in the banner. To do this, click on the text. You will then see a gear icon on the top-left side of the text box. Click the icon then select Delete.

How to Add Video in UX Builder on WordPress and Display It On Mobile

7. Then click anywhere outside the text box to view the Banner element panel which will appear on the left. Scroll down to the Video section. On the Video MP4 field, paste the link of the uploaded video.

How to Add Video in UX Builder on WordPress and Display It On Mobile

8. Afterwards, set the height under the Layout section at the top of the panel.

How to Add Video in UX Builder on WordPress and Display It On Mobile

9. Then to display the video in all devices including mobile, scroll down to the Advanced section. In the Visibility field, select Visible from the dropdown menu.

How to Add Video in UX Builder on WordPress and Display It On Mobile

10. Finally, click on Apply and then Update to save the changes.  

How to Add Video in UX Builder on WordPress and Display It On Mobile

Got similar enquiries or want to level up your website? We’re here for you! Just click the button below to talk to one of our team members.

Human Pixel has always provided white glove service and had a very hands-on approach.

- Kelsey, Equifax Workforce Solutions, With Human Pixel since 2016

Join thousands of our passionate customers

Yes, I agree with the privacy policy.

No Thanks