Background video not playing on live site

I’ve looked into a few discussions about this and can’t seem to find a simple answer.

I’ve added a background video to a page with an image over the top. When I preview it it works fine but publishing the site. Nothing is playing either in Chrome or Safari.

I read unmuting the video might fix this but I couldn’t find the correct code to add.

Also, I’ve adjusted my (Mac) system preferences to allow Display > Reduce motion (whatever this was supposed to do!).

Has anyone else come across this and managed to fix it? If can they please help me.

Thank you!

Hi @Ursula,

It’s difficult to guess what may be wrong just from a description. It would help if you shared a preview link to your Webflow build when seeking help on the forum.

In your case, as it is about something working in preview but not on the published site, a link to the published site may also be helpful.

Reduce Motion is designed to prevent videos, animations and interactions from showing on a website for users who experience motion sickness from heavily animated software/websites. Developers can build websites that can check whether a user prefers reduced motion and then choose not to show certain elements or not trigger interactions. I believe this functionality is built into the Webflow Background Video Element.

If you have Reduce Motion on, this will likely be why it is not working. Try switching it off and reloading your website.

1 Like

Fantastic! That worked :smiley:

I’m surprised because I’d checked that option when it didn’t work earlier but for whatever reason unchecking it worked. Thank you so much for responding.

1 Like