Syntax Highlighting your Blog with highlight.js

I've had some people ask me how I got syntax highlighting for Smalltalk code on my blogger blog. Here's what I did:

1. Download highlight.js

   Go to Software Maniac's download page. Turn off the languages you're not interested in. Check the checkbox for Smalltalk. And hit the download button. You'll get a zip file that when unarchived has a whole directory structure of files, including the customized highlight.js file for your efforts. You need this customized version because it doesn't support Smalltalk in the stock version.



2. Host it somewhere

   Find a net presence to host it at. Hopefully, you've either got your own or know someone who can host it for you. I was fortunate to fall into the second category.



3. Update your blog template

   Edit your blog template (in Edit HTML link under the Design tab of your blog. You add the following lines near the end of your template
   

   
    <script src="http://yourhostedsite/highlight.pack.js" type="text/javascript">
    <script type="'text/javascript'">
      hljs.initHighlightingOnLoad();
    </script>
   

   
   You need to edit the yourhostedsite part appropriately.
   



4. Add additional CSS for your blog

   You need to choose a css style you like from the downloaded package's style directory. Then use Design -> Template Designer -> Advanced -> Add CSS (at the bottom) and paste the contents of your preferred styles .css file into that.
   



5. Enclose code blocks appropriately

   To have the highlighter apply to a chunk of code, you place your code in between pre and code tags. E.g.
   
   <pre><code>
   ...smalltalk code snippets...
   </code></pre>

At least... that's how I remember how I did it. It's been a month or so now. Hope that helps. And would love to hear of errors/corrections in the above.