Hugo で Clarity テーマのカスタマイズ

Hitoshi Arakawa | 2024/12/03 Tue 04:38

Hugo で Clarity テーマをインストールした。

Hugo で Clarity テーマをインストールする | 荒川仁志 公式サイト https://www.hitoshiarakawa.com/blogs/2024/2024-12-01_clarify-theme-in-hugo/

Hugo で Clarity テーマをインストールする2 | 荒川仁志 公式サイト https://www.hitoshiarakawa.com/blogs/2024/2024-12-02_clarify-theme-in-hugo-2/

結局2つ目の方法で運用することにした。

ではテーマをカスタマイズしていこう。

環境:
・macOS Sequoia 15.0.1(英語環境)
・Hugo v0.136.2+extended

(1)【hugo.toml の編集】

  • DefaultContentLanguage:en のままにしておく。英語メニューでいいので。
  • enableRobotsTXT = false を追記。自分で robots.txt を設定したいので。
  • 以下を追記し、RSS の出力数を 50 に制限する。
[services.rss]
  limit = 50
  • hasCJKLanguage = true を追記し、日本語の要約で正しく文字数制御をする。
  • 要約の長さは summaryLength = 80 と追記すればいいはずだが、反映されていない感じだ。

(2)【/config/_default/params.toml の編集】

  • codeLineNumbers:true に変更。コードの表示で行番号を表示したいので。
  • numberOfRecentPosts:「最近の投稿」の表示数。コメントアウトを外し、15 にした。
  • dateFormat:日付の表示フォーマット。コメントアウトを外し、2006/01/02 Mon 15:04 に変更した。
  • logo の行をコメントアウトすることで、トップのデフォルトロゴを消せる。
  • Matomo のコードもここで設定できる。

(3)/config/_default/menus/menu.en.toml でトップメニューの表示を編集。

(4)/config/_default/language.tomltitle でサイト名を設定。

(5)今回は日本語のみのサイトなのでトップの言語切り替えボタンを非表示にしたい。

言語切り替えボタンを非表示にする設定方法は見つからなかったが、以下で見えなくすることができる。実は見えないボタンが残っているが、そこがクリックされる可能性は低いので良しとしよう。

/config/_default/language.toml[en][pt] の部分をコメントアウトする。

/config/_default/params.tomllanguageMenuName の行をコメントアウトする。

(6)About ページ等で投稿日付を非表示にしたい場合は、Front Matter に showdate: false と書く。Reading Time を非表示にする方法は分からなかった。

参考:
[Hugo] Hugoplate テーマで日付フォーマット設定 | 荒川仁志 公式サイト
https://hitoshiarakawa.com/blogs/2024/2024-05-11_date-format-in-hugoplate/

Hugoで始める静的サイト構築入門 静的サイトジェネレーターで作る自作サイト 技術の泉シリーズ (技術の泉シリーズ(NextPublishing)) | meganii | 工学 | Kindleストア | Amazon
https://amzn.to/4ia04JH