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.

Responder a Alejandro Santiago Cancelar la 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.