Urgent help needed! MP4 Video Banner Background

Hi Experts,

I am using Play stack ( Doobox ) for Banner MP4 Video with Foundry, it works great on laptops but when viewing the website with Cell the video does not work… Help!
I am aware there are stacks for Youtube and Vimeo but If there is another MP4 stack that works on both, please let me know.

Thanks
Monica

I don’t think mobile browsers support autoplay for video. You didn’t provide a link to test your site, but I checked the demo of the Play stack on my iPhone. It doesn’t autoplay.

Does the demo work on your phone? https://www.doobox.co.uk/stacks_store/demos/play.html

Video can be played on touch devices so long as it is muted when it plays. You can provide an unmute button for users if sound is required but if it is just a background video then there is probably no sound.
Here is how to do it with SectionsPro but there will be plenty of alternatives I presume.

I’ve even noticed newer versions of mobile Chrome on iOS don’t autoplay. Mobile Chrome v83 on iOS v13.5.1 for example won’t autoplay video, even if it has the muted tag, not to mention Mobile Safari.

I’ve used Google’s own example page for the muted tag as a test which fails to play in the above stated environment. I suspect that possibly something in iOS itself has changed.

All mine still appear to appear to be working just fine in the latest Chrome on iOS and all other touch devices. There is more to it than just the muted attribute but I didn’t want to confuse things for the OP

Here is my original test page from 3 years ago that should still work on all devices (certainly does on my touch devices at least).
https://test.bigwhiteduck.com/sp-vid/

2 Likes

Thank you @NeilUK @tav @Elixir

The video is muted as there is no need for sound.
I’ve changed the stack, and now I am using Cinema (Foundry-Thunder pack) although it still not working BUT at least “the video gets frozen”, so there is an image, much better than being blank.

Having said that, I see lots of sites out there are working on mobile (a play button is displayed) once the site is viewed on mobile.

Just out of interest, did the above link play OK on your mobile device?

Sections displays a play button on videos with sound when the browser intervenes and stops it at the first frame)

Yeah, I’m working on adding playsinline to Cinema. This is likely what the Play stack is missing, too.

1 Like

@tav yes the link worked on my mobile :slight_smile:
I do have Section Pro but did not use it before, May I ask how to add the MP4 into section pro?

You just add a background video child stack and turn on the video button at the top of the settings. All the defaults are for muted and play on touch.

nope not as far as I know. - The playsinline attribute was in the original spec in 2017 to allow muted decorational background videos to play

1 Like

Odd. Just added it to Cinema and it decided to play on mobile now. :man_shrugging:

1 Like

@tav thank you tav! apology but my SectionsPro does not have the option to choose the background layer!
This screenshot (I do not have that options)

@monica, I just checked my SectionsPro and the Layer Background / Video child stack is there and working.
The version I have is 3.1.0. Possibly you have an older version and can simply update your stacks to get your video to autoplay.
SectionsPro is an amazing and versatile stack! You’ll be amazed once you start using it.

1 Like

@design4film @tav No wonder I did not find the Background Layer in the stack :slight_smile: I will update Thank you so much!

THANK YOU @Elixir Cinema is working perfectly on mobile now!

2 Likes

Not a problem. Just needed to get that playsinline tag in there alongside some of the tags Cinema was already using and it seems to have satiated iOS for now – at least until Apple decides to change things again. :wink:

The doobox demo doesn’t play on my mobile phone. The BWD demo/test page does play on my iPhone. I’ve been trying to add video to my banner with no luck. I’m going to try BWD Sections Pro.

Yes, Sections Pro seems to be the answer.