syntax-highlighting blogger syntaxhighlighter

syntax highlighting - cómo configurar resaltador de sintaxis en blogger



syntax-highlighting syntaxhighlighter (3)

Checkout http://oneqonea.blogspot.com/2012/04/how-do-i-add-syntax-highlighting-to-my.html

Es un tutorial "SyntaxHighlighter for Blogger" realmente fácil con capturas de pantalla y todo.

Deberías estar en funcionamiento en solo unos minutos.

Además, el tutorial se basa en la "nueva interfaz" a la que se refiere.

Espero que esto ayude. Feliz codificación.

cómo configurar resaltador de sintaxis en la nueva interfaz de blogger. Lo intenté con muchas opciones, pero hasta que no funcionó. Por favor, dar cualquier sugerencia.


Dependiendo de su plantilla, el código JavaScript SyntaxHighlighter puede ejecutarse antes de que el contenido se haya cargado. En ese caso, cambiar el código para ejecutar después de un corto tiempo de espera debería solucionar el problema. Pruebe esto en el <head> de su plantilla HTML:

<script type="text/javascript"> window.setTimeout(function() { SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.all(); }, 10); </script>

Puede agregar personalizaciones adicionales de los valores predeterminados antes de la llamada a ScriptHighlighter.all() .

Si desea personalizar la apariencia de la pantalla del código SyntaxHighlighter, agregue algunos CSS como este:

.syntaxhighlighter code { font-family: Consolas !important; font-size: 10px !important; }

La !important es necesaria para anular las definiciones del tema SyntaxHighlighter.


1. Primero, haz una copia de seguridad de tu plantilla de blogger
2. Después de eso, abra su plantilla de blogger (en el modo Editar HTML) y copie todos los CSS que se dan en este enlace antes de la etiqueta </b:skin>
3. Pegue el código siguiente antes de la etiqueta </head>

<script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js'' type=''text/javascript''></script> <script src=''http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js'' type=''text/javascript''></script>

4. Pegue el siguiente código antes de la etiqueta </body> .

<script language=''javascript''> dp.SyntaxHighlighter.BloggerMode(); dp.SyntaxHighlighter.HighlightAll(''code''); </script>

5. Guarde la plantilla de Blogger.
6. Ahora el resaltado de sintaxis está listo para usar, puede usarlo con la etiqueta <pre></pre> .

<pre name="code"> ...Your html-escaped code goes here... </pre> <pre name="code" class="php"> echo "I like PHP"; </pre>

7. Puedes escapar de tu código here .
8. Here hay una lista del lenguaje admitido para el atributo <class> .