1.创建短代码文件（一次性创建即可，以后所有 B站视频 都能用） # 在你的博客根目录下，新建文件 layouts/shortcodes/bilibili.html（如果文件夹不存在就手动创建）：
提醒：本文的MD代码中的 /* 代码 */ 是为了以文本的方式显示出次代码，实际使用时应该删除。
{{- $bvid := .Get "bvid" | default (.Get 0) -}} {{- $page := .Get "page" | default "1" -}} {{- $title := .Get "title" | default "" -}} {{- if not $bvid -}} {{ errorf "bilibili shortcode 需要提供 bvid，例如：{{< bilibili BV1xx411c7mD >}} 或 {{< bilibili bvid=\"BV1xx411c7mD\" page=\"2\" >}}" }} {{- end -}} <figure style="margin:1.5rem 0;"> <div style="position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:8px;"> <iframe style="position:absolute;top:0;left:0;width:100%;height:100%;border:0;" src="https://player.bilibili.com/player.html?bvid={{ $bvid }}&page={{ $page }}&autoplay=0" scrolling="no" frameborder="no" framespacing="0" loading="lazy" allowfullscreen> </iframe> </div> {{- if $title }}<figcaption style="margin-top:.5rem;text-align:center;font-size:.9em;color:#888;">{{ $title }}</figcaption>{{- end }} </figure> 2.调用方式：文章 .md 里写一行调用短代码就行。 # 最简：{{< bilibili BV11Z4y1W77e >}} 效果如下：
这是一篇示例文章，用来测试 GeoGebra 嵌入网页的三种方法。
把这个本地的 “勾股定理.ggb” 嵌入到 Hugo 博客里，有两条完整的可执行方案： 插入网上的GGB文件，和插入本地的的GGB文件。
📦 方案一：最省事→ 上传到 GeoGebra 在线库 + 嵌入（推荐） # 这是最稳定的方式。
1.在线保存你的作品 # 点击「文件」→「在线保存」，用你的 GeoGebra 账号登录并保存 “勾股定理.ggb”，设置为「公开」。
2.获取嵌入代码 # 保存成功后，会跳转到作品的在线页面。点击右上角「分享」→「嵌入」，就能得到标准的 iframe 代码，类似：
<iframe src="https://www.geogebra.org/classic/你的作品ID?embed" width="100%" height="600" frameborder="0" allowfullscreen></iframe> 本例中 `id` 为`wbhb7sdm` 3.嵌入到 Hugo 文章 # 从代码中获得 id ，只需要替换GeoGebra官方网站在线动画文件的 id 即可：
1.创建短代码文件（一次性创建即可，以后所有 GGB 都能用） # 在你的博客根目录下，新建文件 layouts/shortcodes/ggb.html（如果文件夹不存在就手动创建）：
<iframe src="{{ .Get "src" }}" width="100%" height="{{ .Get "height" | default "550" }}" frameborder="0" allowfullscreen sandbox="allow-same-origin allow-scripts allow-popups allow-forms"> </iframe> 2.修改你的 Markdown 文章 # 把原来的 iframe 代码，换成调用短代码的方式：
我们来发布本地的“圆柱展开的GGB”
<!-- 使用默认高度 550 --> {{< ggb src="/ggb/yuanzhuzhankai.html?embed" >}} <!-- 单独设置高度 300 --> {{< ggb src="/ggb/yuanzhuzhankai.html?embed" height="300" >}} 下面是显示效果：
这是一篇示例文章，用来测试数学公式。
行内公式示例：直角三角形满足 \(a^2 + b^2 = c^2\)。 行内公式示例：直角三角形满足 \(a^2 + b^2 = c^2\)。
块级公式示例：
\[c = \sqrt{a^2 + b^2}\] \[c = \sqrt{a^2 + b^2}\]\[c = \sqrt{a^2 + b^2},a^2 + b^2 = c^2\] \[c = \sqrt{a^2 + b^2},a^2 + b^2 = c^2\]\[ \begin{aligned} a^2 + b^2 = c^2,c = \sqrt{a^2 + b^2} \end{aligned} \] \[ \begin{aligned} a^2 + b^2 = c^2,c = \sqrt{a^2 + b^2} \end{aligned} \]也可以写多行公式：
\[ \begin{aligned} a^2 + b^2 = c^2 \\ c = \sqrt{a^2 + b^2} \end{aligned} \] 在公式中直接使用 \\ 即可换行 \[ \begin{aligned} a^2 + b^2 = c^2 \\ c = \sqrt{a^2 + b^2} \end{aligned} \]\[ \begin{aligned} a^2 + b^2 &= c^2 \\ c &= \sqrt{a^2 + b^2} \end{aligned} \] 在公式中直接使用 \\ 即可换行，两个&使得2公式在=处对齐。 \[ \begin{aligned} a^2 + b^2 &= c^2 \\ c &= \sqrt{a^2 + b^2} \end{aligned} \]\[c = \sqrt{a^2 + b^2},\\ a^2 + b^2 = c^2\] 在公式中直接使用 \\ 即可换行 \[c = \sqrt{a^2 + b^2},\\ a^2 + b^2 = c^2\]align：默认自动加行号