现在大部分博客图标都采用Font Awesome图标库，因为Font Awesome图标库满足了大部分用户的需求了，但做为喜欢花里胡哨的我们是不够的，Font Awesome图标库的图标不仅没有彩色的图标，个性化的图标还有点少！所以对于我们喜欢彩色的菜单图标选择性很少！所以只能引入其他的矢量图标库，今天我就分享一下WordPress引用阿里巴巴矢量图标库的彩色图标。
阿里巴巴矢量图标库网址：https://www.iconfont.cn/
食用方法
第一步：阿里巴巴矢量图标库官网 —> Github或者新浪微博登录
第二步：然后自己通过搜索框找到自己喜爱的图标并添加至购物车 —> 添加至项目 //没有项目的自己新建项目
第三步：跳转到我的项目 页面（没有跳转的点击–>资源管理–>我的项目）//我的项目自己创建名字
第四步：在 我的项目 页面有一下按钮—>一般选 Symbol
第五步：点击 –> 查看在线链接（没有的的话可以点击生成链接） —>点此复制代码（代码例如下面）
第六步：引入JS代码
在当前主题设置—>自定义JS代码 添加下面代码:(下面src=”这里是上面的JS代码，自行替换”)
第七步：添加css样式
在当前主题设置 –> 自定义CSS代码 或者目录下的 header.php 文件中适当位置添加以下代码:（不适用的，自行调整宽度）
第八步：添加彩色图标
一、在WordPress后台—> 外观 —> 菜单 —> 导航标签 添加以下代码:
二、上面的 iconziyuan 对应图标代码 //就是图库下面的图标名称
配合一行代码让你网站菜单图标旋转起来
在自己网站主题的CSS中加入以下代码：
在WordPress后台，将“fa-spin”添加到菜单中要旋转的图标代码的“class”中。
注：本站采用的是“子比”主题，主题自带CSS代码了，如果你Wordpress也是采用“子比”主题那么只需添加 JS代码 和 导航标签 即可！！！
![图片[11]-子比美化教程合集 美化只看这一篇文章就够了！！！-zibll美化交流分享社区-zibll子比主题-Wordpress主题模板-zibll子比主题](/wp-content/uploads/replace/a364775126f9eae3c5c0c315bab17fb2.png)
暂无评论内容