本页面展示了 Hugo Narrow 主题中所有可用的短代码。
Hugo 内置短代码
Hugo 提供了一些内置短代码 ，这些内容不稳定并且随时可能变化，你可以访问页面找到详细使用说明。
内置短代码包括：
- Details
- Figure
- Gist
- Highlight
- Param
- QR
- Ref
- Relref
- Vimeo
- X
- YouTube
主题自定义短代码
图标
显示主题图标库中的 SVG 图标：
MARKDOWN
{{< icon name="heart" >}}
{{< icon name="github" size="lg" >}}
{{< icon name="sun" class="text-primary" >}}示例：
参数：
name：图标名称（必需）- 查看assets/icons/了解可用图标 或者将自定义图放置在此目录下size：xs、sm、md、lg、xl、2xl（默认：md）class：自定义 CSS 类，可以用来更改颜色
按钮
创建带主题颜色的样式化按钮：
MARKDOWN
{{< button text="了解更多" url="/about" >}}
{{< button text="GitHub" url="https://github.com" icon="github" target="_self" >}}
{{< button text="下载" url="/download" variant="outline" size="lg" >}}示例：
参数：
text：按钮文字（必需，或使用内部内容）url：链接地址（必需）variant：primary、secondary、outline（默认：primary）size：sm、md、lg（默认：md）icon：主题图标名称target：_blank、_self（默认：_blank）rel：链接关系（_blank时自动添加noopener noreferrer）
链接卡片
显示带网站图标的链接卡片：
MARKDOWN
{{< link title="Google" description="The world largest search engine." url="https://google.com" icon="https://google.com/favicon.ico" >}}示例:
Bilibili
嵌入 Bilibili 视频：
MARKDOWN
{{< bilibili BV号 >}}
{{< bilibili AV号 分P号 >}}腾讯视频
MARKDOWN
{{< tencent 视频ID >}}Masonry 图库
创建瀑布流式图片画廊：
MARKDOWN
{{< masonry >}}
{{< /masonry >}}