Adding Syntax Highlighter to Squarespace

Syntax Highlighter is a Javascript library for showing formatted code snippets in a webpage. Adding the Syntax Highlighter to a Squarespace blog is simple. Here are the steps:

1. Download the Syntax Highlighter from http://alexgorbatchev.com/SyntaxHighlighter/download/
2. Loging into your Squarespace account.
3. Click on Website Management
4. Select File Storage under Data and Media
5. Click on Upload Files
6. Use the Select File button to select the Syntax Highlighter zip file
7. Check "Decompress Zip Files After Uploading", and Begin Upload
8. Now go back to Website Management and click on Website Settings
9. Click on the Code Injection tab, and add the following code to the HTML code text box.

<!-- Include required JS files -->
<script type="text/javascript" src="/storage/syntaxhighlighter_3083/scripts/shCore.js"></script>
 
<!--
    At least one brush, here we choose JS. You need to include a brush for every 
    language you want to highlight
-->
<script type="text/javascript" src="/storage/syntaxhighlighter_3083/scripts/shBrushJScript.js"></script>
 
<!-- Include *at least* the core style and default theme -->
<link href="/storage/syntaxhighlighter_3083/styles/shCore.css" rel="stylesheet" type="text/css" />
<link href="/storage/syntaxhighlighter_3083/styles/shThemeDefault.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
     SyntaxHighlighter.all()
</script>

And don't forget to tweet your thanks to @syntaxhighlight