virusword.com

Learn Wordpress

Home/Videos/Add Video Background in WordPress – Free! | WordPress Tutorial for Beginners

Add Video Background in WordPress – Free! | WordPress Tutorial for Beginners



Learn how to add video backgrounds to WordPress in this video. We’ll demonstrate 2 methods, one with and one without a plugin.

Grab the Advanced WordPress Background Here (It’s FREE) 👉🏽👉🏽 https://wordpress.org/plugins/advanced-backgrounds/

✅✅ 👇🏽👇🏽 Here are some of our recommended products 👇🏽👇🏽 ✅✅

✅ Astra – The Most Popular WordPress Theme 👉🏽 https://bsf.io/astra/

✅ Schema Pro – Add Schema To Your Website 👉🏽 https://bsf.io/schemapro/

✅ Ultimate Addons for Elementor 👉🏽 https://bsf.io/ultimateelementor/

✅ Ultimate Addons for Beaver Builder 👉🏽 https://bsf.io/ultimatebeaver/

✅ Convert Pro – Convert Visitors to Subscribers 👉🏽 https://bsf.io/convertpro/

✅ WP Portfolio – Showcase Your Work 👉🏽 https://bsf.io/wpportfolio/

——————————————————————-

📽📌 Table of Contents 📽📌

00:00 – Add video background in WordPress
00:15 – 2 Clarifications
01:35 – Add video background to WordPress – Method 1
05:37 – Add video background to WordPress – Method 2

——————————————————————-

📰📰 Video Description 📰📰

Have you seen some websites use video backgrounds in WordPress? It looks pretty cool, right? Have you ever thought that how you can add video backgrounds in WordPress? What if I told you it is very easy to do in WordPress?

The good news is that adding video backgrounds in WordPress can be done with the Gutenberg or the block editor in WordPress. But, it’s doesn’t give you a lot of customization options. That is why we recommend that you a dedicated Video Background WordPress plugin. We’ve recommended a free one in this video as well.

——————————————————————-

Who Are We?

We are #Brainstormforce, a passionate team of developers, enginners, and marketers working to create some amazing WordPress products. We’re the team behind some of the most popular WordPress products including the Astra theme, Ultimate Addons for Gutenberg, Ultimate Addons for Elementor, Convert Pro, and some other products.

On our YouTube channel, we primarily create WordPress Tutorials for beginners with the goal of educating people on how to build websites using WordPress, how to customize websites, and how to use WordPress’s impressive feature set. It’s WordPress training, one video at a time.

💘💘 Find out more about us on our website: https://brainstormforce.com/ 💘💘

💘💘 Subscribe to us for more WordPress tutorials and guides!
https://www.youtube.com/user/TheBrainstormForce?sub_confirmation=1 💘💘

💘💘 Follow us on our Facebook Page : https://www.facebook.com/BrainstormForce/ 💘💘

💘💘 Follow us on Twitter : https://twitter.com/WeBrainstorm/ 💘💘

💘💘 We’re on GitHub Too : https://github.com/brainstormforce/ 💘💘

source

Reader Interactions

Comments

  21. My video background has no sound. I need something that is silent on loading but has a volume control. Gonna keep looking. Thank you for the excellent tutorial!

  23. just to add a background seems like a breakthrough for these lousy developers. wow. this is supposed to be easy. with elementor this is straight forward. but their are times elementor is not a choice. And still I already have my page done and this seems like unless you start from a new page you can really use this plugin as well. All are rubbish but you my man are fantastic.

  28. It appears that you can now add multiple various text & other blocks to a cover block. We're using WP5.8.1 and have a cover block with background video that has a separator and 2 headings over it.

    But what about bandwidth issues on a looping video? Our video is only 12 seconds, and 8MB (your example appeared to be 91MB!!). And with the site in development, and ONLY myself viewing or working on it, we're seeing 1GB+ of bandwidth due to this video on some days! It seems like just having the video showing in tab may cause exponential bandwidth usage, but not sure how to precisely test this to be sure. Options?

    We don't like adding additional plugins for front-end display if at all possible, especially as we assume that free plugin is prob not the top priority for those developers, in case anything goes wrong in future.

    Any other options??

  42. Great !

    If you want to add an real background video with Gutenberg, you can use Custom layouts with a video block you will add to the "astra_body_top" hook. I simply used a "video" HTML tag.

    And some Custom CSS to fix the appearance :
    video {
    object-fit: cover;
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    }

  43. Again an awesome guide. Thank you. Just wondering, where can I find the tutorial video about BLOGs and BLOG Archive, setup with a Gutenberg Template. The Customizer settings are self explaining … but, a tutorial about how to use a more compelling template is what we do need.

Explore more

Get our Wordpress Guide Get Plugins Get Connected