Recently I was building a website in Divi where the client wanted a fullwidth video background.
If you’re familiar with the Divi theme you should be familiar with how easy it is to make this happen.
The Fullwidth Header module allows us to insert the URL of a MP4 and Webm video to autoplay on our Divi website.
When I was viewing the website on my main computer the video appeared as expected. However, when I checked the site on my laptop (it’s always a good idea to test your site on different devices) I came across this error:
‘Error Loading This Resource’
My background video didn’t load and I didn’t know why… Both files were MP4 and Webm as the theme notes suggested but something clearly wasn’t right.
Whenever something isn’t quite working right and I’m not sure why I head over to the Elegant Themes support forum to see if anyone else has experienced the same issue.
Lot’s of people on the Elegant Themes support community appeared to be having some trouble with this.
After searching through a bunch of support threads I came across this comment by ET Support member Andrie which said to try converting a webm version of the video file into an mp4 using a free online service.
It would appear that browsers are fairly picky about what codecs our mp4 videos are in and this simple online tool uses the correct one. The site that Andrei recommended is www.onlineconverter.com/webm-to-mp4 and will convert your Webm file into an MP4 that should fix the ‘Error Loading This Resource’ issue.
Don’t have your file as a Webm type? Search Google for ‘your video file name to Webm converter online free’
It’s worth noting that while the website converts video into the correct format I found that the site wasn’t all that reliable and required me to reload it a few times for it to work. Be patient and, depending on the size of your file, it should be done in a couple of minutes.
Once you have put your new MP4 file back in to your Divi layout you should be good to go, but… if you find that it still isn’t working then the MP4 codec of your background video may not be the problem. If this is the case then I’d recommended doing like I did and checking out the Elegant Themes support forum.