说明
最近弄了个资源网,在设置顶部菜单时,感觉顶部只有文字空点难看,域名就在没个菜单前面加了个矢量图。

教程
阿里巴巴的矢量图库的图标非常的多,引用起来也非常的方便。于是,这次就引用了阿里巴巴的矢量图库。
首先,打开官网:https://www.iconfont.cn/

之后登陆进去,只能采用新浪微博进行登陆。
登录后,点击图标管理下的我的项目

进去后,点击新建项目

在这里,我们对项目进行命名。项目名称、FontClass/
Symbol 前缀、Font Family根据自己的需要可以随意设置(请记住自己设置的Font Family,后面会用到)

之后到图标库选择自己需要的,添加到购物车里

点击自己喜欢的图标,添加进购物车里。在添加至刚才自己新建的项目
回到我的项目,获取在线链接

之后,将改css引用到主题目录下的header.php,将下面的代码放到<head></head>之间
<link rel="stylesheet" type="text/css" href="阿里云生成的Font class代码">

最后,回到wordpress的后台,在菜单设置里进行添加。
在导航标签里,采用以下代码进行填写
<span><i class="xs iconhome"></i> 网站首页</span>
将xs改为你刚才新建项目时设置的Font Family,iconhome就是图标的代码,网站首页就是对应的导航显示的文字

PS
看完教程不会还不会操作的可在下方评论区留言。
本文未经允许,禁止转载!