jetpack custom icons

Hi there, the following will get you going. What you need to do is use the web inspector built into your browser to find the relevant CSS for each of the icons and then do like I have below for your Facebook icon. You can use this as a guide and update the URLs for the images.

.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
	content: url('https://bluedewdesign.com/wp-content/uploads/2017/04/facebook.png')
}

the code worked, great! Only when I enter more like this:

.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
        content: url('https://bluedewdesign.com/wp-content/uploads/2017/04/facebook.png')
}
.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
        content: url('https://bluedewdesign.com/wp-content/uploads/2017/03/instagram_z.png')
}
.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
        content: url('https://bluedewdesign.com/wp-content/uploads/2017/03/pinterest_z.png')
}
.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
        content: url('https://bluedewdesign.com/wp-content/uploads/2017/03/linkedin_z.png')
}

they get stacked upon each other, and some of the old ones remain visible… or did I used the code wrong?

• This reply was modified 7 years, 8 months ago by annem5.
• This reply was modified 7 years, 8 months ago by annem5.

somehow they get stacked upon each other… the code works for one, but when I enter more only the last one is visible. And the old ones remain visible as well. or did I use the wrong code? I used this:

.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
        content: url('https://bluedewdesign.com/wp-content/uploads/2017/04/facebook.png')
}
.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
        content: url('https://bluedewdesign.com/wp-content/uploads/2017/03/instagram_z.png')
}
.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
        content: url('https://bluedewdesign.com/wp-content/uploads/2017/03/pinterest_z.png')
}
.widget_wpcom_social_media_icons_widget .genericon-facebook::before {
        content: url('https://bluedewdesign.com/wp-content/uploads/2017/03/linkedin_z.png')
}

• This reply was modified 7 years, 8 months ago by annem5.

sorry for the extra message that is the same..
And I also see the mistake I made! Its solved now. I had to change the name of facebook into the other media names.
So thank you for your help!

something strange is going on with my icons. when I add the code in the additional css plugin it changes the icons. But when I add the same code only in my child theme, nothing happens. The old ones remain visible.
How can I solve this?