使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标-轻刻年轮

效果图

由于小编喜欢小图标就随便找了几个
下面给出详细教程

我要飞的更高

创建账号+项目

地址: https://www.iconfont.cn

注册账号进入然后点击图标管理-我的项目

图片[2]-使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标-轻刻年轮

新建项目只需要填写名称就好啦

图片[3]-使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标-轻刻年轮

点击搜索图标库，可以中文搜索哦，这里选择爱心（测试）

图片[4]-使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标-轻刻年轮

加入购物车（不要钱哦）
然后选中自己喜欢的加入，可以彩色的，可以去选图标库里的多色图标哪里挺好看的
选好后点击右上角购物车-把图标添加我的项目，选择项目添加上

图片[5]-使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标-轻刻年轮

去我的项目里面选择Symbol 选项，点击红色的“暂无代码，点此生成”选项生成后会有一个链接

图片[6]-使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标-轻刻年轮

代码

将以下代码复制到主题目录下header.php文件的标签前。

<!--阿里iconfont引入JS-->
<script type='text/javascript' src='此处放置你在我的项目里生成的代码链接'></script>
<!--阿里iconfont引入CSS-->
<style type="text/css">
.icon {
width: 1em; height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
</style>

图片[7]-使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标-轻刻年轮

代码

在WordPress 后台 > 外观 > 菜单 >导航标签栏目内添加以下代码

<svg class="icon" aria-hidden="true"><use xlink:href="#icon-zhuye"></use></svg>首页

注： #icon-zhuye 要更喜欢你需要的图标代码哦
图片[8]-使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标-轻刻年轮

如有不懂，可以多多交流哈

购买后下载不了源码或源码功能失效请联系小编，确认后可立即退款，请勿无理投诉

版权声明 1、本网站名称：轻刻年轮
2、轻刻年轮提供的资源仅供您个人用于非商业性目的。
3、本站文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系客服进行删除处理。
4、本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5、本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向客服举报
6、本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。
7、本站积分货币获取途径以及用途的解读，想在本站混的好，请务必认真阅读！。
8、本站强烈打击盗版/破解等有损他人权益和违法作为，请各位会员支持正版！

THE END