Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
how can I create the section twice and optimise the video for each device? one for desktop and one for mobile i want different size videos for the both of them the mobile one being 3:4 and desktop being 4:3. I know nothing about coding I was wondering if anyone could help me.
Solved! Go to the solution
This is an accepted solution.
Thanks for the info, check this one.
@media only screen and (min-width: 749px){
deferred-media.video-section__media.deferred-media.gradient.global-media-settings {
--ratio-percent: 50% !important;
width: 80%;
margin: auto;
}
}
Note: you adjust the size you like.
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
I'm sorry I still don't understand what all this means I would greatly appreciate if you could go more into depth with it thank you in advance
Can I take a look, would you mind to share your store URL? Thanks!
https://nightylighty.co/ if you go on desktop you'll see that the video is too large while on mobile it looks fine the desktop is what I would like to change
This is an accepted solution.
Thanks for the info, check this one.
@media only screen and (min-width: 749px){
deferred-media.video-section__media.deferred-media.gradient.global-media-settings {
--ratio-percent: 50% !important;
width: 80%;
margin: auto;
}
}
Note: you adjust the size you like.
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
do I copy and paste it under the layout/theme.liquid section?
I got it! thank you so much I greatly appreciate your help.
Find Global Growth Opportunities For Your Business with Shopify AcademyLearn how to exp...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025