通过 PHP 向 socmed 小部件添加新的社交网络 -- 显示错误的图标

Question

让我先为我的无知道歉；我从未真正近距离见过 PHP，我对 Wordpress 世界真的很陌生...

我使用此 tutorial 向社交媒体小部件添加了 Pinterest 选项。添加成功了，在小部件中为我提供了一个新的 Pinterest 选项。小部件在仪表板侧显示 'Pinterest'，在前端完美显示 links 到 Pinterest。

问题是网站显示的是 Google+ 图标而不是 Pinterest 图标。更奇怪的是，当您 'inspect element' 时，html 正在指定 pinterest.png 图标——当然，显示的是 Google+ 图标。此时此刻我所能做的就是挠挠头……

如有任何帮助，我们将不胜感激。我什至不确定我需要在此处包括什么：我编辑的整个 php 文件？一个 link 到网站？我很乐意提供我需要的任何东西。

谢谢大家的帮助。

Answer 1

所以这里发生的事情是图像隐藏在 main-style.css 的第 56 行：

.social.social__row li.social_li a .social_ico img,
.social__list li.social_li a .social_ico img
{ display:none !important; }

并且 Google+ 图标是通过伪元素 (:after) 添加的，伪元素 (:after) 获得 Google+ 图像前面的图标字体：

.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"; }

所以您需要做的是为您的 Pinterest 图标添加另一个 css 规则，类似这样的规则：

.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;
}

应该可以解决问题。

更新

如果你想使用 Font Awesome Pinterest 图标，删除我们之前添加的两行，然后添加：

.social.social__row li.social_li:last-child a.social_link__pinterest .social_ico:after {
    content: "\f0d2";
}

通过 PHP 向 socmed 小部件添加新的社交网络 -- 显示错误的图标

Adding new social network to socmed widget through PHP -- Wrong icon showing

php

wordpress

social-media

widget