• 欢迎访问残言博客,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站 QQ群
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏残言博客吧
  • 蓝奏云链接无法打开的请在本站搜索“蓝奏云”

给wordpress添加Font Awesome图标

技术教程 10个月前 (08-12) 288次浏览 已收录 0个评论 扫描二维码

如题,其实在不久之前很简单,只需要一个插件就可以。

QQ截图20200812190240.png

但是前几天不知道怎么了所有图标不显示,而且网站速度变得奇慢,最后经过排查发现就是Font Awesome Icons这个插件的问题。

禁用之后网站速度开始恢复,我去wordpress相关交流群问了一下,但是没得到答案,可能是因为用的人不多。

所以我也就直接把插件卸载了,把这个功能手动集成到wordpress主题里面。

下面把教程发出来,有疑问的可以直接留言。 :mrgreen:

1.下载Font-Awesome文件

文件链接我会放在文章底部。

QQ截图20200812190909.png

2.将以下代码引入主题文件

//Wordpress调用Font Awesome
add_action('wp_enqueue_scripts','load_fontawesome_styles');
function load_fontawesome_styles(){
global $wp_styles;
wp_enqueue_style('font-awesome',get_template_directory_uri().'/font-awesome/css/font-awesome.min.css');
wp_enqueue_style('font-awesome-ie7',get_template_directory_uri().'/font-awesome/css/font-awesome-ie7.min.css');
$wp_styles->add_data('font-awesome-ie7','conditional','lte IE 7');
}

你可以直接打开主题根目录下的 functions.php文件

然后把代码直接复制进去。

也可以在 后台-外观-主题编辑器 找到functions.php文件直接添加以上代码。

3.最后直接使用即可

<i class=”fa fa-bell” aria-hidden=”true”></i>

 

当然还可以修改图标大小及颜色以及变成动态,这些都可以很简单的实现。

在官网你都可以找到教程并且随意的实现你想要的功能。

 

相关文件及链接

蓝奏云 font官网


残言博客 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:给wordpress添加Font Awesome图标
喜欢 (0)
言
关于作者:
志当存高远。

您必须 登录 才能发表评论!