Making circular images for products on homepage

iluvnuns
New Member
5 0 0

Ive been trying to solve this for awhile and its bugging me, my featured items right now are all square and ive been trying to code it to turn it to circles and i havent had such luck. I actually want all my images to turn into circles. If someone can help me that would be awesome. Im also using the brooklyn theme if that helps

Replies 5 (5)
Ninthony
Shopify Partner
2247 339 901
You just need to apply a border radius of 50%. I'm on mobile but I'll give you an example tomorrow if you dont get it figured out.
If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
iluvnuns
New Member
5 0 0
Ya I can wait for the example tomorrow
Ninthony
Shopify Partner
2247 339 901

Alright so you just have to apply a class name to your img tag and then add a border radius:

 

<style>
.my-image{
border-radius: 50%;
}
</style>
<div class="">
<img class="my-image" src="/path/to-your-image.jpg">
</div>

If you can link to your website (and password if password protected) and show which part you want to edit I can give you more specific info.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
zap1
New Member
1 0 0

Hi.. Can you please advise where to input this code in the Dawn theme?  I've looked everywhere and some sources say to put it in theme.css however this file doesnt seem to exist in this theme.  Thanks.

Ninthony
Shopify Partner
2247 339 901

I believe Dawn has a file that you can put it in called "base.css" but if you don't understand the code above, you can't put all of that in there. My example was just a simple example. You're going to have to know the exact class name to apply the style to. Can you post a link to your store and what page exactly you want to change the product images?

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D