Geshi por defecto genera código formateado inline lo cual no siempre es lo mejor puesto que se desperdicia un ancho de banda importante tan solo para colorear la sintaxis, por tal razón es muy conveniente utilizar Geshi haciendo uso de hojas de estilo css.

Para lograr dicho objetivo solo hay que hacer 2 pasos muy sencillos.

Lo primero es llamar la instrucción:

$geshi->enable_classes(); 

Con ello ya Geshi inicia a generar código HTML que usa hojas de silo en vez de los estilos inline, solo que con eso nada más el código ya no sale formateado… porque? porque Geshi esta usando css y no tenemos el css. así que lo segundo es obtener la hoja de estilos.

Obtener la hoja de estilos también es muy simple solo se requiere llamar a la instrucción :

$geshi->get_stylesheet(); 

Puntualmente para verla en pantalla en php se debe hacer:

echo $geshi->get_stylesheet(); 

Como obtener la hoja de estilos desde WordPress?

Dado que WordPress no permite insertar el código php es necesario modificar el archivo geshi.php del plugin, justo despues de crear el objeto geshi se coloca el comando de habilitar css:

// Global object. Can alter in template.
$geshi = new GeSHi("", GESHI_DEFAULT_LANGUAGE);
$geshi->enable_classes(); 

Luego, más abajo se debe buscar la función

function geshi_add_code($content) 

Y justo al final adicionar

echo $geshi->get_stylesheet(); 

De este modo al ejecutar la página aparecera el texto del css correspondiente el cual se puede copiar para luego crear el estilo correspondiente. Una vez hecho esto se debe borrar la línea que se inserto en la función y eso es todo.

Juan Carlos Ruiz Pacheco
Ingeniero de Sistemas

No comments

WordPress es una poderosa herramienta de publicación web muy frecuentemente utilizada para hacer Blog como este :P.

Para efectos de inserción de código WordPress permite utilizar la etiqueta <code> con la cual, combinándola con la etiqueta <pre> se pueden obtener resultados como se pueden ver en este ejemplo:

int main()
{
   printf("Hola Mundo"):
   return 0;
}

Sin embargo cuando se busca obtener resultados mas estilizados y profesionales se hace necesario colorear la sintaxis del códigos manualmente y pensar en soluciones de tipo javascript para obtener los números de línea, esto es demasiado trabajo y se invierte mucho tiempo en algo que no es el objeto e la publicación, en ese caso que se debe usar GeSHi para obtener un resultado como este:

int main()
{
   printf("Hola Mundo"):
   return 0;
} 

utilizando solo un par de líneas en php.
Infortunadamente por diferentes razones, seguramente de seguridad, WordPress no permite utilizar php dentro del código HTML de cada articulo publicado… mala suerte.

Sin embargo WordPress permite incorporar plugins fácilmente y afortunadamente ya alguien se tomo el trabajo de hacer un plugin de Geshi para WordPress, dicho plugin se puede descargar en esta página: Click!

Gracias a ese plugin es muy sencillo utilizar Geshi en WordPress y una vez activado basta con utilizar de la manera habitual el tag <code> para obtener resultados; para seleccionar el lenguaje del codigo fuente se puede usar el atributo lang:

<code lang="C">
int main()
{
  printf("Hola Mundo"):
  return 0;
}
</code>

Para habilitar los números línea en el plugin basta con adicionar unas líneas al comienzo del archivo geshi.php (el del plugin), este es un ejemplo de ello, este código (el cual usa esta pagina) lo inserte en le línea 39:

$geshi->enable_line_numbers(GESHI_FANCY_LINE_NUMBERS, 5);
$geshi->set_overall_style('background-color: #ffffff; font-size:small; overflow:auto;');
$geshi->set_line_style('color: #000080;', 'color: #000000; font-weight:bold;');
$geshi->set_code_style('background-color:#ffffff; color: #000000; font-weight:normal; size:inherit'); 

Eso es todo y es muy sencillo, saludos.

Juan Carlos Ruiz Pacheco
Ingeniero de Sistemas

No comments

GeSHi Es un coloreador de sintaxis que puede ser de mucha utilidad cuando se desea incluir código fuente en un página web ya que GeSHi realiza la tediosa tarea del coloreado de sintaxis y lo mejor es que es totalmente parametrizable.

Esta herramienta incluye soporte para gran cantidad de lenguajes y para los que no tiene soporte se les pude adicionar muy facilmente. Por defecto el archivo de configuración de GeSHi para C# no provee un buen coloreado de sintaxis, al menos no para mi gusto, a mi me gusta el coloreado de sintaxis que provee Visual Studio 8.0 por defecto, así que me puse en la tarea de modificar el archivo de configuracion de C#.

Modificando el archivo de configuracion para C#

Lo primero que hay que tener en mente es que lo que quiero es usar la instaxis de VS 8.0 así es que el primer paso es ubicar el archivo de configuración de sintaxis para C#, este se encuentra en geshi/csharp.php este es el listado de modificaciones que se deben realizar :

Cambio1

Original

'COMMENT_SINGLE' => array(1 => '//', 2 => '#'), 

Modificado

'COMMENT_SINGLE' => array(1 => '/// => '//', 2 => '#'), 

Cambio2

Luego en el array de KEYWORDS, es decir despues de la linea 161 hay que agregar esto:

6 => array(
			'Array',
			'Int32',
			'Int16',
			'Int64',
			'UInt32',
			'UInt16',
			'UInt64',
			'String'
			), 

Cambio 3

Mas abajo se hace este cambio, que es uno de los más importantes ya que modifica la mayoria de los estilos de coloreado, el array STYLES se cambia para que quede de esta manera:

'STYLES' => array(
		'KEYWORDS' => array(
			1 => 'color: #0600FF; font-weight: bold;',
			2 => 'color: #FF8000; ',
			3 => 'color:  #0000FF; font-weight: bold;',
			4 => 'color: #0000FF;',
			5 => 'color: #000000; font-weight: bold;',
			6 => 'color: #008080;'
			),
		'COMMENTS' => array(
			1 => 'color: #808080;',
			2 => 'color: #008000; font-style: italic;',
			3 => 'color: #008080;',
			'MULTI' => 'color: #008000; font-style: italic;'
			),
		'ESCAPE_CHAR' => array(
			0 => 'color: #008080; font-weight: bold;'
			),
		'BRACKETS' => array(
			0 => 'color: #000000;'
			),
		'STRINGS' => array(
			0 => 'color: #970000;'
			),
		'NUMBERS' => array(
			0 => 'color: #000000;'
			),
		'METHODS' => array(
			1 => 'color: #000000;',
			2 => 'color: #000000;'
			),
		'SYMBOLS' => array(
			0 => 'color: #008000;'
			),
		'REGEXPS' => array(
		    1 => 'color: #008080;',
			2 => 'color: #000000;'
			),
		'SCRIPT' => array(
			) 

Cambio 4

Un poco mas abajo el array REGEXPS se debe modificar para dejarlo asi:

'REGEXPS' => array(
			1 => array(
			GESHI_SEARCH => '(\s|,)([A-Z][a-zA-Z]+)(.|\s|(\[|\())',
			GESHI_REPLACE => '\\2',                  
			GESHI_MODIFIERS => '',                   
			GESHI_BEFORE => '\\1',                   
			GESHI_AFTER => '\\3'                     
			),
			,	
			2 => array(
			GESHI_SEARCH => '(\$)([a-zA-Z]+)',
			GESHI_REPLACE => '\\2',                  
			GESHI_MODIFIERS => '',                   
			GESHI_BEFORE => '',                   
			GESHI_AFTER => ''                     
			),			
		), 

Esto es habilitar en geshi una nueva expresion regular que le permite identificar los nombres de clase, al menos si se usan teniendo en cuenta que inician en mayuscula.

Listo!!! eso es todo, aca un ejemplo de codigo C# coloreado con geshi

using System;
using System.IO;
using System.Text;
 
namespace FileGrouper
{
    class Program
    {
        static int Main(string[] args)
        {
            if (args.Length > 0)
            {
                if (args[0] == "-help" || args[0] == "-?"
                    || args[0] == "/help" || args[0] == "/?"
                    )
                {
                    WriteHelp();
                    return 1;
                }
                else if (args[0] == "-parf")
                {
                    if (args.Length > 0)
                    {
                        TextReader tr = File.OpenText(args[1]);
                        string[] parameters = tr.ReadToEnd().Split(new char[] { ' ', '\n', '\r' }, StringSplitOptions.RemoveEmptyEntries);
                        JoinFiles(parameters);
                        tr.Close();
                    }
                    return 1;
                }
                else
                {
                    JoinFiles(args);
                    return 1;
                }
            }
            else
            {
                TextReader tr = File.OpenText("params.txt");
                string[] parameters = tr.ReadToEnd().Split(new char[] { ' ', '\n', '\r' }, StringSplitOptions.RemoveEmptyEntries);
                JoinFiles(parameters);
                tr.Close();
                return 1;
            }
        }
 
        /// <summary>
        /// Join a group files in a single file, use the first 
        /// argument for the out and the other ones to the in
        /// </summary>
        /// <param name="args">File Parameters</param>
        private static void JoinFiles(string[] args)
        {
            if (args.Length > 0)
            {
                Stream sr;
                BinaryReader br;
 
                Stream sw = File.Open(args[0], FileMode.Create);
                BinaryWriter bw = new BinaryWriter(sw);
 
                //4bytes
                bw.Write(args.Length - 1);
 
                for (int i = 1; i < args.Length; i++)
                {
                    sr = File.OpenRead(args[i]);
                    br = new BinaryReader(sr);
 
                    //8 bytes- length
                    bw.Write(br.BaseStream.Length+8);
                    //File bytes
                    bw.Write(br.ReadBytes((int)br.BaseStream.Length));
 
                    br.Close();
                }
                bw.Close();
            }
        }
 
        private static void WriteHelp()
        {
            Console.WriteLine(" A Y U D A ");
            Console.WriteLine(" - - - - - ");
            Console.WriteLine("Uso 1: BitmapGrouper archdest [archOri...]");
            Console.WriteLine("archdest Nombre de archivo de destino");
            Console.WriteLine("[archOri...] Nombre de los archivos de origen de 1 a n");
            Console.WriteLine("Ejemplo:");
            Console.WriteLine("BitmapGrouper miBmpGrouper.bm1 image1.bmp image2.bmp image3.bmp");
 
            Console.WriteLine("Uso 2: BitmapGrouper -parf");
            Console.WriteLine("Lee los parametros desde el archivo indicado");
            Console.WriteLine("Ejemplo:");
            Console.WriteLine("BitmapGrouper -parf imageparams.txt");
        }
    }
} 

Que tal ha?? buenisimo!! NO??? :’(
Ok, lo reconozco no soy un genio del html ni del php, no se si ya lo notaron pero hay un problema con los metodos…
Si el metodo no se llama utilizando el objeto padre y el método comienza con mayúscula entonces el metodo se resalta como si fuera una clase, de igual forma en la declaración del método si este comienza con mayúscula se resalta como si fuera una clase, desde luego hay una solución, no muy elegante que digamos, pero funciona, y es que al nombre del metodo se le anteponga el signo $… lo se, es una solución poco elegante pero es de utilidad, desde luego al aplicar el coloreado de sintaxis el signo $ desaparece, no se muestra.

He aquí un ejemplo

el método se llama JoinFiles primero con su uso normal y luego anteponiendole el signo $, como se puede ver el signo $ nunca aparece.

//sin usar el signo $
JoinFiles();
//Usando el sigo $
JoinFiles(); 

//Si usar el signo $
        ///<summary>
        /// Join a group files in a single file, use the first 
        /// argument for the out and the other ones to the in</summary>
        /// <param name="args">File Parameters</param>
        private static void JoinFiles(string[] args)
        {
            if (args.Length > 0)
            {
                Stream sr;
                BinaryReader br;
 
                Stream sw = File.Open(args[0], FileMode.Create);
                BinaryWriter bw = new BinaryWriter(sw);
 
                //4bytes
                bw.Write(args.Length - 1);
 
                for (int i = 1; i < args.Length; i++)
                {
                    sr = File.OpenRead(args[i]);
                    br = new BinaryReader(sr);
 
                    //8 bytes- length
                    bw.Write(br.BaseStream.Length+8);
                    //File bytes
                    bw.Write(br.ReadBytes((int)br.BaseStream.Length));
 
                    br.Close();
                }
                bw.Close();
            }
        }
        
		//Usando el signo $
        /// <summary>
        /// Join a group files in a single file, use the first 
        /// argument for the out and the other ones to the in
        /// <param name="args">File Parameters</param>
        private static void JoinFiles(string[] args)
        {
            if (args.Length > 0)
            {
                Stream sr;
                BinaryReader br;
 
                Stream sw = File.Open(args[0], FileMode.Create);
                BinaryWriter bw = new BinaryWriter(sw);
 
                //4bytes
                bw.Write(args.Length - 1);
 
                for (int i = 1; i < args.Length; i++)
                {
                    sr = File.OpenRead(args[i]);
                    br = new BinaryReader(sr);
 
                    //8 bytes- length
                    bw.Write(br.BaseStream.Length+8);
                    //File bytes
                    bw.Write(br.ReadBytes((int)br.BaseStream.Length));
 
                    br.Close();
                }
                bw.Close();
            }
        } 

Anteponer el signo $ a cualquier palabra deshabilitara el coloreado de sintaxis en dicha palabra.

Ahora si eso fue todo hasta luego, espero que les sea de utilidad.

Download : Archivo de configuracion GeSHi para C# (sintaxis estilo Visual Studio 8.0)

Juan Carlos Ruiz Pacheco
Ingeniero de Sistemas

No comments