Embed personal video player inside Markdown cell

Hi!

I have an NginX server which serves as a reverse proxy for a Django website and a JupyterHub (TLJH).

I am trying to embed inside a Jupyter Notebook’s Markdown cell a video player which I programmed and is accessible from a URL on the Django website (e.g., https://the-website.com/videoplayer/embed/the-video).

However, iframes cannot be displayed on notebooks anymore. But I need the integration to be inside a Markdown cell as I do not want the user of the Notebook to have to run code cells to display the video.

Is there a way to allow iframes to display for a specific given URL, such as a JupyterHub configuration?
Or can I use some other tag, feature, or simple workaround to enable me to do the embedding?

my solution to putting iframes in a notebook is to use the %%html magic. i wrote a notebook yesterday that demonstrates this approach to iframes with youtube videos and clips.

1 Like

Hi! Thank you for your answer.

However, the result given by this workaround is not what I am looking for.

As I specified in my initial post, I do not want the user of the Notebook to have to run code cells to display the video. That is why I do not want to use code cells, but that I am asking for a Markdown cell integration.

you can put html video tag in to a markdown cell.

Hi! Thank you for your answer, but it doesn’t seem like you entirely understood my request.

I need to embed a customised video player into the Notebook.
Not to directly display the video itself.

so far two folks have misunderstood this question. is there a way to rephrase the original post or provide some follow up information in a response? it would help to know what hasn’t worked and why that doesn’t meet your user’s needs. we’ll be more likely to help you if we can focus on what your user’s need.

2 Likes

Hi!

I am currently working on integrating a Django-based website with JupyterHub (TLJH + repo2docker), where I’ve encountered a specific challenge. My objective is to embed a custom video player, hosted on the Django website, directly within a Markdown cell of a Jupyter Notebook. This video player is accessible via a specific URL (e.g., https://the-website.com/videoplayer/embed/the-video).

In the past, iframes inside Markdown cells could have offered a solution, but they are no longer displayable in notebooks. Importantly, the integration needs to be user-friendly, specifically requiring that the video player be visible without apparent code. This is to ensure that the Notebook users - which are not computer engineers - do not need to execute any code cells to view the video, providing a seamless experience.

Given these constraints, I’m seeking guidance on:

  • Any JupyterHub configurations that might allow iframes from specified URLs inside Markdown cells.

  • Alternative methods, tags, JupyterLab plugins, or features that could enable embedding of my custom video player within a Markdown cell, or without the need to actively run a code cell, and without visible code cells. Simply put, just how iframes inside a Markdown cell would have normally worked.

I appreciate detailed responses that take into account the need for a user-friendly solution that avoids the necessity of running code cells by the end-user. My aim is to integrate this feature seamlessly into the educational material without adding extra steps for the users.

IPython’s IFrame and magic tags such as %%html require code cells which are visible, and also need to be actively run by the user. Thus, these workarounds do not suit my specified constraints.

Thank you for taking the time to understand my query, and I look forward to your suggestions.

In the meantime, I have decided to work on a JupyterLab plugin to allow iframes from identified URLs inside Markdown cells. Although I do not have any experience in creating JupyterLab plugins.