【メモ】 Hugoのshortcodesについて

【メモ】 Hugoのshortcodesについて

【メモ】 Hugoのshortcodesについて

Hugoのshortcodesは,テンプレートファイルとして用意したhtmlを呼び出すものです.Markdownで記述するコンテンツからは,逐一htmlを書くことなく,シンプルな記述で表現力が拡張されるように見えます.

Markdownの中で,NoteやTipsを表現するスタイルを探していたら,リンク先のような例があったのですが,そのまま利用できなさそうだったので,1ファイルで以下のようなスタイルを実現するshortcodesを用意しました.アイコンはMaterial iconsです.

github

たとえば,

{{< notice type=“note” >}} メモ {{< /notice >}}

と書くと,

edit   Note
メモ

のようにレンダリングされます.以下は他のサンプルです.

info   Info
情報
check_circle   Tips
Tips
warning   Warning
注意
help   Undefined
未定義