Hugoで注釈、tips、警告の表示について
Hugoのshortcodeとはなに?
HugoはMarkdown記法のテキストファイルをHtmlに変換し静的サイトを出力するSSG(static site genarator)です。 Hugoで利用するshortcodeとはMarkdown記法では表現できない表示を可能にする拡張した機能を言います。
Markdownは簡単な記載でHtmlの表現が出来ますが、複雑な表現をしたい場合は色々と制限が出てきます。 幸いにも、MarkdownはHtmlタグの使用が出来ますがタグが多かったりするとMarkdownテキストの可読性やシンプルさのメリットを活かせなくなります。
特に注釈やtipsなどの表現はMarkdownになくGFMやqiitaなどでは独自の拡張機能で用意されています。
Hugoにおけるalert表示の仕方
Hugoでも注釈やtipsの独自記法があるのか公式サイトなど調べて見ましたが特にデフォルトでは無いのかな??(自分が見つけられなかっただけかも)
Hugoの各種テーマではShortcodeを使用しあらかじめ用意された、組込まれたテーマを呼び出すようにして注釈やtipsやアラート、警告表示をし文章を目立たせることが出来ます。
Hugo tranquilpeak テーマで注釈、アラート、警告の表示
{{< alert info >}}
Here is a info alert without icon
{{< /alert >}}
{{< alert success >}}
Here is a success alert without icon
{{< /alert >}}
{{< alert warning >}}
Here is a warning alert without icon
{{< /alert >}}
{{< alert danger >}}
Here is a danger alert without icon
{{< /alert >}}
{{< alert danger no-icon >}}
Here is a danger no-icon alert without icon
{{< /alert >}}
公式サイト: https://github.com/kakawait/hugo-tranquilpeak-theme/blob/master/docs/user.md#alert