How to customize frontend of TLJH?

JupyterHub The Littlest JupyterHub
,
1

Hi. I’m making a python tutorial for kids and I would like to customize jupyter notebook to maximize their programing experience. Are below features supported (or expected)?

  • Replace a “JupyterHub” logo at the top left of a screen with a custom one.
  • Remove all menu (File, Edit, and all icon menus).
  • Make a cell read-only (e.g. a markdown cell showing “Let’s type 1 + 2 in the below cell!”).
  • Embed a plain notebook as a play ground where a student can play and learn.
  • Change a font.

I’ve just installed TLJH on AWS and couldn’t find a solution in the doc. I know some companies (e.g. Google Colab) have done the similar things, but I am not sure if they forked the repo and implemented by themselves.

Thank you all for continuous support and contribution!

2

This requires a couple of different solutions, however I’ve done something similar.

  • To replace the logo and other UI elements, you’ll have to modify the template files and provide a path to your custom templates using a custom configuration snippet in TLJH. Templates use Jinja, which is basically HTML with some dynamic elements.

  • I assume you’re referring to the menus within Jupyter Lab or Notebook. To modify these, you’ll have to modify the Lab or Notebook configuration. This is trickier and I don’t have an exact answer.

  • To make a cell readonly, you can set

"trusted": true,
"deletable": false,
"editable": false,

in the cell metadata. Then, you’ll have to set showEditorForReadOnlyMarkdown: false in the Advanced Settings. Unfortunately, I don’t know how to set Advanced Settings options for all users. I’m currently trying to figure this out as well.

  • If by “embed a plain notebook” you mean providing a default notebook, this can be done with nbgitpuller.

  • You can change the font for the web pages by editing the template and providing custom CSS files. Not totally sure how to change the font for Jupyter Lab/Notebook.

Finally, if you are primarily trying to create a simple interactive tutorial, Jupyter Book may be a better option. It lets you easily create and deploy notebooks, which can even be executable.

1 Like