[IPython-User] Change Notebook CSS?

Matthias BUSSONNIER bussonniermatthias@gmail....
Sat Aug 25 03:42:26 CDT 2012


Le 25 août 2012 à 01:43, G B a écrit :

> It doesn't seem to be getting picked up.  I'm running iPython 0.14 on OS X 10.8.1, browsing from Safari.
> 
> Just to make sure I'm not being overly literal in interpreting your response:
> 
> My configuration directory is ~/.ipython
> 
> I've put a file called 'custom.css' into ~/.ipython/profile_default/static/css/
> 
> I also created a directory tree at ~/.ipython/profile/profile_default/static/css/ but that also didn't work.  I believe the tree at ~/.ipython/profile_default/ is the correct one, but I'd like to confirm that.
You are right on this one. 


> 
> In custom.css, I put a simple:
> h3 {font-style:italic;}

I did the same and it works for me 
.ipython/profile_default/static/css/custom.css

> 
> Looking at the page as loaded, the h3 elements do not carry the italic style, and the custom.css style doesn't seem to be included at all.  Do I need to change a configuration parameter somewhere to tell iPython to look for custom.css?
Any file in 
.ipython/profile_default/static/
will overwrite their equivalent if you launch profile_default of course. 
otherwise put the files in the correct profile or make a symlink.

> I've closed the open notebook pages and shut down the notebook server and the relaunched the server, which opens a fresh page.  Do I need to do all that, or just refresh the page to pick up a new custom.css?
From the test I did, you don't have to restart, just reload. 

> I'm pretty much new to everything I'm doing here-- I'm not a seasoned Python developer, I've been using iPython for days, I've only toyed with HTML and CSS in the past...  It's quite likely that I'm doing something wrong at a very basic level.
> Any ideas?  Thanks for the patience...

what does
http://127.0.0.1:8888/static/css/custom.css
give you ? Your file or not ?

Try Safari "web inspector" (Dev menu > web inspector, or Cmd+Alt+i) 
First tab (Element) 
Click Magnifying glass at the bottom and click on a h3 element.
You should be able to inspect its css, where it inherits from on the right now ... etc 
It's a little difficult to explain by mail but by looking at the difference tabs you should be able to determine which file is loaded and why a css is not applied to an element. 

keep us informed. 
-- 
Matthias

> 
> Thanks--
>  Greg
> 
> On Fri, Aug 24, 2012 at 1:14 AM, Matthias BUSSONNIER <bussonniermatthias@gmail.com> wrote:
> 
> Le 24 août 2012 à 01:36, G B a écrit :
> 
> > Is there a way to modify the notebook stylesheet?  I'd like to emphasize the markdown cells and de-emphasize the code cells to make for a more human readable document...  The config file doesn't seem to list a parameter for the stylesheet though.
> Which version are you using ?
> In 0.12-0.13 the easiest is to write CSS in a markdown cell.
> In 0.14 you can overwrite the default css or ad your own on a per profile basis
> by creating a .ipython/profile/profile_xxx/static/css/custom.css  file with the rules you want inside.
> --
> Matthias
> 
> 
> >
> > Thanks!
> >  Greg
> >
> > _______________________________________________
> > IPython-User mailing list
> > IPython-User@scipy.org
> > http://mail.scipy.org/mailman/listinfo/ipython-user
> 
> _______________________________________________
> IPython-User mailing list
> IPython-User@scipy.org
> http://mail.scipy.org/mailman/listinfo/ipython-user
> 
> _______________________________________________
> IPython-User mailing list
> IPython-User@scipy.org
> http://mail.scipy.org/mailman/listinfo/ipython-user



More information about the IPython-User mailing list