Hugoでレイアウトを共有して多言語サイトを実装する

Implementing a multilanguage website by sharing layouts by Hugo
通常、Hugoで多言語(i18n)に対応したウェブページを実装するのであれば、言語ごとにcontentフォルダーを作成し、そのフォルダーごとに文章を記述することになります。しかしながら、この手法だと、共通の画像を組み込んでいた場合、その画像を差し替えるとなると、すべての文章の画像タグを入れ替える手間が生じます。

この問題を解決する方法の一つとして私が考案したのは、言語データのテキストをリソースとして編集するというものです。
以下のコード例のように、リソースをショートコードの一部として読み込ませることで、レイアウトやテンプレートを統一したまま多元とに対応したウェブページを簡単に作成できるようになります。
about.en.toml 
title = "About this"
about = '''
TNK Surround Audio System is an audio server application that specializes in surround audio. Surround audio mixing output can be easily realized by using a USB audio adapter.
'''
con = "Easy connection"
con_desc = '''
Just select the inputs and outputs and press the play button, and you can enjoy the powerful sound.
'''
about.ja.toml 
title = "このアプリについて"
about = '''
TNKサラウンドオーディオシステムは、サラウンドオーディオに特化したオーディオサーバーアプリです。市販のUSBオーディオアダプターなどを活用することで、これまでは環境の構築が難しかった、ブルーレイプレーヤーや家庭用ゲーム機のサラウンド音声と、携帯端末から転送されたBluetoothオーディオ、そして、パソコンで再生された音声のミキシングが手軽に行えるようになります。
'''
con = "簡単接続"
con_desc = '''
入力元と出力先を選び、再生ボタンを押すだけで迫力のあるサウンドをお楽しみいただけます。
'''
これらのtomlファイルはリソースなので、実際のファイルの場所は「data/en/about.toml」「data/ja/about.toml」となりますので、気を付けてください。
about.md 
# {{< ts title >}}

{{< ts about >}}

## {{< ts con >}}
{{< ts con_desc >}}

プロジェクトのサンプルはGithubに公開しています。
2021/01/31
[ 目次 ]