Skip to main content

Embedding repls

In this guide, we'll show you how to embed a repl on another platform using an <iframe>. We'll provide you with a set of query parameters you can use to render different previews of the same repl, and give you information on editing an embedded repl.

Repls support the oEmbed standard, so you can embed a repl on any platform that supports this standard by pasting your repl URL formatted as https://replit.com/@username/repl-name, and a preview will be rendered.

Oembed demo

Embedding a repl using <iframe>​

You can embed a repl using <iframe> with this code snippet:

<iframe frameborder="0" width="100%" height="500px" src="REPL_URL?QUERY_PARAMETERS"></iframe>

Replace REPL_URL with the URL of the repl you want to embed. You can use QUERY_PARAMETERS to specify how the repl will be rendered.

Replit supports two query parameters on custom <iframe> tags: ?embed=true and ?lite=true.

Query parameter ?embed=true​

The query parameter ?embed=true produces a preview of the repl that is optimised for embeds with a minimal number of control buttons displayed for a less cluttered view:

<iframe frameborder="0" width="100%" height="500px" src="https://replit.com/@ritza/demo-embed?embed=true"></iframe>

Spotlight view

Query parameter ?lite=true​

The query parameter ?lite=true produces a full preview of a repl in an embed, with all the control buttons and panes displayed:

<iframe frameborder="0" width="100%" height="500px" src="https://replit.com/@ritza/demo-embed?lite=true"></iframe>

Editor view

Embedding on WordPress​

WordPress does support oEmbed, but will only embed content from an approved whitelist of websites. Check out the WordPress documentation for instructions on adding Replit to the whitelist. Once Replit is added, a repl URL formatted as https://replit.com/@username/repl-name will automatically embed an interactive copy of the repl in your WordPress site.

Embedding on Medium​

To embed your repl on Medium, paste the repl link https://replit.com/@username/repl-name into your Medium post and hit "Enter".

Embedding on medium

Embedding on Ghost​

To embed your repl on Ghost, paste the repl link https://replit.com/@username/repl-name into your Ghost post. The link will automatically be converted to an interactive IDE, where you can edit and run code.

Ghost demo