How to prevent Video Box downgrading quality on Mobile?

Ask the community
1

Using a video box to autoplay a short mp4 video on a page. It looks fine on computer, but it seems that wix automatically downgrades to 360p when using the mobile viewer. What is the best way to prevent this from happening?

I’ve found the code related to it but unsure where to overwrite the “qualities”:

data-video-info=“{“fittingType”:“fill”,“alignType”:“center”,“hasBgScrollEffect”:”“,“bgEffectName”:”",“videoId”:“a3228a_839e0fa084f14268bd615908f28332af”,“videoWidth”:1200,“videoHeight”:1500,“qualities”:

[{“quality”:“360p”,“size”:103680,“url”:“video/a3228a_839e0fa084f14268bd615908f28332af/360p/mp4/file.mp4”},

{“quality”:“480p”,“size”:184320,“url”:“video/a3228a_839e0fa084f14268bd615908f28332af/480p/mp4/file.mp4”},

{“quality”:“720p”,“size”:414720,“url”:“video/a3228a_839e0fa084f14268bd615908f28332af/720p/mp4/file.mp4”},

{“quality”:“1080p”,“size”:1800000,“url”:“video/a3228a_839e0fa084f14268bd615908f28332af/1080p/mp4/file.mp4”}],

“isVideoDataExists”:“1”,“videoFormat”:“mp4”,“playbackRate”:1,“autoPlay”:true,“containerId”:“comp-lnkgs5ro”,“animatePoster”:“none”}"

2

I think the automatic quality adjustments are from mobile data rates rather than automatically downgrading based on device. I just tried accessing a site with a video on mobile and was getting 1080p video.

3

Hi Anthony, thanks for responding. It is consistently at a low quality (360p) on mobile devices and even the mobile view of the wix preview on a computer. The published site on mobile looks very blurry across multiple devices even on wifi connections. Is there a way to force a certain video quality or remove 360p from the url options?

4

No way to force it. Are you able to try from other locations/ISPs?

5

Yes, we’ve tried various devices and locations (Taiwan and USA). Today I tried replacing it with a VideoPlayer instead of VideoBox, but then the video controls show on mobile devices even though the layout is set to Never show controls.

So our options are 1. low quality 360p on mobile or 2. controls show when video is playing on mobile. Do you have any suggestions to work around this? It’s basically like a GIF image that loops.

I’m confused why even though we upload a video at 1080p, wix automatically makes other 360p and 480p versions with their own URLs and hardcodes it to appear on mobile. That doesn’t make a lot of sense.

8

Hey Anthony, was wondering if you ever found a way to work around the video downgrading. Still hoping for a solution so we can use videoboxes on mobile without it looking really blurry

9

So I don’t know if this helps at all, but here is a screenshot of the page code for the videobox when previewing it on a mobile device.

If I change the ###p part of the “autoplay src” url, it changes the video quality but it currently defaults to 320p or 480p which makes it very blurry. Is it possible to overwrite the video-box class or add a custom id/class to the videobox somehow so that we can set the quality manually?

Screen Shot 2023-12-06 at 10.56.39 PM
Screen Shot 2023-12-06 at 10.56.39 PM1523×781 243 KB

10

You can add custom classes and change them with CSS in Wix Studio. Though I don’t believe you can change the source of a video with CSS.

Another option you have is to use a Custom Element to play the video with your own player.

11

Just confirming that I checked and the video quality is adjusted based on display dimensions. There’s currently no ability to control it manually.

However if you and others would like to see this feature (or a bit more flexibility) then you can request it here: Product Roadmap

1 Like
12

Thanks Anthony, I’ll submit a request for that. Appreciate your help

1 Like