Streaming live at 10am (PST)

Video embeds don't play on iPhones

https://twistwhatyouknow.webflow.io/

Embedded videos (using embed components with iframe code, or with Webflow video component) doesn’t seem to play on iOS mobile devices only. On desktop or on Android devices, when you hit the play button the video loads properly. However, on iPhones, hitting the play button doesn’t load the video and after a few tries pressing play, it says “unable to play video”.

I thought at first it was because I included the Vimeo API script and it was conflicting with the videos on iOS: <script src="https://player.vimeo.com/api/player.js"></script>

However, I then changed this so the script only loads (injected into head) if the window size is larger than a mobile device, but the videos still don’t play on iOS.

If you scroll down about half way through the page, you’ll see the video here:

Screenshot 2020-05-04 at 13.40.03

Attempting to hit play on that video doesn’t work and I’ve tried each of these 3 ways:

  1. Use embed component with content as:

     <iframe src="https://player.vimeo.com/video/410551514?title=0&portrait=0&playsinline=false" style="width:100%;height:100%" frameborder="0" allow="autoplay;" allowfullscreen></iframe>
    
  2. Use Webflow “video” component with URL: https://player.vimeo.com/video/410551514

  3. Use Webflow “video” component with public URL: https://vimeo.com/410551514

I’ve even tried creating a completely separate page in case there were conflicts with the rest of the page: https://twistwhatyouknow.webflow.io/video-test

This page includes all 3 attempts above, but none work on iOS.

Any ideas would be great!

Thanks,
Andrew


Here is my site Read-Only: https://twistwhatyouknow.webflow.io/
(how to share your site Read-Only link)

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.