Monday, August 31, 2009

Code formatting for blogger

This post is very out of date now - I recommend using GitHub and Gists for adding code to blog posts.

... older post below ...
I've been meaning to look into this for a while. I'd like to be able to insert nicely formatted code into posts.

I found the follwing blog post - getting-code-formatting-with-syntax-highlighting-to-work-on-blogger and figured I'd give it a try.

Unfortunately following the instructions in the above post didn't work for me and I had to waste some time on the project site to find out what to do. This post on puffyandmishu was very helpful. I ended up with the following code in my blogger template:

1. In the <head> tag:
<script language='javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js'/>  
<script language='javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js'/>
<script language='javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js'/>  
<script language='javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js'/>
<script language='javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js'/>
<script language='javascript' src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>


2. at the bottom of the <body> tag:
<script language='javascript'>  
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all()  
</script>  


Let's test it out:

C - <pre class="brush:c">


int main(void)
{
    uint8_t i = 0;
    char c = 'a';
    while(1)
    {
        i++;
    }
}

Bash - <pre class="brush:bash">


for i in `ls *.c`;
  do echo $i;
done

Sql - <pre class="brush:sql">


SELECT name FROM mydb.test_table WHERE id IN (1,2,3,4,5);
INSERT INTO mydb.test_table VALUES(1) WHERE name = "test";

Java - <pre class="brush:java">


private static final class MyClass extends YourClass implements Cloneable
{
    public int mMyInt = 145;
    private String mString = "blarg";
    protected double mDouble = 23.45;

    public void main(String[] pArgs) throws Exception
    {
        System.out.println("Hi there");
    }
}

Perl - <pre class="brush:perl">


use warnings;
use strict;

my $i = 10;
for my $j (0 .. $i)
{
    print "This is line $j.  How lovely!\n";
}
warn "this does nothing.";


Line wrapping off <pre class="brush: plain; wrap-lines: false">



This is an example of a long line that shouldn't wrap.  Dwi eisio ddweud rhiwbeth yn Cymraeg ond dwi wedi anghofio popeth.  How long can we make these bars?


Now lets try it with Perl.
perl -F'\t' -lane 'print if $h{$F[0]}++;END{print "$_\t$h{$_}" for keys %h}' averyververververlongfilename.tsv

2 comments:

  1. This works great. But the wrapped lines are not easy to read. Is there a way to have the lines not wrapped, but a horizontal scrollbar to show up instead?

    ReplyDelete
  2. I just added an update to the post (see bottom), I think my blogger template is muting the scroll bars though & it wasn't obvious why. Here's the link from Alex's site with a line wrap example
    http://alexgorbatchev.com/wiki/SyntaxHighlighter:Demo:wrap-lines

    ReplyDelete