jueves, abril 16, 2009

Cómo añadir javascript en Blogger

Ya me he referido antes al método para insertar Javascript en un artículo de Blogger.

Sin embargo, en ocasiones es preferible alojar el código Javascript en otro lugar, de forma que pueda ser utilizado en diferentes artículos sin necesidad de repetir el código en cada uno de ellos.

La alternativa obvia, utilizar un servidor externo para cargar nuestros Javascript como archivos con terminación *.js, no es recomendable debido a que estos servidores son poco fiables y son filtrados con frecuencia por los administradores de red.

Dado que la extensión js no es obligatoria, puede sustituirse por la extensión *.txt y emplazar el archivo en cualquier servico de hospedaje de archivos, utilizar la API de librerías AJAX de Google, o colocar el código en la plantilla del blog, tal como se explica aquí. Ninguna de estas alternativas, sin embargo, está exenta de problemas.

Hoy os mostraré la mejor opción para colocar Javascript directamente en Blogger y acceder a él desde cualquier entrada.

En nuestra plantilla, creamos una nueva sección 'Añadir un gadget' copiando el siguiente código después de <body>:

<b:section class='scripts-container' id='scripts-container' />
Una vez hecho esto, en nuestro escritorio, en la página 'Añadir y organizar elementos de la página’ veremos la nueva sección. Hacemos clic en ella y seleccionamos 'HTML/Javascript'. Obtenemos la típica caja de edición donde podemos copiar nuestro código:
<script type='text/javascript'>CONTENIDO_DEL_JAVASCRIPT<script>
No pongamos título. Pero si vamos tener varios guiones Javascript en varias entradas, deberemos hacerlo añadiendo primero esta línea:
.scripts-container .widget h2 {display: none; visibility: hidden;}
Finalmente, hay que tener en cuenta que Blogger interpreta todos los signos de comparación “<” and “>” que aparecen dentro de los guiones de forma diferente a lo esperado.

Para evitarlo, podéis añadir un espacio antes y despúés del signo.