Uso de google-code-prettify

Para usarlo, hay que incluir el siguiente código al final del blog.

<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>
<style>
ol { list-style-type: decimal-leading-zero }
li.L0, li.L1, li.L2, li.L3, li.L4, li.L5, li.L6, li.L7, li.L8, li.L9 { list-style-type: decimal-leading-zero }
</style>

Después, para mostrar código fuente, basta con ponerlo entre tags <pre>, como en el ejemplo siguiente:

<pre class="prettyprint">
function unaFuncion(args) {
    var ele = document.getElementById('myId');
    ele.innerHTML = "Hola, Mundo!";
}
</pre>

El resultado de este ejemplo es:

function unaFuncion(args) {
    var ele = document.getElementById('myId');
    ele.innerHTML = "Hola, Mundo!";
}

Sólo hay que tener precaución de substituir < por &lt; y > por &gt; para evitar que los tags del código insertado modifiquen el aspecto o el funcionamiento de la página.

Google-code-prettify se encarga por sí solo de averiguar el lenguaje del código insertado para aplicar el estilo conveniente. De todas formas, se puede indicar el lenguaje mediante hints.

Más detalles en la documentación del producto.