Adding custom controls in the notebook toolbar

The CSS and JavaScript of the HTML notebook can be customized through the files in ~/.ipython/profile_default/static/custom, where ~ is your home directory, and default is your IPython profile.

In this recipe, we will use these customization options to add a new button in the notebook toolbar that linearly renumbers all code cells.

How to do it...

  1. First, we are going to inject JavaScript code directly in the notebook. This is useful for testing purposes, or if we don't want the changes to be permanent. The JavaScript code will be loaded with that notebook only. To do this, we can just use the %%javascript cell magic as follows:
    In [1]: %%javascript // This function allows us to add buttons // to the notebook ...

Get IPython Interactive Computing and Visualization Cookbook now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.