viernes, 26 de agosto de 2016

Publicado viernes, 26 de agosto de 2016 por con 0 comentarios

Integrar SyntaxHighlighter en Blogger

Integrar SyntaxHighlighter en Blogger es sencillo, para hacerlo debemos cargar los scripts y el css necesario en el head de la plantilla de nuestro blog.

Paso 1: Editar Plantilla HTML de blogger

Ingresamos al blog a editar y damos click en plantilla.
Una vez ahi damos click en editar HTML

Paso 2: Cargar scripts y CSS
Una vez que se abre el editor de html, buscamos la etiqueta </head> para hacerlo mas rapido podemos usar ctrl+f, una vez encontrada, justo antes de esta etiqueta se deben cargar los scripts y css necesarios para que funcione SyntaxHighlighter, para llamarlos colocamos las siguientes lineas de html
 

    <link href='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shCore.css' rel='stylesheet' type='text/css'/>

    <link href='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>


    <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shCore.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushCpp.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushCSharp.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushCss.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushJava.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushJScript.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushPhp.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushPython.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushSql.js' type='text/javascript'/>

    <script src='https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushXml.js' type='text/javascript'/>


Luego Inicializamos SyntaxHighlighter con las suiguientes lineas de javascript

    <script language='javascript'>

    SyntaxHighlighter.config.bloggerMode = true;

    SyntaxHighlighter.config.clipboardSwf = "http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf";

    SyntaxHighlighter.all();

    </script>

Todo este codigo tiene que ir antes de la etiqueta </head>


      edit

0 Comments:

Publicar un comentario