Hugoには投稿記事から簡単なカスタムスニペットを呼び出すための、ショートコードと呼ばれるものがあります。
例のようにユーチューブの動画を埋め込んだり、アマゾンの商品番号からフィリエイトのタグを埋め込んだりなど、 ポストごとにタグを打ち込んでいくような必要があり、頻繁に使用する必要がある場合にショートコードを使うとかなり便利です。後々の更新などもショートコードを変更するだけなので、メンテナンスも楽になります。(でも使いすぎると、他のジェネレーターに変えた時の意向が面倒かな。。)
テンプレートファイルの保管先とタイプ
Hugoの諸々のテンプレートファイルはほぼ全て同じ場所に保管されます。ショートコードも同様に /layouts/shortcodes/
に保存します。
ファイル名はショートコード名.html
とします。
使用例(ユーチューブタグ)
youtubeの動画を埋め込むタグを作ります。フィル名は youtube.html
になります。そのファイルを/layouts/shortcodes/
に保存します。
youtube.html
の中身は以下、{{ index .Params 0 }}
でパラメータを読み込みます。
<div class="embed video-player">
<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/{{ index .Params 0 }}" allowfullscreen frameborder="0">
</iframe>
</div>
投稿記事へショートコードの埋め込みはシンプルで、**{{ < youtube _WEMtYj2pJc > }}**を挿入するだけです。 ちと、勝手ながら猫動画を。。
表示は以下のようになります。
書き出されるコードは以下。
<div class="embed video-player">
<iframe class="youtube-player" type="text/html"
width="640" height="385"
src="http://www.youtube.com/embed/_WEMtYj2pJc"
allowfullscreen frameborder="0">
</iframe>
</div>
複数のパラメーターをとってきたりもできるらしいので、もう少し細かいことを知りたい方は本家のドキュメント を参照してください。