I have a video background playing back on my frontpage. I placed the video background by creating a single column full-width row and enabling the Video Background option under the row settings. (I had the SiteOrigin Video Background plugin installed hence the ability.)
Note: I DID NOT USE SiteOrigin HERO FOR THIS. THERE ARE NO OTHER WIDGETS ON THE ROW.
So under the video background setting, there is an option to insert the URL for a fallback image. I did upload one and insert the link.
So here’s the thing. When I test out my site on mobile phones, the fallback image DID NOT appear AT ALL. I could still see my background video playing back.
I checked the CSS codes on my site using Google Chrome, I realized that the “autoplay playsinline muted” line has the “muted” code in it. I read that by removing “muted” the video background would not play on mobile devices and instead the fallback image will load in place of that. But from what I’ve tried so far, there is not way I can access the CSS code on SiteOrigin Page Builder for me to do that.
Is that a work around for this? Or is there any CSS code/script that I could add in the “Additional CSS” section to achieve this?
Thanks in advance!