Social Media Icon Style

Hi there,

How can I make the social media icons circle?

The default ones are square.

Can I change the icon colours without affecting normal a and a hover colours?

Thanks,

Hi Rearolam,

Thanks for reaching out.

The icons aren’t changeable to circle since they are graphics, but the box or container can have a background and change to circle. Now that you also wish to change the icon color it would look different, imagine a blue icon with orange circle background, it’s not too readable.

So for now, I’ll provide a simple CSS that changes it to circle but only change the icon color to a white color, but also maintain the hover color. Please add this CSS to Theme Options > CSS


    .x-colophon-content p:last-child a {
    display: inline-block;
    color: #fff;
    background: rgb(242,101,34);
    padding: 5px 10px;
    border-radius: 90px;
    }
.x-colophon-content p:last-child a:hover {
color: rgb(51,112,183);
}

Cheers!

Thanks, it has worked out.

You’re welcome, @Rearolam.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.