How can I adjust the size of product cards on a specific collections page?

I made a special collections page for a specific product that has very small images (112 px x 112 px). After much playing around, I finally was able to get the images to stay their original pixel size by changing the CSS code (not in the actual code, but at the bottom of the customize page where you can enter CSS code changes. Now I want to change the product cards to make them smaller only for that collection page. Does anyone know how to do this? Here is the page in reference: https://www.crossstitchboutique.com/collections/mill-hill-beads

Would love to get the images centered too… but if I can’t, I will take this over the HUGE blown up completely blurry images before.

Hey @sweetstash ,

Can you check if you like this? :blush:

Go to your theme’s ā€œEdit Codeā€ Option, then in the search bar type ā€œtheme.liquidā€
Below the tag ā€œā€ tag paste the following. Screenshot attached for reference.


Screenshot is for reference only, the correct code to paste is the one shown above.

1 Like

@ThePrimeWeb That works wonderful! Thank you. But… it does it to all of my pages. The rest of my products have nice large images. It’s just this one manufacturer that has crap images. So… I need all of my other pages to stay the way they were. I made a separate collection page just for these small images. Is there a way to just apply it to certain collection pages instead. I know the collection page itself has its own code file.

Hey @sweetstash ,

ā€œI know the collection page itself has its own code fileā€ ← This wouldn’t work because that file is also shared by all the collections.

But you’re in luck. After thinking hard and nearly giving myself a headache, I have the answer. It’s a little complicated, so do it carefully and it’ll work. Please delete any of the previous code before proceeding.

I need you to go to the theme.liquid file again, this time scroll all the way down and look for the tag ā€œā€ (It should be the 2nd last line)

Once you find it, add the following code directly ABOVE the tag


Screenshot for reference

Then, scroll back to the top and add the following code BELOW the ā€˜ā€™ tag. (This is what you did earlier)


Screenshot for reference

1 Like

@ThePrimeWeb you are spectacular, wonderful, awesome! I have been struggling for many, many months trying to get this fixed. I am forever grateful to you. This worked beautifully! Thank you! You don’t know how much I appreciate the time you put out to help me.

I am so sorry to do this… but I have two other collection pages under the Beads menu that are the same. (mill-hill-collection is the template page) They use the same page template… and I don’t understand code at all… but they didn’t change. I don’t understand what you did, so I don’t know how to apply to those collection pages (even though they use the same page template).

Since I have you… I have one more problem associated with these products. If you click on one of the beads and open the product page… look at the image. It’s scaled way up to fit the image space and terrible looking. I don’t want to change all my product pages, but I need the product page template I made for these to just display the image at original size. Is this impossible? (mill-hill is the product page template).

Again, thank you so much.

Hey @sweetstash ,

You are full of brain teasers haha.

I think I managed to fix it. You’d have to test and see. :blush:

Please delete all the code added previously, refer to the screenshots if you are unaware of where it starts and ends.

Replace them with this.

I need you to go to the theme.liquid file again, this time scroll all the way down and look for the tag ā€œā€ (It should be the 2nd last line)

Once you find it, add the following code directly ABOVE the tag


Screenshot for reference

Then, scroll back to the top and add the following code BELOW the ā€˜ā€™ tag.


Screenshot for reference

1 Like

@ThePrimeWeb It worked! Thank you so very, very much. Like I said, I have been struggling with this for months, asked so many times for help… I really, really appreciate you and you taking the time to fix my issue. I cannot thank you enough.

@sweetstash Remember me when you make your next sale HAHA :rofl: :grin: