Volantis之引入字体图标iconfont

生成iconfont.css文件

✨https://www.iconfont.cn/✨

我是在这里找字体图标，过程如下：选择心仪的iconfont---加入购物车---加入项目---选择fontclass---点自动生成代码---点生成的连接---复制

把字体图标生成的 font class 文件复制到 hexo-theme-volantis\source\css 文件里。我给这个文件起的名字叫 iconfont.css。

引入字体图标

在博客的根目录页的 _config.yml 文件里，随便找一行，加入以下代码：

blog/_config.yml

import:
  link:
    - <link rel="stylesheet" href="/css/iconfont.css">

使用字体图标

在你需要加入字体图标的地方，比如 _config.volantis.yml 文件menu中的某个icon使用

menu:
    # The following can be written in `blog/source/_data/menu.yml`
    - name: 博客
      icon: iconfont icon-003-sakura
      url: /

就像这样，其中iconfont是必须要加入的，icon-003-sakura是你所选择的iconfont的编号，在网页中可以直接复制过来。

增加、更换字体图标

非常简单，只需要：

1. 重新生成 iconfont.css 文件
2. 再在合适的地方插入你的字体图标