Create and Optimize a Self-Hosted Video Background for Free

[@alex-650]

Super helpful to show that a video background doesn’t always mean a poor page speed.

[@JackCao]

That was my past believe as I saw lots of "Expert" bloggers talking about it. But when I experimented with it, the data says otherwise. Glad I tested it!

[@scotnery]

bro! amazing! thank you for putting so much work into making this exactly what's needed!

[@TiagoDezan]

Great tutorial Jack!! Thanks for this awesome video!!

[@JackCao]

You are welcome! 😁

[@RemNetizen]

Thank you! Very useful and just on the point. One of the greatest tutorials on the topic.

[@JackyShalala]

It helped me to reduce the size of my video from 19 mb to 10 mb!

[@KR-dk3eb]

Excellently explained!👍

[@faithnomore101]

10k subs. finally! you earned it. next goal 15k till 2022!

[@JackCao]

Thank you so much for your support! ❤

[@webgeneral]

One of the best channels outthere when it comes to WordPress knowledge!

[@onurazorqs9516]

exactly what i was looking for. Thanks man!

[@comleonmoto]

Thank you Jack. Clear and well documented, as always 🤩

[@deltasignshopinc]

Amazing video, I just dont understand why only 2755 views. This content is great for small business owners/web designers/one-man show. You might need to change the video title to target more business owners. On the other side, the second step took my video from 4 to 10 mb.

[@euchoulis]

Good job Jack !

[@JackCao]

Thank you! 😃

[@SchinTeth]

Thank you for the tips, helped me alot

[@kamaboko1]

Great video. Interesting results though. Cloudconvert took a 3.2mb mp4 file and blew it up to 8.5mb webm file. I did it twice incase there was a glitch on the first one, but the second try produced the same results. I followed everything to a T with your instructions.

[@chinghong3943]

Thank you Jack. Very informative. I use Openshot to reduce file size for videos. But from this video, I now get to know more resources to reduce video file size. Thanks

[@JackCao]

Thanks for sharing openshot! 😊

[@constancephoto6512]

Thank you! Another great video-excellent instruction with amazing resources. I have struggled to put all this together.

[@JackCao]

Glad it was helpful! 😊

[@nardog10]

Another nice great video my friend

[@JackCao]

Thank you! 🙂

[@kazafinn]

Excellent video. Thanks

[@hadiibrahim07]

Great tutorial!

[@iwbowden]

Excellent video, Jack! I have done a lot of experimentation to find the best "recipe" for doing this and didn't even get close to the small file size that you did. It's unfortunate that Canva's video editing tool will only dissolve between cuts. This means that there's still a sharp cut when the video loops and begins playing again.

[@lecongminh3964]

Good Job, thanks Jack. It's Best

[@JackCao]

I'm glad you like it

[@fabrictexture4767]

Great jack more updated video regarding this??

[@DesDreckett]

Awesome video once again! Thx

[@JackCao]

Glad you enjoyed it!

[@Agileslick]

Thanks

[@JackCao]

You are welcome! 😁

[@freekrider803]

very helpful thanks jack. I need some full website build from scratch tutorial.. can u make it ?? with any free gutenberg blocks with any niche like school, hotel, theaters, restaurants etc.... Thank you...

[@URandomGuy]

NICE!❤

[@JackCao]

Thanks 🔥

[@marcoballesteros1013]

Hope you can do a new video with divi speed update. seeing that its the classic builder

[@danielstojanovski9244]

Amazing, thanks.

[@JackCao]

You are welcome!

[@thesnazz1790]

Hey Jack! Is the WebM video format able to play on Safari?

[@inlandnwdesign]

awesomeness

[@pawekowalski510]

Jack I kicked off my progress with WP after seeing a couple of your videos. Today I'm looking for free video gallery plugin which allows me to insert 2-3 columns videos on my website. I only need play button and if I play or second video the first played video stops and the second play. It would be nice to add short description over the video. Could you recommend something?

[@eRodriguezART]

Hey Jack, great video, alot of good tips. I compressed a video from MP4 into webm. But turns out, ios users that visit the website will not be able to play the video. Is there an alternative compression method or extention that would work for everyone?

[@nyshimura]

muito bom! valeu!

[@sootedninjas]

how do you do a Ken Burns Effect on background images with gutenberg

[@JoeGator23]

When you say self-hosted you mean that we run the new file from our media folder? Thanks for the awesome video. You always have useful videos, cheers to you!

[@JackCao]

Yup. That's what I meant 😁

[@JoeGator23]

@@JackCao Thanks for the quick reply, cool!

[@mecrayavcin]

Hi jack what is the best size for a background video? How many mb? You are a speedjunky so i wanted to ask this Thanks

[@LeirbagLinares]

Could you make a video of LMS ´s like LearnDash, Tutor, Lifter with Gutenberg?

[@JackCao]

Will do that soon! 😊

[@anaisbernardin6352]

but with which themes we can put a video in the background

[@MichaelFidelis]

Good day Jack! I used three clips for a video and compressed the combined clips in a video per your instructions. However, one of the resolutions of the three videos was larger than the other two. In playback, that video frame gets larger than the others. You would think using the compression tool and 16:9 would render them the same?

[@JackCao]

Did you remember to expand the video covering all the white spaces in the video frame? If you have done that, there shouldn't be any inconsistency in playback. Send me an email with the links to the 3 videos for me to check it out 😊 [e-mail]

[@MaryamKainat-y8g]

but how to put that video as a background

[@rishabhchoudhary4284]

Still waiting for your video on user registration and building profile pages on wordpress. my site is incomplete without it.

[@JackCao]

Registration to Courses or as a Customer? Or why would you need a user to register? I think Woocommerce has those pages in place, and I think I have done a WooCommerce Tutorial on Account pages.

[@rishabhchoudhary4284]

@@JackCao i have a blog and i want user to register on it without WooCommerce. I am confused which plugin i should use to design their profile and account pages. Is it possible without plugin?

[@vwtourandtransportbali6555]

jack I already reach on desktop 100 Google page speed couse of you, can you chek for my web ?? I need on mobile, in mobile, I just reach in 70, I don't know whats is the problem and I already try to find but i think i don't know

[@JackCao]

Your page happen to have KZbin Embedded Video or running ads?

[@vwtourandtransportbali6555]

@@JackCao ads

[@AdityaSingh-ni7vn]

How to make this mobile responsive and also playable in ios mobiles

[@AV-jz6wr]

It's all cool, but Webm doesn't play on mobile.. so basically useless.