How can I separate products into shaded squares on my product page?

Store Design
1

how do I seperate the products on my product page into seperate shaded squares

2

Hello @Benjiji93

Welcome to Shopify community.

Can you please elaborate more about your requirement ?

Thanks

3

I creating a multi product store but Im having issues with the layout.I would like to separate each product with a dark square outline.

I would also like the squares to be the same sizes.

4

Okay. So do you want to link multiple products to one main product. When clicked on the swatch it should redirect to particular product page ?

If no please provide a screenshot of your requirement.

5

No, I have 8 products listed on the product page, they are all next to each other with a white backround. What I would like to do is to separate the products in individual squares or outline so it looks cleaner.

6

Okay so you want to separate products to look when listed. Do you want to add unique color outline to each products or want to give unique backgrounds to each product grids ?

7

I want to add a dark gray outline for each product.

8

Please share your store url.

9

https://admin.shopify.com/store/a5106d-3

10

Not the admin url. The store front end URL and if the store is password protected for customers do share the password too.

11

www.virtualpark.store

12

Hi @Benjiji93

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file → Save

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

13

Thank you so much