I added a custom background video to my Shopify Debut theme page and it’s playing fine. Only two issues are that:
there is a white margin above the video when you visit the page. After a second, this margin disappears are the video slides up to the header. This is the case on desktop and mobile version and I would like the page to load without this margin.
a lot of the video is cut off left and right on the mobile version. Is there a way to always have the video showing in 100% width and 100% height? So it just adjusts to the browser window size and nothing gets cut off?
I am not sure what you mean by the white margin, are you referring to your header area at the top of your shop?
Were you hoping to cover this area with the auto-play video and have your menu items sit on top of the video, am I understanding you correctly? Or am I not seeing this white margin that appears and disappears? Perhaps I am not seeing this from the preview link you sent me from your theme editing area, can you share your store’s main URL so I can take a closer look?
Generally speaking, when you switch a store to a mobile view all images and videos will automatically be resized to fit the mobile view and this is to be expected. However, I would be happy to take a closer look at your mobile view once I grab the shop URL!
attaching a video of what happens when I refresh the page – there is this white space above the video for half a second and then it automatically scrolls down and the white space disappears.
The main issue is the cropping of the video – when looking at the page on a big/wide screen, subtitles are cut off and on mobile most of the video is cut off left and right. I need the video to be always 100% wide and 100% high, adjusting to the browser window.
You should be able to send your .myshopify.com URL along with your store password for me to take a look as well! However, just for some further clarification, have you done any coding to your shop, specifically your homepage video? You mentioned in your initial post a “custom” video, can you specify this customization?
Thanks for getting back to me and clarifying that, is there a reason you utilized coding instead of the default video option in our Debut theme? Shopify is not able to directly support third-party coding of our themes, however, If you are in your theme settings under Online store>Themes>Customize and click Add section, you can add a video option by default:
Was the idea, that you did not want to host the video on Youtube or Video? I would recommend reaching out on the thread you found this information on or connecting with a Shopify Expert to look into getting you some direct coding support. I hope this gets you on the right track!