How can i get this collection picture circule? (brooklyn theme)

jrltrend
Excursionist
42 0 11

Namnlös.png

0 Likes
Bluish
Shopify Partner
555 78 87

Border-radius: 50%; in css will get you this effect

 

Bluish_0-1611526323896.png

 

If my answer was helpful please Like and Accept my post as the Solution
0 Likes
jrltrend
Excursionist
42 0 11

Thanks! But it dosent work to paste

#example-seven, #example-eight {
border-radius: 50%;
}
#example-eight {
width: 200px;
}

in theme.scss.liquid.

0 Likes
Bluish
Shopify Partner
555 78 87

Hi JR,

Then you aren't putting it on the right class. What's your website.

If my answer was helpful please Like and Accept my post as the Solution
0 Likes
jrltrend
Excursionist
42 0 11

jrl-trend.myshopify.com

0 Likes
Bluish
Shopify Partner
555 78 87

@jrltrend  password?

If my answer was helpful please Like and Accept my post as the Solution
0 Likes
jrltrend
Excursionist
42 0 11

.............................

0 Likes
Bluish
Shopify Partner
555 78 87

Ok 2 things,

1. You need to make your pictures exactly square, if you have a rectangle it will make an eclipse shape. (See picture below.

2. Add this code to your theme.scss

 

grid-image--centered img {
  border-radius: 50%;
}

 

 

Bluish_0-1611528689539.png

 

If my answer was helpful please Like and Accept my post as the Solution
0 Likes
jrltrend
Excursionist
42 0 11

Thanks s much, IT WORKS!!!

One more question.. How can i get this tags in small brands symbols insteed of textbrands.png

0 Likes
Bluish
Shopify Partner
555 78 87

Hi @jrltrend 

It'll require backend coding and liquid. It's not a one line code unfortunately.

You'd need to hire someone to do it if you don't know how.

 

Essentially what you do is if text == this.. show this picture 

If my answer was helpful please Like and Accept my post as the Solution
0 Likes