Publica tu how-to

Dinos como hacer lo que sabes hacer, mándanos un email a wdonet@gmail.com y lo publicamos (dos días máximo) o si te interesa unirte al equipo de redactores, también háznoslo saber por correo.

Configurar SyntaxHighlighter en tu blog

Esta configuración está probada para blogger.com, pero quizá tengas wordpress, drupal,
joomla, o algún otro y no funcione del todo bien, en ese caso es
mejor que consultes el sitio original para una mejor ayuda y soporte
en: http://alexgorbatchev.com/
1. Primero apuntar al core de Syntax Highlighter.
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>

2. Configuración para cada lenguaje (Brushes):
Debes de incluir tantos "brushes" como vayas a necesitar. En este caso Java:
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'/>

mas brushes ... y la lista sigue creciendo
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js'
type='text/javascript'/>

3. Finalmente, activarlo.
<script type='text/javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();
</script>

4. En tus publicaciones debes colocar tu código dentro del tag
Ejemplo: (tambien puedes usar como class: js, bash, shell, java, css, sql, ...)



<pre class="brush:xml; highlight:[3,7,8]">
<xml:mi codigo="aqui"/>
</pre>
El atributo class define el lenguaje y highlight las lineas que quieras sobresaltar en tu código. Notas:
  • Toma en cuenta que al estar apuntando a http://alexgorbatchev.com, si este sitio se cae o no responde, puedes no ver tu código tan bonito como lo quieres.
  • Pero si tienes un sitio personal, puedes descargar los scripts y usarlos sin el conveniente anterior.
  • Usa dentro de tu codigo, preferentemente &gt; y &lt;, en vez de > y <, respectivamente.
Referencias:

No hay comentarios:

Publicar un comentario

Que opinas sobre esta publicación?