Syntax Highlighter

No cabe duda de que uno aprende cosas todos los días.

Resulta que Blogger interpreta el código html, así que para poder poner un ejemplo tuve que investigar cómo darle la vuelta a este problema.

Hay una manera "chafa" que consiste en reemplazar <> por "& gt;" (los separo porque si no me aparecen los simbolitos =P) y poner todo dentro de un bloque <code> </code>

Este primer método lo encontré el 8 de abril, pero me entró el gusanito de encontrar algo mejor; un mes después di con el SyntaxHighlighter. Este hermoso plugin hecho en javascript no sólo me resolvió este problema, sino que también me va a permitir mostrar código (en muchos lenguajes de programación, no sólo html) de una manera muy amigable.

Les debo la explicación de cómo le hice para instalarlo, pero éste es el resultado:

Java:

public class Prueba()
{
System.out.println("A poco no está bonito?");
}

PHP:

  $var = "Hola";
  echo($var);

CSS:

BODY
{
   font-size: 12px;
   color: black;
   font-family: 'Bodoni MT', 'Helvetica';
   background-color: white
}

Para usarlo sólo es necesario poner el código dentro de los tags <pre>, indicando el 'brush' que se está usando (xml, java, php, cpp, css...)

XML, HTML:

   

      Aquí va el código
   

Fuentes:
http://bytes.com/groups/html/153654-how-make-html-ignore-code-part-text
http://alexgorbatchev.com/wiki/SyntaxHighlighter
http://interestingwebs.blogspot.com/2009/02/install-code-syntax-highlighter-on.html