Change social icons

Support
#1

Hello, I am trying to use custom css to change the social media icons in the topbar, here is what I put together:

.x-social-global .facebook {
background: url(http://petrill.gallagherbd.com/wp-content/uploads/2020/10/facebook-icon.png;)
}

This is not changing the icon. Any suggestions?

#2

Hi @gallagherBD,

Thanks for writing to us,

Please replace the previous code with the given CSS code in theme option’s CSS, to show the Facebook icon using an image.

.x-social-global a i {
display: none;
} 
.x-social-global .facebook {
    background: url(http://petrill.gallagherbd.com/wp-content/uploads/2020/10/facebook-1.png);
    background-size: contain;
    border-radius: 0;
    background-position: center;
}

The purpose of providing the custom CSS to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.

Hope it helps you.
Thanks

#3

Worked a charm! Thanks!

#4

Hi @gallagherBD,

Glad to help you. Have a nice day.

Thanks

#5

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