JavaScriptを有効にしてください

Hugoでブログを作ってみた

 ·  ☕ 2 分で読めます

    Hugo + GitHub Pagesで作成してみました。(ここの話)

    Hugoとは

    HugoはGolang製の静的サイトジェネレータで、Macの場合はHomeBrewでインストール出来るので導入も簡単でなため今回選択しました。

    テーマがたくさんあるため、ブログに限らずドキュメントやLPなども作れます。

    ブログのテーマはたくさんあり善し悪しが分からなかったのでクイックスタートに記載されている公式推奨(?)テーマのAnankeをチョイス。

    インストール

    作成自体は公式のクイックスタートの通りでサクッと出来ました。

    よかったことわるかったこと

    よかったこと

    Brewでインストール出来るため導入が非常に簡単。
    元々私自身golangを書くのでインストール済みではありますが、言語環境のインストールも不要なので別環境を作るのも簡単なのがポイント高く。
    開発サーバーの立ち上げも非常に早いところが良いです。

    わるかったこと

    悪いと言うほどではないですが少しつまずいたのはコンフィグで変更できる所とレイアウトのテンプレートを編集しなければいけない箇所が少しわかりにくい所です。

    コンフィグもレイアウトのテンプレートもテーマによって異なるようで、Hugo公式のドキュメントAnankeのREADMEをみつつ、テンプレートにデバッグコードを入れて仕組みの理解が出来てやっといじれるようになってきました。

    変えた事

    • ヘッダーの色変える(コンフィグ)
    • TwitterやGithubへのリンク(コンフィグ)
    • 設定しないコンテンツ部分をトルツメ(レイアウトファイル)
    • GA4のタグをヘッダーに追加(レイアウトファイル)

    Hugoではテーマのカスタマイズ時にテーマフォルダないのレイアウトファイルをコピー(もちろんゼロベースでも良いですが)して同名のファイルをプロジェクトルート直下のlayoutsに配置する事でオーバーライド出来ます。

    クイックスタートの手順どおりやると元々のテーマはGitサブモジュールにてインストールするため直接変更出来ないので注意が必要です。
    (違う方法でインストールしても直接弄ってしまうとバージョンアップ時に困るので厳禁ですけど)

    次回予告

    さっくりですが今回はここまで、GitHubへのデプロイはまた次回

    共有

    NakMe
    著者
    NakMe
    Mobile & Web Developer