记录hugo 一些常用的shortcode

Raw

如下是一个使用svg绘制的钟表

Asciinema

Plantuml

Mermaid

使用标准 Markdown 代码块即可渲染 Mermaid 图表。

flowchart TD
    A[Markdown mermaid code block] --> B[Hugo render hook]
    B --> C[Load Mermaid only on pages that need it]
    C --> D[Render diagram in browser]
sequenceDiagram
    participant User
    participant Hugo
    participant Browser
    User->>Hugo: 写入 mermaid 代码块
    Hugo-->>Browser: 输出 Mermaid 容器和脚本
    Browser-->>User: 渲染图表

GraphViz

Graphvizo 服务已经不可用,这里改用 Mermaid 表达同样的关系图。

flowchart TD
    main[main] -->|weight=8| parse
    parse --> execute
    main -.-> init
    main --> cleanup
    execute --> make_string[make a string]
    execute --> printf
    init --> make_string
    main ==>|100 times| printf
    execute --> compare

Chart

Vega

Plotly

Blockquote

花开花谢 白天黑夜
一切自然 又不尽然
春夏秋冬 经过才懂
世间冷暖 无非自然

Imagecap

带标题的图片 Tmux基本概念 ◎ Tmux基本概念

不带标题的图片

折叠内容

测试折叠内容

测试折叠内容

print('hello')

RawHTML

《从前慢》 木心
记得早先少年时
大家诚诚恳恳
说一句 是一句
Everyday Italian Giada De Laurentiis 2005 30.00 Harry Potter J K. Rowling 2005 29.99 XQuery Kick Start James McGovern Per Bothner Kurt Cagle James Linn Vaidyanathan Nagarajan 2003 49.99 Learning XML Erik T. Ray 2003 39.95

Music

基于meeting js

spotify iframe

Notice

Warning

告警

Info

引言/通知

Note

记录

Tip

提示

Bilibili

Gist

Youtube

Audio

本地 MP3 示例

Video

本地 MP4 示例

Ref

Theme Documentation - Extended Shortcodes - LoveIt