Menu
CoddyTech

可嵌入编辑器

可嵌入代码编辑器

适用于任何网站的在线代码编辑器:一段 iframe,无需配置。

把一个真正能运行的代码编辑器放进你的博客、文档或教程。读者可以直接在你的页面上写代码、看输出,由 Coddy 提供支持。在下方选择语言和主题,粘贴初始代码,然后复制 iframe 即可。

从 Trinket 过来的?看看 Coddy 能替代什么

主题
布局
实时预览直接在下方编辑器中输入初始代码和输入内容。
由 Coddy 提供支持
复制这段 iframe
<figure style="margin:0;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden"><iframe src="https://coddy.tech/embed-editor?lang=luau&theme=light&code=bG9jYWwgbmFtZTogc3RyaW5nID0gaW8ucmVhZCgpCmxvY2FsIGFnZTogbnVtYmVyID0gaW8ucmVhZCgiKm4iKQpwcmludChgSGVsbG8sIHtuYW1lfSEgWW91IGFyZSB7YWdlfSB5ZWFycyBvbGQuYCkK&stdin=QWxpY2UKMzAK&credit=0" width="100%" height="480" style="display:block;border:0;width:100%" title="Coddy 提供的 Luau 代码编辑器" loading="lazy"></iframe><figcaption style="box-sizing:border-box;padding:5px 12px;font:11px/1.4 system-ui,-apple-system,sans-serif;color:#64748b;background:#f1f5f9;border-top:1px solid #e2e8f0;text-align:right" dir="ltr">由 <a href="https://coddy.tech/embed" target="_blank" rel="noopener" style="color:#0077ff;font-weight:600;text-decoration:none;">Coddy</a> 提供支持</figcaption></figure>

可在任何网站免费使用。请保留“Powered by Coddy”链接,让其他人也能找到这个编辑器。我们只有这一个要求。

看看运行效果

真实的嵌入效果,和在你页面上显示的一模一样。在任意一个中点击运行试试。

由 Coddy 提供支持

为什么嵌入 Coddy 编辑器

运行真实代码

读者可以修改代码并点击“运行”。Python 直接在浏览器中运行,自带实时控制台,支持 input() 和 turtle 绘图;其他语言在 Coddy 的沙箱运行环境中执行,支持输出、stdin 和命令行参数。

15 种以上语言

Python、JavaScript、TypeScript、Java、C、C++、C#、Go、Ruby、Rust、PHP、SQL 等,还支持带实时预览的 HTML 和 CSS,以及用 matplotlib 绘制的 Python 图表。一个编辑器,一种嵌入方式。

浅色和深色主题

用 theme 参数匹配你网站的风格,或者设为 auto,让编辑器跟随每位访客的系统设置。

无需配置

不需要账号,不需要 API 密钥,也不需要安装任何 JavaScript。复制一个 iframe 标签,任何能显示 HTML 的地方都能用。

使用方法

1. 设置

选择语言、主题和布局,再粘贴读者打开编辑器时看到的初始代码。

2. 复制 iframe

生成器会生成一个 <iframe> 标签,你的设置都编码在 URL 中。把它复制下来。

3. 粘贴到页面

把 iframe 放进你的 HTML、Markdown、CMS 或文档页面。编辑器会立即显示,随时可以运行。

自定义参数

嵌入编辑器完全通过 iframe URL 的查询字符串来配置。上面的生成器会帮你设置好这些参数,你也可以手动修改。

参数取值说明
langpython, javascript, java, sql, html, matplotlib, cpp, ...编辑器运行的语言。默认为 python。
themelight, dark, auto颜色主题。auto 会跟随访客的系统设置。默认为 auto。
codebase64 string编辑器加载时显示的初始代码,使用 URL 安全的 base64 编码。
layoutside, stacked编辑器和输出左右并排,或上下堆叠。默认为 side。
stdinbase64 string可选,点击运行时传给程序的标准输入。Python 会改为实时向读者询问输入,只有在服务器上运行时才使用这个参数。

常见问题

可嵌入代码编辑器免费吗?

免费。可嵌入编辑器在任何网站上都可以完全免费使用。每个嵌入的编辑器都带有一个小小的“Powered by Coddy”链接,请保留它,让更多人发现这个编辑器。这是我们唯一的要求。

读者运行代码需要 Coddy 账号吗?

不需要。任何人都可以在嵌入的编辑器中修改和运行代码,无需登录。Python 在读者的浏览器中运行;其他语言在 Coddy 的沙箱运行环境中执行。

支持哪些编程语言?

Python、JavaScript、TypeScript、Java、C、C++、C#、Go、Ruby、Rust、PHP、SQL、R 等,还支持带实时预览的 HTML 和 CSS,以及用 matplotlib 绘制的 Python 图表。每个嵌入编辑器使用一种语言。

编辑器能匹配我网站的主题吗?

可以。把 theme 参数设为 light 或 dark 来固定主题,或者设为 auto,跟随每位访客的系统设置。

嵌入的编辑器在任何网站上都能用吗?

能。它是标准的 iframe,所以可以用在纯 HTML、Markdown、大多数 CMS(WordPress、Ghost、Notion 等)以及允许 iframe 的文档工具中。