shortcodesとは
mdファイルの中で使用できる小さなテンプレートのようなものが用意されています。
HUGOの組み込みのshortcodesには、下記のようなものがあります。(自分が使用しそうなものだけ抜粋しています)
HUGOのショートコード
カスタムショートコードを作成する
引用のためのショートコードを"cited"という名前で作成します。
ショートコードのテンプレート
layouts/shortcodes/
配下にテンプレートを作成します。
1
2
3
4
5
6
|
<b class="cited">{{.Inner}}</b>
{{ if and (isset $.Params "from") (isset $.Params "link") }}
<br/><small><a href="{{.Get "link"}}" target="_blank">{{.Get "from"}}</a></small>
{{ else if (isset $.Params "from")}}
<br/><small>{{.Get "from"}}</small>
{{ end }}
|
mdファイル内で使用する
生成されたコード
HTML
ブラウザで確認
スタイル(参考)
1
2
3
4
5
6
7
8
9
10
|
.cited {
&::before {
font-size: 2rem;
content: "\201C";
}
&::after {
font-size: 2rem;
content: "\201D";
}
}
|
リンク
HUGOカスタムショートコード