-
Posts
-
I’m using the Business Startup layout as a starting point for a site I’m working on for a client, which has a full-screen video background. That’s why my client wants. But it doesn’t work when he tests it on his phone, so I’m guessing it’s not set up to work for mobile. Is there any way I can get this to work on mobile devices as well?
Thanks,
ToddMobile will use the fallback image for mobile devices you define in the dialog box.
“Video on most mobile devices can’t be controlled properly with JavaScript, which is mandatory here, therefore you are required to select a fallback image which can be displayed instead.”The client says if the video won’t show on mobile with this theme that it’s a deal breaker and he’ll want to use a different theme. We’re modeling his site after another one he found and they have full-screen video that does show on his phone and that’s very important to him. The website he wants to model his site after is origininvestments.com. I checked and they do have full-screen video that works on mobile devices, so there must be a way to do it.
Is there some way to make the theme show the video on mobile?
Hi,
Thank you for using Enfold.
Yes, this is actually possible but we decided not to enable it on mobile due to incompatibility issues like the one stated above. Another workaround is to add an actual video element in place of the video background when viewing on mobile. http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/
Related topics:
// https://kriesi.at/support/topic/home-page-video-on-mobile-phone/#post-449787
// https://kriesi.at/support/topic/no-video-on-the-mobile-version/Best regards,
IsmaelWhat I’m wondering is, is there a way to override the theme’s default behavior of not showing the video for mobile devices? I realize there some potential incompatibility issues, but my client wants to try showing the video on mobile anyway. Is there a way to override the theme’s settings to not show it for mobile and try showing it anyway?
Thanks,
ToddHi,
Please edit the js shortcodes.js file, look for this code around line 4070.
this._prepareSlides(options);Remove the code or replace it with:
// this._prepareSlides(options);Best regards,
IsmaelI tried that, but the video still doesn’t load on mobile. I have a way to do it with some Javascript, but I need a way to manually edit the <video> tag that gets output to the browser. Where can I go to edit that? Basically I just need to add a few attributes to it like this:
<video autoplay muted loop webkit-playsinline src=”filename.mp4″></video>I’ve been going through the files with the theme and haven’t found a way to edit that. Ideally, I really only want to edit it for mobile. It shows perfectly on desktop.
I’d appreciate any help you can provide. My client really needs this video to autoplay in the background on mobile.
Thanks,
ToddHi,
Look for this code around line 4726:
if(!event.data.self.isMobile && !event.data.slide.data('disableAutoplay')) { event.data.slide.trigger('play'); }.. replace it with:
if(!event.data.slide.data('disableAutoplay')) { event.data.slide.trigger('play'); }I’m not sure if this is going to work because mobile devices do not autoplay videos by default.
Best regards,
IsmaelHi, Servesense.
Did you get it? Can you share what you did to achieve the video on mobile?
I made both changes to js as Ismael explained but didn’t get a result.
ThanksHi, @grafikero,
Please, may you create a new thread including the details of your problem?
Best regards,
John TorvikHi mjpschouten,
I think you got your question answered in another thread? If not then please try to explain your problem a bit further and post a link to where we can see the problem.
Best regards,
RikardNo, the video is not working on mobile, i am getting a still image with a play button, but when i click this it does not play.
Hi,
The slider with video as background is still disabled on mobile devices so you have to add a fallback image. If you really need this feature, please try the layer slider. You can set a layer with a video as background.
Best regards,
IsmaelOk thank you, when i used the advanced layerslider the page just did not want to load on the front.
But i just used a content section with a code element. that is working. Thank you!Hi,
You might want to increase the WordPress memory limit to at least 256M if the layer slider is not working and check if there are plugins conflicting with the theme. Anyway, I’m not sure how you did that but I’m glad it worked. Let us know if you need anything else.
Best regards,
IsmaelHi!
Have you tried using the layer slider element? This might not work though because of the new autoplay policy.
// https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
It’s always best to leave out background videos on mobile devices, specially when their sole purpose is aesthetics.
Cheers!
IsmaelThank you @Ismael, i will take a look at the memory limit.
And @Munford, i can share it:
So i have a Content-section with background video from youtube (hide this on very small screens) and another Content section with a code element (only showing this on mobile) :
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/YlocNMsZYBw?rel=0&controls=0&showinfo=0" frameborder="0" allowfullscreen></iframe>
- You must be logged in to reply to this topic.