How can I add color-coded image borders to product thumbnails?

[rlacaz]

Help! How do I add image borders to product thumbnails? Color code is #CDBACF

This is the page currently

This is what I’m going for:

[rlacaz]

I’m currently using the free Origin theme if that matters!

[Made4uo-Ribe]

Hi @rlacaz

Would you mind to share your Store URL website? with password if its protected. Thanks!

[rlacaz]

https://zxnr4pzwybkpfby4-80574054720.shopifypreview.com

There’s no password!

[Moeed]

Hey @rlacaz

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Made4uo-Ribe]

Thank you for the information. Try this one.

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 “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
4. And Save.

ul#product-grid li {
    border: 5px solid #CDBACF;
}
.card__information {
    padding-left: 10px !important;
}

Result:

I also add a bit of padding in the title and prices.

Before

After

I hope it help.

" Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better! "