特别声明:文章分网络转载,个人原创,原创还请著名地址,特殊资源除外,如转载资源有侵权请联系!

摘要:阿里ico图标挺好看的,调用也方便,所以这里就分享出来经验与教程
-春节倒计时-
2020年1月25日 (庚子年(鼠年)
农历正月初一 星期六
目前距离2020年春节还有
23天 01 时 49分 0 秒

效果图

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

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

我要飞的更高

创建账号+项目

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

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

 

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

 

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

 

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

 

点击搜索图标库,可以中文搜索哦,这里选择爱心 (测试)

 

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

 

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

 

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

 

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

使用阿里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>

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

代码

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

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

注: #icon-zhuye 要更喜欢你需要的图标代码哦
使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标

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

  1. 快速获取资源选择支付推荐登录支付-订单可永久保存
  2. 未登录客户支付获取资源后台会使用cookie+IP验证,一样会判断是否已支付
  3. 如果支付后未跳转请联系客服哈付费仅为测试主题稳定开发
  4. 开通会员可全站免费下载资源

未经允许不得转载:作者:记磊博客, 转载或复制请以 超链接形式 并注明出处 轻刻年轮
原文地址:《使用阿里ico图标给WordPress导航栏添加好看图标博客菜单图标》 发布于2019-12-01

分享到:
赞(1) 打赏
本文共658个字,预计阅读时间需要2分钟。
您阅读这篇文章共花了: 0小时00分00秒

评论 抢沙发

评论前必须登录!

  注册



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

长按图片转发给朋友

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

Vieu4.0主题
专业打造轻量级个人企业风格博客主题!专注于前端开发,全站响应式布局自适应模板。

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录