How can I add borders to my thumbnail pictures?

Hello guys,

How can I add bordes to my thumbnails pictures like shown with the pink lines on the screenshot below?

Appreciate the help!

https://0bz6984vpqutiflw-53265825967.shopifypreview.com

1 Like

Hi @Bramm ,

This is Victor from PageFly - Landing page builder, I’d like to suggest this idea for solution:

Step 1. Go to Online Store → Theme → Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before :


Hope my answer will help you.

Best regards,

Victor | PageFly

1 Like

Hi @Bramm ,

I understand that you want to add bordes to thumbnails pictures.

  1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  2. Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  3. In the “Assets” folder, click on “theme.scss.liquid” or “styles.scss.liquid” file, depending on which file your theme uses to store its CSS styles.
  4. At the bottom of the file, add the following CSS code:
.product-media.product-media--image {
    border: 0.5rem solid;
}
.rimage-outer-wrapper {
    border: 0.5rem solid;
}
  • See the result. You can also change the size of the border.

1 Like

@PageFly-Victor @Made4uo-Ribe Thank you very much, both solutions worked!