Archive

Archive for the ‘css’ Category

Beautify your code with pygments

July 1, 2009 1 comment

Ever wonder how I colour-coded my code blocks with colours? CSS? That’s almost right. WordPress does not support css customisation for standard accounts, but you can get around with this limitation by using inline css. Here’s a good post talking about this technique: http://www.scratch99.com/2007/06/wordpress-simple-css-text-boxes-in-posts/

Inspired by that post, here’s how I do to make my snippets colourful:
1. Download Pygments from http://pypi.python.org/pypi/Pygments [ the .tar.gz file. The pygments site seems to be down at this moment ]
2. Untar it and install it as root

tar xzf Pygments-1.0.tar.gz
cd Pygments-1.0
sudo python setup.py install

3. After the installation you are ready to style your code. Some examples:

pygmentize -f html -O noclasses myscript.sh
  outputs css-lized html to the screen
pygmentize -f html -O noclasses -l bash myscript
  outputs css-lized html to the screen, option -l bash is used to specify which lexer to use
pygmentize -f html -O noclasses -o myprog.html pyprog.py
  outputs css-lized html to file myprog.html

4. Copy and paste the html code from above step into the code block in your post. Preview it if needed. Then publish.

Categories: css, html, Tip