问题
Let me just apologize up front for my ignorance; I've never really seen PHP up-close and am really new to the Wordpress world...
I added a Pinterest option to a social media widget using this tutorial. The addition worked, giving me a new Pinterest option in the widget. The widget says 'Pinterest' on the dashboard side and links to Pinterest perfectly on the front end.
The problem is the site is displaying a Google+ icon instead of a Pinterest icon. What's even weirder is that when you 'inspect element' the html is specifying the pinterest.png icon—but, of course, showing the Google+ icon. All I can really do is scratch my head at this point…
Any help would be appreciated. I'm not even sure what I need to include here: the whole php file that I edited? a link to the site? I'm happy to provide whatever I need to.
Thanks for the help, guys.
回答1:
So what's going on here is that the image is hidden on line 56 of main-style.css
:
.social.social__row li.social_li a .social_ico img,
.social__list li.social_li a .social_ico img
{ display:none !important; }
And the Google+ icon is added via a pseudo element (:after
) who get the Google+ image front an icon font:
.social.social__row li.social_li:last-child a .social_ico:after,
.social__list li.social_li:last-child a .social_ico:after
{ content:"\f0d5"; }
So what you need to do is to add an other css rule for your Pinterest icon, something like that :
.social.social__row li.social_li a.social_link__pinterest .social_ico img {
display: block !important;
}
.social.social__row li.social_li:last-child a.social_link__pinterest .social_ico:after {
display: none;
}
Should do the trick.
UPDATE
If you want to use the Font Awesome Pinterest icon, delete the two lines we added before, and add this :
.social.social__row li.social_li:last-child a.social_link__pinterest .social_ico:after {
content: "\f0d2";
}
来源:https://stackoverflow.com/questions/30483635/adding-new-social-network-to-socmed-widget-through-php-wrong-icon-showing