oneall WordPress插件 - 更改小部件输出

我想在我的WordPress博客上实现Facebook，Twitter和Google登录。我找到了一个叫oneall的好插件。它工作得很好，我猜（只有fb登录测试过一次）。我的问题是，我想要我自己的按钮的登录小部件。我可以通过CSS更改背景图片，但这不是我想要的。我想使用图标字体，我在页面中使用所有图标字体。因此，我需要将小部件的内容更改为'f'，'t'和'g'并设置它们的字体系列。oneall WordPress插件 - 更改小部件输出

下面是应该输出小部件代码的部分代码。

//Add the Plugin 
     $output [] = ' <div class="oneall_social_login_providers" id="oneall_social_login_providers_' . $rand . '"></div>'; 
     $output [] = ' <script type="text/javascript">'; 
     $output [] = ' oneall.api.plugins.social_login.build("oneall_social_login_providers_' . $rand . '", {'; 
     $output [] = ' "providers": ["' . implode ('","', $providers) . '"], '; 
     $output [] = ' "callback_uri": (window.location.href + ((window.location.href.split(\'?\')[1] ? \'&amp;\':\'?\') + "oa_social_login_source=' . $source . '")), '; 
     $output [] = ' "css_theme_uri": "' . 'http://test.nowillnoskill.net/wp-content/themes/NWNS/design/css/social.css' . '" '; 
     $output [] = ' });'; 
     $output [] = ' </script>'; 
     $output [] = ' <!-- oneall.com/Social Login for Wordpress/v'.constant('OA_SOCIAL_LOGIN_VERSION').' -->'; 
     $output [] = '</div>';

javacript从他们的服务器加载，所以我不能改变这一点。

我试图用jQuery来改变它（在文件准备好）喜欢

$('#facebook_button').html('f');

，我和CSS

#facebook_button {content: 'f'}

尝试过，但既不工作。我也尝试简单地复制应该输出代码的函数的输出，但这也不起作用。

你可以在test.nowillnoskill.net上看到我的尝试。在侧边栏中，顶部有我的图标字体按钮（这就是我想要的）以及在它们下面改变背景的按钮。你可以看到底部的模糊和丑陋。

有没有人有任何想法我该怎么做？我已经问过插件的作者，但他们没有回应

来源

2012-07-28 Mariano Grandioso

如果我没记错，您已经向我们发送了对此问题的支持请求。

您必须添加:before：

#button_facebook:before { 
    content: 'f'; 
}

然而，这不是一个很好的解决方案。没有安装此字体的人将无法按预期方式查看该页面。最好的是使用自定义图像。

来源

2012-07-31 10:49:32

实际上，“图标字体”是在网页上制作图标的完美有效方式，并且令人惊讶地跨浏览器兼容。你只需要在'@ font-face'声明中包含字体请参阅[csstricks]（http://css-tricks.com/examples/IconFont/） – pwp2 2012-10-29 23:26:06

oneall WordPress插件 - 更改小部件输出

回答

相关问题