Skip to content
Tech News
← Back to articles

Show HN: Embed a real Linux terminal on your website

read original more articles
Why This Matters

Embedding a real Linux terminal directly into websites or blogs enhances interactivity and educational value, allowing users to run commands in a safe, sandboxed environment. This innovation bridges the gap between static content and hands-on experience, benefiting developers, educators, and tech enthusiasts alike.

Key Takeaways

Embed sandbox.bio

Add a live terminal to your website or blog post

You can embed a sandbox.bio terminal directly on your website or blog post. Simply add this script tag to your page:

<script src="https://sandbox.bio/embed.js" data-cwd="embed"></script>

If you use GitHub Pages, any Markdown code blocks you mark as ```bash will have a "Run" button that executes directly in the embedded terminal. For HTML websites, any <div> with the class "language-bash" will get a "Run" button.

You can also customize the embedded terminal by adding attributes to the script tag:

data-cwd="folder-name" : the starting working directory in the terminal

: the starting working directory in the terminal data-config="https://yourwebsite.com/config.json" : an optional remote config URL, using the same format as the sandboxbio.config.json file used by the GitHub integration. This file can be hosted on GitHub Pages too.

If you need to preload files in the terminal, you can use the array files inside your config, and specify the URLs to where each file lives: