Well to anyone who knows me knows that I have written quite a few blog engines and spooled up a number of my “own blogs” which after a period of time I get annoyed with and take down.  

I won’t make any lofty promises that this won’t be any different HOWEVER we shall give it a spin.  First and foremost.. Google Prettify, lets kick the tires and see how well this works.  I’m not going to say this will all be about code but a LARGE chunk of it will be.  Just like my life, a significant portion of my day is spent on a keyboard for both work and fun.

Another thing I will give props to Tumblr for is giving us the capability of re-pointing a domain at their servers or even a sub-domain without using domain masking.  Pretty neat feature.  I have also heard that this RTE isn’t entirely pointless for search targeting so I guess we shall see on that front as well.

So lets get this first post out of the way and onto bigger and better things.  I might do a few short ones on intro tips and tricks with JavaScript and JQuery to get things rolling.  I did open up the “You’ll get trolled” anonymous posts, so if you want a topic feel free to hit me up!  If you tell me who you are I’ll even publicly thank you for the request! 

So lets get started right and put some code in this post.

Prettify Your Code on Tumblr

1) Go to Customize Your Layout

2) Click the teeny tiny “edit html” link

3) Smile because their layout editor actually doesn’t suck

4) Put the code below into your blog and follow the instructions in comments

NOTE:  Remember to update the paths to the prettify.css and prettify.js files to the static file links for your tumblr account.  After enough of us put this in our blog they’ll likely add hard paths for us to use but until then… Modify the URL’s!!! 

 
<!-- We can't do anything without JQuery right? -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>


<!-- Download the following from http://code.google.com/p/google-code-prettify/ -->
<script src="prettify.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="prettify.css" />
<script type="text/javascript">
     $(function(){ 
          //The below line makes the magic happen
          prettyPrint();
     });
</script>

Now the crappy part is after you make these changes through the very nice and robust layout editor when you go to make your first “syntax pretty” post you have to go into HTML mode.  Unlike their awesome layout editor that allows tabbing and has rudimentary syntax highlighting their HTML editor for a blog post does not.  Suffer through it as will I.. and shortly I’ll build a plug-in for their RTE if one isn’t already out there.

To post an entry with pretty print capabilities you can use a <code class=”prettyprint”>…</code> or <pre class=”prettyprint”>…</pre> tag.  

Also remember all instances of < you have to manually turn into &lt; and all instances of > you have to manually turn into &gt; or it’ll just post as straight HTML and you won’t see any of your code in the post!  Oh No!  

Ok this post is complete I think and it’s time to move onto other things for the night!  Until next time!