SyntaxHighlighter: una librería javascript para colorear / resaltar código fuente

SyntaxHighlighter es una librería javascript desarrollada y mantenida por Alex Gorbatchev y colaboradores alrededor del mundo, distribuida bajo licencia GPL. Esta librería permite colorear / resaltar el código fuente de una gran variedad de lenguages de programación, entre ellos: C, C++, Java, PHP, PERL, Python, javascript, SQL, Ruby, XML, HTML, CSS, Otros.

Esta librería es usada por varios sitios web, uno de los más conocidos es wordpress.com

Para usar esta librería en su proyecto

Incluya los css
<link href="http://alexgorbatchev.com/pub/sh/2.1.364/styles/shCore.css" rel="stylesheet" type="text/css" />
<link href="http://alexgorbatchev.com/pub/sh/2.1.364/styles/shThemeDefault.css" rel="stylesheet" type="text/css" />
Incluya el núcleo (core) de la librería
<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shCore.js"></script>
Incluya el componente que permite resaltar el luenguaje que usted desea por ejemplo PHP
<script type="text/javascript" src="http://alexgorbatchev.com/pub/sh/2.1.364/scripts/shBrushPhp.js"></script>
Incluya además
<script type="text/javascript">
// Descomente si desea usar la librería en blogger
//SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.clipboardSwf = "http://alexgorbatchev.com/pub/sh/2.1.364/scripts/clipboard.swf";
SyntaxHighlighter.all();
</script>
Para resaltar nuestro script PHP, tecleamos
<script type="syntaxhighlighter" class="brush: php">
            $colors = array('red', 'blue', 'green');
            foreach ($colors as $color) {
                echo $color;
            }
</script>

O

<pre class="brush: php">
            $colors = array('red', 'blue', 'green');
            foreach ($colors as $color) {
                echo $color;
            }
</pre>
Entonces se vería así
    $colors = array('red', 'blue', 'green');
    foreach ($colors as $color) {
        echo $color;
    }

Lectura recomendada

Sitio oficial del proyecto SyntaxHighlighter

Los tutoriales aquí en LibreByte están disponible bajo una licencia de software libre. Si le gusta mi trabajo considere:
Comprar un Hosting/VPS o Servidor Dedicado en MCKHost

1 comentario

  1. Excelente información, gracias.

Deja una respuesta

Tu dirección de correo electrónico no será publicada.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.