「自作もいいけど、やっぱりプロが作った公式テーマも使ってみたい！」
もちろんOKです。Hugoには数千種類の素晴らしいテーマが公開されています。

ここでは、既存のテーマをインストールし、それを 「直接書き換えずに」 自分好みにカスタマイズする方法（WordPressでいう「子テーマ」のような機能）を解説します。

1. テーマのインストール

今回は例として、シンプルで人気のある Ananke テーマを入れてみましょう。
テーマは基本的に themes フォルダの中にダウンロードします。

Gitを使う場合（推奨）

Gitを使えば、テーマのアップデート（git pull）が簡単にできます。

git init # まだGit管理していない場合
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke

hugo.toml の設定

テーマを使うには、設定ファイルで「このテーマを使うよ！」と宣言する必要があります。

theme = 'ananke'

これで hugo server を再起動すれば、デザインがAnankeに変わっているはずです。

2. テーマの改造：やってはいけないこと

❌ themes/ananke/layouts/index.html を直接書き換える

これは絶対NGです！
なぜなら、将来テーマのバージョンアップ（git pull）をした時に、あなたが書き換えた内容が上書きされて消えてしまう からです。

3. 正しい改造方法：ファイルを「上書き」する

Hugoには 「Lookup Order（探索順序）」 という重要なルールがあります。
簡単に言うと、「themesフォルダの中身よりも、プロジェクト直下のファイルが優先される」 というルールです。

WordPressを知っている人なら、「Hugoは自動的にすべてが子テーマのような状態になっている」 と考えると分かりやすいでしょう。

具体的な手順

例えば、Anankeテーマのトップページ (themes/ananke/layouts/index.html) の文言を少し変えたいとします。

  1. 元のファイルを探す: themes/ananke/layouts/index.html というファイルがあることを確認します。
  2. 同じ場所にコピーを作る: 自分のプロジェクトの layouts フォルダに、同じ構造を作ります。
    • 作成先: (プロジェクトルート)/layouts/index.html
  3. コピーしたファイルを編集する:
    • themes の中のファイルはいじらず、自分で作った layouts/index.html だけ を編集します。

Hugoはページを表示する時、以下のような順序でファイルを探します。

  1. 自分たちの layouts/index.html （あった！これを使おう！）
  2. themes/ananke/layouts/index.html （1があったから無視）

これで、テーマ本体を汚すことなく、安全にカスタマイズができました。
もしカスタマイズをやめたくなったら、自分で作った layouts/index.html を削除すれば、元のテーマのデザインに戻ります。

まとめ

  • テーマは themes フォルダに入れる。
  • 改造するときは、テーマファイルを直接触らない。
  • 「同じパス（フォルダ構造）で自分のフォルダにそのファイルを作れば、それが優先される」。

これがHugoの強力なカスタマイズ機能です。
自作テーマを作っている時も、この「上書きルール」を理解していると、特定ページだけデザインを変えたい時などに非常に役立ちますよ！