Shopify themes, liquid, logos, and UX
How do i get my product list pictures smaller? I want them smaller like the picture I added.
Hi @Byggstan
Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.
B2Bridge: All-in-one B2B wholesale solution, enabling merchants to set up a complete B2B store quickly and without coding.
With features like customizable registration forms, customer segmentation, and tailored price lists, it simplifies wholesale management.
B2Bridge also includes a dedicated Quick Order page and flexible Net Payment Terms, streamlining operations for wholesalers and enhancing the buying experience.
Hi, thanks!
Hi @Byggstan
I hope you are well. You can follow our instructions below:
1/ Shopify admin > Online store > Edit code
2/ Search for "theme.liquid" file
3/ Open the file and search for </head> tag and add the following code above </head> tag
Here is the code for Step 3:
{% style %}
@media screen and (min-width: 990px) {
.card__inner.color-scheme-1{
height: 75% !important;
}
.card__media img.motion-reduce {
object-fit: contain !important;
}
}
{% endstyle %}
If this helpful, please let us know by giving us a like and marking its as a solution. Thanks you 😍
B2Bridge: All-in-one B2B wholesale solution, enabling merchants to set up a complete B2B store quickly and without coding.
With features like customizable registration forms, customer segmentation, and tailored price lists, it simplifies wholesale management.
B2Bridge also includes a dedicated Quick Order page and flexible Net Payment Terms, streamlining operations for wholesalers and enhancing the buying experience.
Hi,
I added this:
@media screen and (min-width: 990px) {
.grid--6-col-desktop .grid__item {
width: 12% !important;
margin: 0 10px !important;
}
}
to base.css
and it worked, but the last pictures/row in almost every collection keeps their size.
Hi @Byggstan
You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file base.css and add this code at the end of the file
@media screen and (min-width: 990px) {
.grid--6-col-desktop .grid__item {
width: 12% !important;
margin: 0 10px !important;
}
}
Result
Best,
Liz
thank you! This works fine, except that the last doors in almost all collections keeps their size.
June brought summer energy to our community. Members jumped in with solutions, clicked ...
By JasonH Jun 5, 2025Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025