anzhiyu主题自定义博客字体

事情的起因是应为群友不会如何自定义博客字体，老是在群中询问，所以我写了这一篇文章

引入css

在source\css下新建一个font.css文件，在文件中写入(你也可以选择在一个已经引入的css文件中进行添加)

1
2
3
4
5
6
7
8
9
/* 字体css */
@font-face{
  font-family: 'HuangkaihuaLawyerFont'; 
  <!-- 其中HuangkaihuaLawyerFont是引入的字体的名称，可以自定义 -->
  font-display: swap;
  src: url('/ttf/huangkaihuaLawyerfont-2.ttf') format("truetype");
  <!-- url中填写自己的字体地址，我使用的是本地文件夹所以用的是相对路径，如果是外部引用的话在其中写入链接地址就好了 -->
}

在 _config.anzhiyu.yml 中找到

1
2
3
inject:
  head:
    # 自定义css

添加引入css

1
2
3
4
inject:
  head:
    # 自定义css
    - <link rel="stylesheet" href="/css/font.css" media="defer" onload="this.media='all'">\

这个css地址请根据你自己所创建的地址来进行引用

修改配置文件

在 _config.anzhiyu.yml 中找到

1
2
3
4
5
6
7
8
9
10
11
12
13
# Global font settings
# Don't modify the following settings unless you know how they work (非必要不要修改)
font:
  global-font-size: 16px
  code-font-size:
  font-family: 
  code-font-family: consolas, Menlo, "PingFang SC", "Microsoft JhengHei", "Microsoft YaHei", sans-serif

# Font settings for the site title and site subtitle
# 左上角网站名字 主页居中网站名字
blog_title_font:
  font_link:
  font-family:

在其中修改font-family ， 两个都需要修改

1
2
3
4
5
6
7
8
9
10
11
12
13
# Global font settings
# Don't modify the following settings unless you know how they work (非必要不要修改)
font:
  global-font-size: 16px
  code-font-size:
  font-family: 'HuangkaihuaLawyerFont'
  code-font-family: consolas, Menlo, "PingFang SC", "Microsoft JhengHei", "Microsoft YaHei", sans-serif

# Font settings for the site title and site subtitle
# 左上角网站名字 主页居中网站名字
blog_title_font:
  font_link:
  font-family: 'HuangkaihuaLawyerFont'

这里的HuangkaihuaLawyerFont应该填写在css中所引入的名称

结束

最后再执行一下hexo三连就能看到效果了