ipython notebook toolbar customize

Question

I want to add a new toolbar button on ipython notebook. I got a good link mentioned this.

So I create a new file: ~/.ipython/profile_default/static/custom/custom.js

Answer 1

That doc is out of date. jquery-ui icons are no longer available, instead use one from FontAwesome with IPython >= 1.0. See this file for an example custom.js with IPython 1.x.

Answer 2

If you want to:

1. Display Menu only when open a ipython notebook.
2. Add a Menu to hide/unhide input cells.
3. Disable the in/out prompt each cell.

you can following below steps:

1. Change custom.css to disable the in/out cell prompt

    ~/.ipython/profile_default/static/custom/custom.css

   Add below content:

   .prompt{
       display: None;
   }
   

2. Change custom.js to disable toolbar & header line by default.

    ~/.ipython/profile_default/static/custom/custom.js

   Content as below:

   code_show=true;
   function code_toggle() {
    if (code_show){
        $('div.input').hide();
    } else {
        $('div.input').show();
    }
    code_show = !code_show
   }
   $([IPython.events]).on('app_initialized.NotebookApp', function(){
       $("#view_menu").append("<li id=\"toggle_input\" title=\"Show/Hide Inputs\"><a href=\"javascript:code_toggle()\">Toggle Inputs</a></li>")
       $('div#header').show()
       $('div#maintoolbar').hide()
       $('div#ipython_notebook').hide()
       $('span#save_widget').hide()
       $('span#kernel_logo_widget').hide()
   });
   

3. Restart your notebook server to take effect.