Publicar Código fuente en Blogger 5
Para los que deseamos compartir información de como personalizar webs es muy importante publicar código fuente donde se resalten con colores la sintaxis para poder entenderlo rápidamente. Veamos como publicar código fuente en Blogger.
SyntaxHighlighter 2.0
SyntaxHighlighter es un script creado por Alex Gorbatchev para resaltar código fuente en páginas HTML hecho completamente en Javascript por lo cual la solución ideal para integrarlo con Blogger.
Instalando SyntaxHighlighter
Normalmente se debe alojar este script en nuestros servidores, pero como Blogger no permite subir archivos .js, utilizaremos la versión hosteada que nos brinda SyntaxHighlighter. Entonces lo primero es incluir la librería en nuestro template, para ello editamos nuestro template y colocamos el siguiente código justo antes de la etiqueta <head>.
<script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="'text/javascript'"></script> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="'text/javascript'"></script> <script type="'text/javascript'"></script>
Donde las dos primeras líneas incluyen las estilos y las dos siguientes los scripts para interpretar el código fuente. En mi caso he incluido la librería shBrushXml.js pues yo deseo publicar solo HTML. Pueden agregar otros lenguajes con solo agregar mas scripts, para una lista detallada de los scripts que puedes incluir pueden leer SyntaxHighlighter/Brushes.
Publicando Código Fuente
Ahora que ya tenemos instalado nuesro script, el siguiente paso es publicar código fuente, para ello debemos colocar el código que deseamos publicar entre los tags <pre> pero además debemos indicar que tipo de código estamos mostrando esto lo hacemos de la forma:
<pre class="brush: xml"> // codigo fuente < /pre>
Nuevamente en mi caso utilizo XML para indicar que deseo publicar HTML. Entonces si por ejemplo deseamos publicar parte de un formulario en html, podriamos hacerlo de la siguiente forma:
<pre class="brush: xml"><form method="post"> Nombre: <input id="nombre" name="nombre" type="text" /> Email: <input id="email" name="email" type="text" /> <input name="btsend" type="submit" value="Enviar" /> </form> < /pre>
NOTA
Hay que tener en cuenta que para evitar errores de HTML al momento de publicar el código fuente debemos cambiar los caracteres < y > por sus equivalentes en HTML:
- < por su equivalente <
- > por su equivalente >
Además de ello pueden ver el ejemplo funcionando en nuestro blog de prueba en Blogger: http://2webfacil.blogspot.com/2009/07/codigo-fuente-en-blogger.html
Tags: blog, Blogger, codigo fuente, HTML, javascript, SEO
from xlwt import *
#Esta funcion crea bordes de tablas en excel
def table(sheet,(row, col),data_lists):
#Escribir lista de datos
for e in xrange(len(data_lists)):
#Primera columna
if e == 0:
for i in xrange(len(data_lists[e])):
#Primera fila
if i == 0 :
first_list=data_lists[e]
borders = Borders()
borders.left = 1
borders.right = 1
borders.top = 1
borders.bottom = 1
estilo_bordes = XFStyle()
estilo_bordes.borders = borders
sheet.write(row +i,col+e,first_list[i],estilo_bordes)
#Ultima fila
elif i == len(data_lists[e])-1:
first_list=data_lists[e]
borders = Borders()
borders.left = 1
borders.right = 1
borders.top = 0
borders.bottom = 1
estilo_bordes = XFStyle()
estilo_bordes.borders = borders
sheet.write(row +i,col+e,first_list[i],estilo_bordes)
#2da a la penultima fila
else:
first_list=data_lists[e]
borders = Borders()
borders.left = 1
borders.right = 1
borders.top = 0
borders.bottom = 0
estilo_bordes = XFStyle()
estilo_bordes.borders = borders
sheet.write(row +i,col+e,first_list[i],estilo_bordes)
#De la 2da a la ultima columna
else:
for i in xrange(len(data_lists[e])):
#Primera fila
if i == 0 :
first_list=data_lists[e]
borders = Borders()
borders.left = 0
borders.right = 1
borders.top = 1
borders.bottom = 1
estilo_bordes = XFStyle()
estilo_bordes.borders = borders
sheet.write(row +i,col+e,first_list[i],estilo_bordes)
#Ultima fila
elif i == len(data_lists[e])-1:
first_list=data_lists[e]
borders = Borders()
borders.left = 0
borders.right = 1
borders.top = 0
borders.bottom = 1
estilo_bordes = XFStyle()
estilo_bordes.borders = borders
sheet.write(row +i,col+e,first_list[i],estilo_bordes)
#2da a la penultima fila
else:
first_list=data_lists[e]
borders = Borders()
borders.left = 0
borders.right = 1
borders.top = 0
borders.bottom = 0
estilo_bordes = XFStyle()
estilo_bordes.borders = borders
sheet.write(row +i,col+e,first_list[i],estilo_bordes)
te falto colocar los css para que salgan los colores etc.
saludos, fires
lo que veo que las etiquetas html no salen.
<link rel="stylesheet" type="text/css" href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css">
<link rel="stylesheet" type="text/css" href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" />
Hola, gracias por la acotación. Efectivamente le hace falta agregar las hojas de estilos que contienen los colores necesarios para pintar el código fuente que ha sido formateado previamente por el javascript.
Creo que lo que estan buscando son resaltadores de codigo
http://www.elwebmaster.com/general/los-mejores-resaltadores-de-sintaxis-de-codigo-para-tu-web
Para los blogs El punto 11 es el que mas mola, diablos!, incluso para desarrollar en modo local o una web, pues te da el archivo CSS y ofrece una gran variedad de diseños, ademas es compatible con varios tipos de sistemas operativos.
Yo lo postearia en mi blog, pero no tendria sentido (quisas en otra ocasion). si quieren visitenlo y vallan a
http://raziel2099.blogspot.com/2009/04/analizadorlexjava.html
Veran un ejemplo.
Aunque para mas seguridad he sustituido los espacios en blanco y tabs por &_n_b_s_p;_ (espacio HTML) jeje… pero el codigo que ofrece es bastante bueno… lo unico que hay que fijarse es que no haya espacios en blanco al final de las lineas del codigo fuente que se va a convertir… el editor de blogger da ese problema, pues le agrega una linea mas al codigo que ofrece el programa (en el caso de que haya espacios en blanco al final).