教程:网页插入GeoGebra 动画的三种方法

这是一篇示例文章,用来测试 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 即可: {{< geogebra id="wbhb7sdm" width="100%" height="520" >}} 下面是演示效果 直接把这段代码粘贴到你的 Markdown 文章里即可。 这种方式插入不会显示工具栏,无法拖动画布。 优点:稳定省心,GeoGebra 官方托管,不会有跨域和加载问题。 缺点:需要注册 GeoGebra 账号,且作品必须公开。 📦 方案二:本地导出 + 自托管(不依赖 GeoGebra 账号) 如果你不想上传到 GeoGebra 官网,可以直接从当前界面导出并嵌入。 ...

2026年7月19日 · 1 分钟 · Me

教程:网页插入本地GGB动画的方法

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" >}} 下面是显示效果: – 使用默认高度 550 – – 单独设置高度 300 – 3.重启 Hugo 服务 cd /d D:=SYSFLODERS=\Desktop\xucg.github.io hugo server -D –gc ...

2026年7月19日 · 1 分钟 · Me

教程:网页里写公式的方法-以勾股定理为例

这是一篇示例文章,用来测试数学公式。 行内公式示例:直角三角形满足 \(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:默认自动加行号 ...

2026年7月19日 · 1 分钟 · Me