Mientras decido definitivamente cual sera el enfoque que le daré a mi blogger personal si el de documentar mi dia a dia en el mundo de la programación o crea un blog para ese fin y dejar este solo para información personal, iré implementando algunos trucos muy buenos para mejorarlo.
En esta primera entrada explicare como usar la librería de google "Prettify" para colorear la sintaxis de los lenguajes de programación facilitando su rápido entendimiento.
Paso 1:
Lo Primero que debemos hacer es dirigirnos al editor de plantilla de blogger situado en: "Plantillas" -> "Editar HTML"
Paso 2:
Luego Copiamos antes del </head> las siguientes lineas de codigo para inportar los .js directamente de los servidores de google.
<link href="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" language="javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js"></script> <script type="text/javascript" language="javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/lang-css.js"></script>
Paso 3:
En este paso al <body> le insertamos la función onload="prettyPrint() y quedaria de la siguiente manera:
<body onload="prettyPrint()">
En este punto los código que insertemos en nuestro blog serán interpretados y coloreados pero si queremos decidir nosotros de forma manual basta con encerrar el código con:
<code class="prettyprint lang-js">Codigo</code>
o
<pre class="prettyprint lang-js">Codigo</pre>
donde lanh-js es el tipo de lenguaje y los tipos de lenguajes soportados son:
"bsh", "c", "cc", "cpp", "cs", "csh", "cyc", "cv", "htm", "html",
"java", "js", "m", "mxml", "perl", "pl", "pm", "py", "rb", "sh",
"xhtml", "xml", "xsl".
Los Temas es algo también muy interesante porque prettyprint nos permite usar distintos style para visualizar los códigos como por ejemplo Desert que es que implemente en el blog.
La forma de implementarlos también es muy sencillo basta con importar los css:
<link href='http://google-code-prettify.googlecode.com/svn/trunk/styles/desert.css' rel='stylesheet' type='text/css'/>
y en el siguiente link están todos los style.
http://google-code-prettify.googlecode.com/svn/trunk/styles/
![[Guia] Montar un Servidor Tomcat sobre OpenShift Gratis](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGPl3hyphenhyphenWx7IXYR4S3TVhFfxmRq-VJWNrnp2_f2H7OPFwxZpZJ9elJGQ0Yy4E716vWxYPaQXrMPiEC62ciVajIGI-XnWR1xtRTWAiJ3CeGMnAQkm6vsI1J3Bw_drinMtOepGR9laJD9g-8/s72-c/Captura1.PNG)
Entradas
0 comentarios