I am excited about the capabilities of Webflow but I have found a major snag. I am attempting to make a video header like this one: https://unruhfurniture.com/. I am not seeing a good way to do so that would allow for autoplay and playing audio.
Could someone please help or tell me it isn’t possible? Thank you.
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
I honestly have no idea if this is possible without custom code. it’s possible you may be able to put the video with a negative z index essentially behind the page to show/hide on click but it’ll get really messy. I’d honestly suggest simply doing a Lightbox video with a link like that.
Take a look at this info to help:
You can also do this manually by adding the following parameters into your embed code:
loop=1
autoplay=1
If you have more than one video autoplaying on a particular page, you will also need to include this parameter:
autopause=0
So, for example, if you were embedding two autoplay, looping, videos on a page, the embed code for each would look like this:
Autoplay Restrictions
Some browsers specifically block autoplay. In these cases, your video will revert back to the original thumbnail and controls, requiring viewers to select play to start playback.
Safari version 11+ (Desktop)
Documentation: Auto-Play Policy Changes for macOS | WebKit
Policy: Autoplaying videos must be muted. Viewers can choose to block or allow unmuted autoplay for specific domains on their setup
Chrome version 66+ (Desktop/Mobile)
Documentation: Autoplay policy in Chrome - Chrome Developers
Policy: Autoplaying videos must be muted. Videos that are frequently visited by the viewer are permitted to autoplay with sound
iOS Safari
Documentation: New <video> Policies for iOS | WebKit
Policy: Autoplaying videos must be muted.
Firefox 66+ (Desktop/Mobile)
Documentation: Allow or block media autoplay in Firefox | Firefox Help
Policy: Firefox now blocks videos with sound from playing automatically. This change is being gradually rolled out to users in Quantum version 66. Viewers can choose to block or allow unmuted autoplay for specific domains on their setup
There is no way to stop these autoplay restrictions; however, you can mute your video to ensure autoplay is always honored. Just add one of the following parameters to the end of the player URL in your embed code:
This parameter automatically disables all elements in the player (play bar, buttons, etc), autoplays, loops, and mutes your video on load.
?background=1:
This parameter will automatically mute your video on load. Once your video plays, viewers can manually unmute by clicking on the volume bar within the player.
?muted=1
Both of these parameters will force your video to load as muted in all browsers. Videos without audio tracks will not be considered muted by browsers. In order to bypass autoplay restrictions, you must use one of the embed parameters above.
If your webpage has permission to autoplay but your video is still not playing, you may need to add the:
allow=autoplay
parameter to the iframe, and any iframe in your webpage that the player is contained within.
Here is an example using the iframe:
Hope this helps 