Changing the social Media Icons

These are CSS that is responsible for it. We can change font size to increase the size of icon there, along with the color and color on hover.

.social li a { color: #939393; font-size: 18px; }

.social li a:hover { color: #e96656; }

The code must be used in a Custom CSS plugin, or in theme Custom CSS option if provided.

Thanks, I put that code in the Custom CSS plugin and nothing changed.
Id really like to change the icon all together to something coloured like the others
https://www.tallyandtick.com.au is my webpage, you can see the icons I have in the footer. I have icons in my media library for the facebook and linked in as well. I just don’t know how to get them to change.

Just an Update – I have changed the background colour so all good for that.

I just need to change the icons, space them out the same as the business details ones and add the label underneath.

Can anyone help with that? (this is the last think I would like to change that I just cannot figure out.)

Sorry another update!!
I have managed to fix it all. I added another icon to the company details section instead. However the code links to the information I enter to the Customiser section. Which parts of the following code do I replace to make it show an icon from my media library and which part for the text/link?

/* COMPANY PHONE NUMBER */

if( !empty($zerif_phone) ):
echo ‘<div class=”‘.$footer_class.’ company-details”>’;
echo ‘<div class=”icon-top blue-text”>’;
if( !empty($zerif_phone_icon) ) echo ‘<img src=”‘.esc_url(__($zerif_phone_icon,’zerif-lite’)).'”>’;
echo ‘</div>’;
echo $zerif_phone;
echo ‘</div>’;
endif;

Hi, I was just wondering how you managed to change the icons? I have the same issue and was hoping you could help!
Thanks!
Laura

Hello Laura,

Take a look at this document: https://docs.themeisle.com/article/8-adding-new-social-icons-to-zerif-footer

Best regards,
Alexandra