Shopify themes, liquid, logos, and UX
Hi.... how do I change my "Collections" pages to show 3 products per row?
Just the Collections pages. Not the "Homepage" and not "All Products" page.
My website is krollbymom.com
Thank you
Solved! Go to the solution
This is an accepted solution.
Please follow these steps: - Step 1: Go to Online store > Themes > Actions > Edit code. - Step 2: Go to Assets > base.css and paste this at the bottom of the file.
@media screen and (min-width: 990px){
.collection .grid--quarter-max.grid--4-col-desktop .grid__item {max-width: 33% !important;}
.collection .grid--4-col-desktop .grid__item { width: calc(33% - 1rem * 3 / 3) !important;}
}
Thanks!
Please share store URL!
Thanks!
This is an accepted solution.
Please follow these steps: - Step 1: Go to Online store > Themes > Actions > Edit code. - Step 2: Go to Assets > base.css and paste this at the bottom of the file.
@media screen and (min-width: 990px){
.collection .grid--quarter-max.grid--4-col-desktop .grid__item {max-width: 33% !important;}
.collection .grid--4-col-desktop .grid__item { width: calc(33% - 1rem * 3 / 3) !important;}
}
Thanks!
Hey @dmwwebartisan I used your code it worked great thank you!
All my collections have the 3 products per row now and its great, but now also the featured collection on homepage has 3 products, and I prefer it to have 4 on a row. Is it possible to only make it have 4?
Thank you for this! It worked for me as well! BUT, now the product pictures is all blurry. Why?
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024