本記事の概要
Hugo + Blowfishテーマなサイトで、一部の翻訳だけ上書きする方法について説明する初心者向けTips的な記事です。
前提
Hugo+Blowfishテーマ適用済みの環境です。
なお、Windowsでの操作を想定しています。
(本記事が属するアドベントカレンダーについてもご確認ください)
例
Hugo + Blowfishテーマでは、TOPページに「最近の記事」を表示できます。
ただ、この「最近の記事」という文言はBlowfish側が設定している文字列です。
従って、Markdown側に「最近の記事」と書いていないのにも関わらず表示される形です。
この「最近の記事」を例えば「更新情報」などといった別の文言に書き換える方法です。
i18nの仕組み
Blowfishテーマはi18n対応されており、言語ごとに翻訳ファイルをyaml形式で保持しています。
実際にビルド環境のthemes/blowfish/i18nディレクトリを開くと、言語ごとにyamlファイルが格納されています。
上書きしたい表現を探す
ここで、ファイル名は言語.yamlといった形で名前が付けられています。
日本語の場合は、ja.yamlです。
今回は「最近の記事」を「最新情報」に上書きしたいので、このファイルを「最近の記事」で検索します。
すると、次のような行が見つかります。
shortcode:
recent_articles: "最近の記事"
表現を書き換える
themes/blowfish/i18n/ディレクトリ内の中身を書き換えるのはやめましょう
Hugoの仕組みとして、テーマの設定内容の一部だけをユーザーが書き換えられるように作られています。
Hugoの環境直下のi18nディレクトリ内にja.yamlを作りましょう。
そして、以下のように書きます。
なお、yamlファイルは#を使うことでコメントが書けます。
そのため、コメントは好みに応じて適宜変更してください。
shortcode:
# TOPページの表記を考慮して意図的に翻訳を書き換える
recent_articles: "最新情報"
書き換えたい項目(この場合ではrecent_articles)の行だけでなく、その親となる項目(この場合ではshortcode:) の行も忘れず書きましょう。またインデントにも注意してください。
つまり、themes/blowfish/i18n/ja.yamlをベースにして、
上書きしたい部分だけをi18n/ja.yamlに記載する形です。
こうすることで、i18n/ja.yamlに記載されていればそちらの内容を、
それ以外はthemes/blowfish/i18n/ja.yamlの内容を参照して翻訳を表示します。
従って、差分だけがi18n/ja.yamlに残るような仕組みになっています。
確かめてみる
Hugoの内蔵サーバーを使って確かめると下記のようになります。
hugo server
結果
無事書き換えることが出来ました。
まとめ
Hugo直下のi18nフォルダを利用することで、テーマ側の翻訳の一部だけを上書きできます。
上書きしたいファイルと同じファイル名にして、上書きしたい部分だけを記載すれば済むようになっていますので、必要に応じて、細かくカスタムできるようになっています。
サイトの雰囲気などに合わせて表現を変えたい方は、この方法を使いましょう。