hi,
my website - www.kulaindia.com
theme - horizon theme.
I added a video to the home page. It works perfectly on the desktop but I want to upload a different video that is vertical for better mobile experience rather than the horizontal desktop video. It looks very small. can someone help me with the above.
i’ve attached a photo of how the video currently looks on the phone.
Hey @SNAP_SHOT
I have a suggestion, first why don’t you add the vertical video as well so your website should be displaying two videos and once that’s done then I’ll provide you the code to hide vertical video on desktop and horizontal video on mobile. Let me know once that’s done.
Best,
Moeed
Hi Moeed,
I’ve added the 2 videos.
Hi @Moeed , I’ve added the 2 videos like you suggested. looking forward.
Hey @SNAP_SHOT
Follow these Steps:
<style>
@media screen and (max-width: 767px) {
div#shopify-section-template--26031664398648__section_MQ3zdq {
display: none !important;
}
}
@media screen and (min-width: 768px) {
div#shopify-section-template--26031664398648__section_HFTrzT {
display: none !important;
}
}
</style>
If I managed to help you then a Like would be truly appreciated.
Best,
Moeed
I’ve shared solution which does not require editing theme code – How to upload video on website banner for mobile and dekstop - #5 by tim_1
The benefit here is that you do not need to hard-code cryptic section IDs, Shopify will do it for you automatically.
And works in any theme.
@Moeed unable to find theme.liquid in my theme.
there is no option to input css code in the video section in my theme.
It’s located in the “Layout” folder when you edit code
It’s a standard Shopify functionality which exists in every theme and available for every section.
Probably you’re looking in a wrong place.
Ahh..my bad. Got it..was looking in the wrong area.
it’s working for mobile view but gets hidden for laptop.
