关于hexo博客的阿里图标配置

关于hexo博客中的阿里图标配置

在hexo上怎么配置自己的阿里图标库

1. 在阿里巴巴示例图标库iconfont注册账号

2. 在上方导航栏找到资源管理>我的项目>新建项目创建自己的项目。

3. 在主页中搜索想要的图标，点击图标上的购物车将图标添加到购物车中，在上方导航栏找到购物车，点击添加至项目选择要加入的项目。

4. 在我的项目中找到创建的项目，查看添加的图标，可以点击编辑找到Font Class/Symbol

更改名字。

5. 在项目上方的三个选项卡中Unicode/Font class/Symbol选择Symbol点击右方的查看在线链接点击底下生成代码复制代码链接。

6. 找到主题配置文件中的icons选项中的iconfont_js，将上面复制的链接粘贴到iconfont_js选项中。

注意：这里要在链接前面加上加上https:

icons:
  ali_iconfont_js: https://at.alicdn.com/t/c/font_4701050_glborhpap6v.js# 阿里图标symbol 引用链接，主题会进行加载 symbol 引用
  fontawesome: true #是否启用fontawesome6图标
  fontawesome_animation_css: #fontawesome_animation 如果有就会加载，示例值：https://npm.elemecdn.com/hexo-butterfly-tag-plugins-plus@1.0.17/lib/assets/font-awesome-animation.min.css

7. 在使用时只需要复制阿里巴巴矢量图标库中的图标名称就行了。

复制时记得在项目中的Symbol选项下复制名称，也可以打开Font class链接在页面最下方有名字。

8. 在每次新添加图标后记得回到Symbol更新链接，将链接重新粘贴到主题配置文件中的icons选项中的iconfont_js中

[up主专用，视频内嵌代码贴在这]