PaperMod主题更换字体

场景：

Hugo + PaperMod 搭建的github静态博客网页，需要更换字体

目标字体：

https://font.subf.dev/    英文确实好看，但是其汉字与英文字体风格迥异，搭在一起过于突兀

下载了MapleMono-Light.woff2文件_{（chatgpt更推荐该字体扩展格式.woff2）}

https://fonts.google.com/noto/specimen/Noto+Serif+SC/glyphs

推荐！！！某种程度上有黑体那样的明晰易辨，也有书法上的美感（汉字视角观之），英文美感稍逊一筹，二者风格均为俊秀隽永，同时出现依旧协调素雅，好看~

 

修改：

上传字体至项目的static/fonts目录下，然后写一个custom-font.css来应用该字体

@font-face {
  font-family: 'MyCustomFont';
  src: url('/fonts/myfont.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

/* Optional: apply the font globally */
body {
  font-family: 'MyCustomFont', sans-serif;
}

修改主题对应文件extend_head.html，添加一句应用上述static目录下的css

<link rel="stylesheet" href="/css/custom-font.css">

然后重新构建部署即可。

 

效果展示：

Ashe's Blog

 

思路：

字体文件，应用字体的css，在主题中渲染该css （需要你上传至github的主题是可修改的，即本地git删除了PaperMod目录下的.git，否则你在github中主题文件夹是空的，始终指向源主题github地址）

 

后记：

如果你的字体扩展格式是.ttf，那么custom-font.css中的format请使用truetype