Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
NaamNom

Changing the shape of images and product images

Question

Site URL: https://www.naamnom.com

I would like to make the product images on my landing page (naamnom.com) circular. I would also like to add a separate circular image that is not an product block image... does anyone know how to do this? (that is, instead of a square or rectangle shape...) Thank you!

-Oshri

Share this post


Link to post

1 answer to this question

Recommended Posts

  • 0

You can target the images with CSS. For your home page product images, add this to Design > Custom CSS to make them circular. The collection specifies the page and then the code specifies images in the product block.

#collection-5ef925025708dc5cb9e01f4b .product-block .image-container img {
    border-radius: 50%;
}

For other images, you can specify the block (I use the first plugin in this post: https://christyprice.com/squarespace-tips-tricks/chrome-extensions-squarespace-designers) and then set the border radius.

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...