Add syntax highlighting to Tumblr
After posting a bunch of code it dawned on me that it should look a bit nicer than it does by default using <pre> tags.
So after a bit of googling this is the solution I came with. It uses portions of http://snippets-of-code.tumblr.com/post/6027484416/adding-syntax-highlighting-into-tumblr and http://tomayko.com/writings/javascript-prettification.
<!-- For Syntax Highlighting -->
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css"></link>
<script src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js"></script>
<script type="text/javascript">
<!--
$(document).ready(function() {
// add prettyprint class to all <pre><code></code></pre> blocks
var prettify = false;
$("pre code").parent().each(function() {
$(this).addClass('prettyprint');
prettify = true;
});
// if code blocks were found, bring in the prettifier ...
if ( prettify ) {
prettyPrint();
}
});
-->
</script>When posting code, use a text editor to change all the angle brackets to < and > and enclose it in <pre><code></code></pre> tags. The <pre></pre> is necessary to keep the formatting.
