We support two type of embeds:

  1. Runnable code snippets
  2. The programming environment

Embedding runnable code snippets

You can think of this like a runnable Github Gists. Here is a live example:

And the code for this: <script src="//repl.it/embed/iAo.js"></script>. You can get a code snippet like this for any saved session by going through the following steps:

  1. Write some code in your favorite language
  2. Save
  3. Share
  4. Copy the embed code
  5. Insert it on your site or blog

Here is a gif for the entire thing:

embed repl.it

The programming environment

You can embed any portion of the site in an iframe. This is good if you want to integrate Repl.it into your app. If your app supports OEmbed -- we already implement the standard so simply copy and paste any Repl.it url and it should work.

Otherwise, just copy the url and add the following query param lite=true this modifies the UI to remove the footer, make the header smaller, removes other non-essential UI elements, and in some cases modifies the layout to make it fit in small frames.

Here is an example:

And the code for this:

<iframe frameborder="0" width="100%" height="500px" src="https://repl.it/Dn6S?lite=true"></iframe>

Note that you can embed most parts of the site including Repl.it Classroom (however, note that students need to login to repl.it to see their classroom).

Embedding Classroom

To embed your classroom:

  1. From your teacher dashboard, click the "three dot" menu on the classroom you want to embed.
  2. Select "Embed".
  3. If you want to embed in your LMS then copy the LTI information and follow the instructions provided to you by your LMS, otherwise copy the iframe code.

To embed an assignment:

  1. From the assignment list in your classroom, click the "three dot" menu on the assignment you want to embed.
  2. Select "Embed".
  3. If you want to embed in your LMS then copy the LTI information and follow the instructions provided to you by your LMS, otherwise copy the iframe code.
  4. When students see the iframe they'll automatically be loaded with the coding environment to work on their assignment.

embedding an assignment

If you're using LTI then we'll automatically create your student accounts for you. If you're using an iframe then the student will be redirected to the signup page to sign up and be enrolled in your classroom.

Let us know if you hit any bugs with this: contact@repl.it.