Embed Jupyter Notebooks with Jovian

If you’re a blogger who takes screen snips from your Jupyter Notebooks to attach to your blog or want to showcase your wonderful notebooks on a website and wondering how to embed one. We have heard your worries and are here with this feature, any notebook on Jovian is embeddable.

We got you covered if you want to embed any of the following.

  • Markdown cell

  • Code cell with output

  • Code cell without output

  • Just the output cell

  • or Whole Notebook

Live Demo

Before seeing how to to embed, have a preview of the embed right here.Below we have embedded a Jupyter notebook in our docs page, using iframe. You can interact with the notebook like copy the source code of a cell, copy a image output, scroll each cells etc.


Open up Embed modal

Commit a notebook or visit a uploaded notebook on Jovian

Click on Embed button

This is ideal if you need embed the whole notebook

Embed Jovian Notebook

OR

Click on Embed icon on any cell

This is ideal when you need to embed a specific cell

Embed jovian notebook cell

Customize options and preview

Go ahead if u need more customization like only output cell and preview the embed below.

Embed notebooks topions and preview

Copy and Embed

Copy iframe code and add it to a website

If you’re building a profile website to showcase your projects or academic institution/community/meetup website making a resources page this is right for you.

Just copy and paste the iframe code in the website’s code, here is a example. Click on the image to visit the a example Github Page where the whole notebook is embedded.

notebook embed website example