All things Shopify and commerce
Hello! Im facing two isses. The first is that when I press on a product image, the image zooms in like crazy. I edited it using this code below - which helped on desktop but has not helped on mobile (ill attach the image below).
Code used:
{% if template contains 'product' %}
<style>
.product-media-modal__content.gradient {
max-width: 65em;
margin: 0 auto;
}
</style>
{% endif %}
Mobile Product Image when clicked:
Note that this is the studio theme.
Solved! Go to the solution
This is an accepted solution.
Add this css in your edit code > base.css file
.product-media-modal[open]{
z-index: 999 !important;
}
If you require further help to optimize your store, please don’t hesitate to reach out.
This contribution will always benefit you and you will get my full help easily and you can contact me easily.
Contect On My Mail :-Mail@gmail.com
Can You share your Site Url?
If you require further help to optimize your store, please don’t hesitate to reach out.
This contribution will always benefit you and you will get my full help easily and you can contact me easily.
Contect On My Mail :-Mail@gmail.com
Here you can see the issue here: https://loverlosangeles.com/products/black-zip-up
Add this code in your edit code > base.css file
@media screen and (max-width:767px){
.product-media-modal__content.gradient {
max-width: 90% !important;
}
.product-media-modal__content.gradient img {
width: 100% !important;
}
}
If you require further help to optimize your store, please don’t hesitate to reach out.
This contribution will always benefit you and you will get my full help easily and you can contact me easily.
Contect On My Mail :-Mail@gmail.com
That worked!!! any idea how to make it open in a way that doesnt clash with "categories" as seen below on mobile?
This is an accepted solution.
Add this css in your edit code > base.css file
.product-media-modal[open]{
z-index: 999 !important;
}
If you require further help to optimize your store, please don’t hesitate to reach out.
This contribution will always benefit you and you will get my full help easily and you can contact me easily.
Contect On My Mail :-Mail@gmail.com
Thank you! that worked out!!!
Hello I have another question! For some reason there has been extra space and pading over the image before we click it in some products now?
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