Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I set custom CSS for my IPython/IHaskell/Jupyter Notebook?

I would like to apply a few simple changes to the appearance of my IPython/IHaskell/Jupyter Notebooks, such as:

    rendered_html :link {         text-decoration: none;     } 

However, I can't figure out how to do this. I've tried many of the solutions I've found by searching, e.g., placing CSS in:

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

but none have any effect, and I suspect that, given the recent changes to the Notebook architecture, the method for accomplishing this has changed and that the instructions I'm finding are out of date.

How do I set custom CSS for my IPython/IHaskell/Jupyter Notebook?


OS X 10.10.4; Xcode 6.4; CLT: 6.4.0.0.1; Clang: 6.1; Python Python 2.7.10 (Homebrew); IHaskell 0.6.4.1, IPython 3.0.0 (answers for 4.0.0 and Jupiter 4.0 also appreciated, as I will upgrade soon).

like image 908
orome Avatar asked Aug 22 '15 12:08

orome


People also ask

How do you add a CSS to a Jupyter Notebook?

To apply the CSS style to all the notebooks, create the file ~/. jupyter/custom/custom. css and add the styles there.

Can I customize Jupyter Notebook?

Jupyter Notebook themes do not only allow you to change themes but also do some additional customization regarding the fonts being used in the notebook. You can change the fonts when loading a theme with jt command and adding some additional parameters. You can customize…

How do I set environment variables in Jupyter?

To set an env variable in a jupyter notebook, just use a % magic commands, either %env or %set_env , e.g., %env MY_VAR=MY_VALUE or %env MY_VAR MY_VALUE . (Use %env by itself to print out current environmental variables.)


1 Answers

To add custom CSS to a particular notebook you can use HTML. Add and execute a regular Python code cell with the following content:

from IPython.core.display import HTML HTML(""" <style> // add your CSS styling here </style> """) 

Alternatively (thanks @abalter) use the %%html cell magic:

%%html <style> // add your CSS styling here </style> 
like image 137
kynan Avatar answered Sep 17 '22 17:09

kynan