サンプル

記事のサンプル．

ヘッダのdraft: をfalseにすると，実際のblogに出力されるので注意．

featured_imageのパスの指定に注意．

上記のタグを明記すると，そこまでがsummaryとして表示される．明記しない場合は140字まで表示される（config.tomlで定義）．

参考

https://note.mokuzine.net/hugo-summary-length/

https://blog.mosuke.tech/entry/2017/08/06/hugo_summary/

など．

テキスト

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

• ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ

レベル1

レベル2

レベル3

• a
• b
• c

コードブロック

$ top

def hoge():
	pass

画像

パスの指定は上記のようにする．

上の書き方もある．これは shortcode という機能で，うまく使って画像ファイルを一律小さくしたいのだが，うまい方法が見つかっていない（上記はanankeのcssを上書きして初めて機能する．とりあえず，暫定）

リンク

Google

Google(別タブで開く)

以下は，layouts/shortcodes/open_tab.htmlで定義している書き方で，別タブ+noreferrerで開く．

• 大して記述量が減らないので，結局使っていない気がするが…

以下は，layouts/shortcodes/notice.htmlで定義．

以下は，layouts/shortcodes/textbox.htmlで定義．

以下は，layouts/shortcodes/whitebox.htmlで定義．

Mermaid

cssで背景色を変更していることに注意

sequenceDiagram
    participant Alice
    participant Bob
    Alice->>John: Hello John, how are you?
    loop Healthcheck
        John->>John: Fight against hypochondria
    end
    Note right of John: Rational thoughts <br/>prevail!
    John-->>Alice: Great!
    John->>Bob: How about you?
    Bob-->>John: Jolly good!