Shopify themes, liquid, logos, and UX
Hi community!
I am working on adding a single collection on my page (TRADE THEME), but it makes it soooo big! How can I scale this down? (fyi, i've tried the adapt to first image, small, medium, large options but all come out big 😑 )
On mobile, it looks pretty good, but it's the desktop version that's too ginormous. Helps!
Here is the preview link, since I'm still working on fixing things up. https://m1vxiidlhaedu4jq-77911654695.shopifypreview.com
desktop view
mobile view
Try this one.
@media only screen and (min-width: 749px) {
.card-wrapper.animate-arrow.collection-card-wrapper .card__inner {
width: 30%;
margin: auto;
}
}
Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better!
thank you so much for the code! it 50% worked 🙂
it did make that category pic smaller, but it also did it for the rest of the categories 😞
the valentine's day category is in its own section, so not sure how it made the other section smaller also. here is a pic. could this be fixed? i did change the % from 30% to 75% which did make the circle categories bigger but also the valentine one. aaah. 😞
Please, replace on this code.
@media only screen and (min-width: 749px) {
.section-template--23830794043687__collection_list_XGbA7M-padding .card-wrapper.animate-arrow.collection-card-wrapper .card__inner {
width: 50%;
margin: auto;
}
}
And Save.
Result:
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
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