Highlighting Source Code in HTML
I have just finished with configuring the code prettifier on one of my site. It was so easy to implement and took hardly 5 minutes to complete the configuration.
Code Prettifier supports many language syntaxes, like Java, C, C++, PHP, HTML, Bash Scripts etc.
Here are the steps to setup Code Prettifier on your website running wordpress blog.
- Download code prettifier distribution.
- Upload the script and stylesheets in your theme folder (you will need to adjust the paths in the script and link tag)
<link href="prettify.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="prettify.js"></script>
- Add
onload="prettyPrint();"to your document’s body tag. - Put your code snippet in following tags and it will highlight the code automatically.
<pre class="prettyprint">...</pre> or <code class="prettyprint">...</code>
Thats all you have to put in your theme to get this lovely highlighted source code features in your blog.