Change product thumbnail size & location on Colorblock Theme

6 0 1

Hi! I would like to change the location of my product thumbnails to the left of the main product image and make them slightly larger. I am using shopify's "Colorblock" theme and have several different product templates. Here is the url of the product I am currently trying to modify -


Screenshot 2024-02-12 at 10.22.08 AM.png

Replies 2 (2)

Shopify Partner
31 4 6

To reverse the order of items in a grid layout, you can use the CSS property grid-template-rows or grid-template-columns with the direction property set to  (right-to-left). Here's how you can do it:


  display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    grid-auto-rows: minmax(100px, auto);
    direction: rtl; 




6 0 1

I don't want to reverse them, I want the thumbnails to  display to the left of the main product image instead of below. and for them to be larger too.