hugo-coderで日本語フォントを設定する

1分で読めます
ブログ構築記録 • 新技術の試用

hugo-coderのフォントが日本語ではない。

日本語フォントに変えたいと思った。

Google FontよりNoto Sans JPを選択して追加した。

やったこと

  • config.tomlにcustomCSSの設定を追加。
  • static配下に設定したCSSを追加

差分の例

--- a/hugo/config.toml
+++ b/hugo/config.toml
@@ -42,7 +42,7 @@ maxSeeAlsoItems = 5
 # Enable Twemoji
 enableTwemoji = false
 # Custom CSS
-customCSS = []
+customCSS = ["css/custom_style.css"]
 # Custom SCSS
 customSCSS = []
 # Custom JS

追加したcssは次のファイル。とりあえず気になったところを上書きしている。

body {
  font-family: 'Noto Sans JP', sans-serif;
}
h1 {
  font-family: 'Noto Sans JP', sans-serif;
}
.list ul li .title {
  font-family: 'Noto Sans JP', sans-serif;
}

以下のStackOverflowを見ると、 custom_css というパラメータで指定しても動く様子。 ただ、hugoのexample configだとcustomCSSというパラメータだったので、今回はこちらを採用した。

https://stackoverflow.com/questions/49248195/change-font-in-hugo-theme