wordpress如何引入iconfont SVG格式图标？

大家好 ，我是FUNION数字营销实战派飞小优，在做项目过程中少不了需要一些icon，由于WP大部分都是引入的fontawsome，都烂大街了，但是你若是引入不同的SVG格式图标那恭喜你，你大概率会出彩！如何实现？教程如下：

先登录iconfont官网后台

① 没有账号的先注册账号登录后传送门👉https://www.iconfont.cn/，然后选择适合icon加入到项目中，如下：

② 新增图标项目，按照下图进行填写

③ 更新代码链接引入到网站中，代码一般是这样的：//at.alicdn.com/t/c/font_字符串.js

然后引入到首页中，其引入代码为：<link rel="stylesheet" href="复制你的代码地址--以at开头的" type="text/css" media="all"> 如下图：

输出应用图标到指定位置

当添加完之后，就可以进行准备应用了，但是应用之前还需在添加css代码到你的style.css中，全局引用一次就行，如：

.icon { 
    width: 1em; 
    height: 1em;
    vertical-align: -0.15em;
    fill: currentColor; 
    overflow: hidden; 
}

那如何把刚才挑选的图标引入到导航中，做完以上两步之后，你只需在将以下代码加入到菜单标签前即可，如下：

<svg class="icon" aria-hidden="true"> <use xlink:href="#icon-xxx"></use> </svg> 注意这个#icon-xxx 就是你添加之后的图标，换成你的#icon-Photo

最后添加你加到菜单前就长这样，如下：

再看看前端效果，如下效果美美哒！

写在最后

以上就是wordpress如何引入iconfont SVG格式图标的详细教程，赶快去试试吧，如果你有遇到任何不会的地方或者操作困难的地方请在下方留言，若有外贸建站需要可以直接联系我们！