Shopify themes, liquid, logos, and UX
Hello Dear community members,
I’m looking into totally removing the blank space margins, around the product photos, on mobile view. So the photos end right on the site’s edges.
Please help me, I love you.
Hey @MiguelMaya
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag
<style>
@media screen and (max-width: 767px) {
product-info {
padding-top: 0 !important;
}
.slider.slider--mobile .slider__slide {
padding: 0 !important;
margin: 0 !important;
}
.slider.slider--mobile {
gap: 0 !important;
}
}
</style>
RESULT:
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Best Regards,
Moeed
You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code before the </head> tag
<style>
@media screen and (max-width: 749px){
.section-template--16994491039898__main-padding {
padding-top: 0 !important;
}
.grid--peek.slider .grid__item:first-of-type {
margin-left: 0 !important;
}
.slider.slider--mobile .slider__slide {
width: 100% !important;
padding-top: 0 !important;
}
}
</style>
Result:
Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!
Than kind of worked, id still like removing that thin white layer around. Is that possible?
Hello @MiguelMaya
Go to online store ----> themes ----> actions ----> edit code ----> assets ---->component-slider.css
add this code at the end of the file.
@media screen and (max-width: 749px) {
slider-component.page-width {
padding: 0px !important;
}
}
result
If this was helpful, hit the like button and accept the solution.
Thanks
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024