Featured image of post Hugo自定义全局字体

Hugo自定义全局字体

本文采用的是思源黑体,可以在Google Font查询更换其他字体,详细可查看Google Fonts API

  • 字体样式:https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700&display=swap
  • 字体名:Noto Sans SC,即上方链接中family=后的字符串,+替换为空格

在站点根目录新建文件 ./layouts/partials/head/custom.html,内容如下:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
<style>
    :root {
        --article-font-family: "Noto Sans SC", var(--base-font-family);
    }
</style>

<script>
		(function () {
		    const customFont = document.createElement('link');
		    customFont.href = "https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700&display=swap";
		    customFont.type = "text/css";
		    customFont.rel = "stylesheet";
		    document.head.appendChild(customFont);
		}());
</script>
Licensed under CC BY-NC-SA 4.0
使用 Hugo 构建
主题 StackJimmy 设计