$\hbar = c = 1$ : html

Jan 16, 2013

How to display source codes in Blogger

0. Post your codes directly in RTF editor!

for example:

<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/c/ca/Westerner_on_a_camel.jpg/450px-Westerner_on_a_camel.jpg/" />

1. Use <textarea> tag in html editor

for example,

<textarea cols="60" rows="6">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/c/ca/Westerner_on_a_camel.jpg/450px-Westerner_on_a_camel.jpg/" />
</textarea>

will produces,

2. Use advanced source code brushes/JavaScript syntax highlignters

There are several brushes available. I use SyntaxHighlighter here. To use SyntaxHighligher for example, go to layerout -> add a Gadget -> HTML/JavaScript. Post the following lines and save.

Use SyntaxHighlighter as following

<pre class="brush:language" >

some source code ...

</pre >

Available language depends on the installed script above normally including cpp, html, plain, text, csharp, java, jscript, python, ruby etc.

For a comprehensive list of supported languages with public domain JavaScripts, see this post by ABEL BRAAKSMA.

The syntax highlight effect of these js codes themselves is,

<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'/>

<script language='javascript'>

SyntaxHighlighter.config.bloggerMode = true;

SyntaxHighlighter.config.clipboardSwf = 'http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf';

SyntaxHighlighter.all();

</script>

A piece of C code,

#include <stdio.h>
/* hello world in C */

int main(int argc, char* argv[]){
     
     printf("Hello, world!\n");
     return 0;
}

C#:

// Hello World in Microsoft C# ("C-Sharp").

using System;

class HelloWorld
{
    public static int Main(String[] args)
    {
        Console.WriteLine("Hello, World!");
        return 0;
    }
}

Mathematica code,

Print["Hello, world!"];