Una antigua demanda de los usuarios de Blogger es poder alojar en este mismo servicio nuestros scripts, así como otro tipo de ficheros ahora mismo vedados. Como esto ya colea tiempo y puede que aún quede un buen trecho para que se resuelva de manera óptima, a continuación veremos distintas alternativas para poder utilizar ficheros javascript en los blogs de esta plataforma.1. SCRIPT DIRECTAMENTE EN LA PLANTILLA
Una primera opción es agregar el código del script que queremos utilizar, directamente en la plantilla.
Muchas veces nos facilitan una línea de codigo como la siguiente, que lo que hace es llamar al script desde su ubicación original. Es la forma más fácil de usarlo, pero la menos conveniente en cuanto que dependemos de que el fichero del script, se mantenga indefinidamente accesible y eso no depende más que del propietario. Para alojarlo nosotros mismos necesitamos abrir el fichero .js original y copiar su contenido. La dirección será lo que en la línea de abajo se ha marcado en verde:
<script src='URL_SCRIPT' type='text/javascript'></script>
Poniéndola en nuestro navegador, tendremos acceso a un fichero de texto que podremos copiar en el portapapeles y luego pegar en el lugar que a continuación se indica. La línea de código antes reproducida es una "llamada" al script que será innecesaria si usamos este sistema. Se podrá borrar después de copiar el código en nuestra plantilla. Justo antes de </head>...
<script type='text/javascript'>
//<![CDATA[
CONTENIDO DEL FICHERO .JS ORIGINAL
//]]>
</script>
//<![CDATA[
CONTENIDO DEL FICHERO .JS ORIGINAL
//]]>
</script>
Los caracteres que rodearán al contenido sirven para que el código "estricto" de Blogger, admita el script tal cual viene redactado.
Para añadir otro script adicional, repetir todos los pasos.
2. SCRIPT EN UN GADGET
Esta otra opción es útil cuando es script es demasiado largo, cuando queremos utilizar varios, o simplemente cuando no queremos utilizar la opción de la plantilla. Con el mismo sistema de antes, copiamos el código del fichero .js original. Ahora desde la edición de plantilla, justo después de <body> creamos una sección insertando esta línea:
<b:section class='contenedorscripts' id='contenedorscripts' />
En la parte CSS (antes de ]]></b:skin>) insertamos también unas propiedades para esa clase (contenedorscripts), para que los títulos que pongamos ahí no sean visibles. Esto es útil para poder identificar mediante el titulo, qué script está en cada gadget cuando vayamos a instalar varios, pero evitando que dichos títulos sean visibles en la vista normal del blog.
.contenedorscripts .widget h2 {display: none; visibility: hidden;}
Ahora vamos a Elementos de página y veremos arriba del todo un nuevo bloque para añadir gadgets. Simplemente añadimos uno tipo HTML/JavaScript y en él colocamos un título (no se verá en el blog si hicimos lo del estilo) y pegamos el contenido antes copiado entre etiquetas SCRIPT.
<script type="text/javascript">
CONTENIDO DEL FICHERO .JS ORIGINAL
</script>
CONTENIDO DEL FICHERO .JS ORIGINAL
</script>
Para añadir nuevos scripts, los dos primeros pasos no serán necesarios. Simplemente añadimos nuevos gadgets y copiamos en ellos el código JavaScript correspondiente.
Nota: Cuando los scripts así instalados no funcionen, una causa común es que los símbolos < y > que pudiera haber, no sean apertura/cierre de etiquetas, sino símbolos de menor/mayor. Para que se interpreten correctamente tenemos que insertar un espacio en blanco delante y detrás de cada uno de estos:
for(var i=0;i < a_rc;i++) {...
Hasta aquí los sistemas en los que controlamos 100% el script y ahora otros para usar alojamientos externos, dónde dependeremos de la saturación o la continuidad de estos. De entre ellos, primero los de Google, ya que Blogger depende de Google y malo sería que no funcionaran.
3. USAR LIBRERIAS API AJAX DE GOOGLE
Muchos de los scripts más comunes, están alojados en las API AJAX de Google y pueden ser utilizados utilizando este tipo de código, que deberá ser insertado antes de </head>:
<script src='http://www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>
google.load("LIBRERIA 1", "VERSION");
google.load("LIBRERIA 2", "VERSION");
};
<script type='text/javascript'>
google.load("LIBRERIA 1", "VERSION");
google.load("LIBRERIA 2", "VERSION");
};
O bien con la dirección directa del fichero. Ejemplo del anterior (cargador) y de este sistema (dirección) para JQuery:
<script src='http://www.google.com/jsapi' type='text/javascript'/>
<script type='text/javascript'>
google.load("jquery", "1.3.2");
};
.../...
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
Son excluyentes. O se usa el primero o se usa el segundo. Nunca ambos a la vez.
4. USAR/ALOJAR EN GOOGLE CODE
En Google Code también hay mucho software libre y si encontramos la dirección de un script en concreto que nos interese, también podemos utilizarlo con este otro código, siempre teniendo en cuenta que el propietario podría borrarlo y quedarnos sin él más adelante.
En este caso el script se instalará simplemente poniendo antes de </head>...
<script src='URL_FICHERO' type='text/javascript'/>
Para que la cosa quede bajo nuestro propio control -opción más recomendable que depender de otros- también podemos copiar el código y alojarlo nosotros mismos en Google Code tal y como nos explicó Pizcos en una de sus entradas.
5. ALOJAR EN GOOGLE SITES
A pesar de que desapareciera Google Pages y se comentara que Google Sites iba detrás, lo cierto es que este último sigue estando operativo y permite alojar ficheros diversos, tal como vimos con el caso de los ficheros flash. De la misma manera que se explicó allí, se pueden alojar también ficheros JavaScript y luego hacer hotlinking utilizando el mismo código que se utilizó en el caso justo anterior a este y que es válido para todos los casos en que se aloje el script fuera de nuestra plantilla.
6. ALOJAR EN OTROS SITIOS
Esto es lo más fácil pero lo menos recomendable. Hay sitios que permiten alojar ficheros .js y en los que no, será suficiente con renombrar el fichero con la extensión .txt. Los scripts son básicamente ficheros de texto y por eso no habrá ningún problema cuando los renombremos. El código será como en los dos casos anteriores pero cambiando la extensión si ha sido necesario.
Referencias:
Solucionando scripts: Ultimos comentarios. Vagabundia.
Alojar scripts en Google. Pizcos Blog.
Buscando espacio para alojar los scripts. Banaka, Banaka.
¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.
Y muchos más artículos interesantes si nos sigues en...
Oloman, mis felicitaciones!! qué excelente tutorial para los que siempre andamos con la problemática de los scripts!
ResponderEliminarUn abrazo
un tutorial buenisimo :D en seguida lo copio en un documento y lo almaceno en la carptea archivosmiosextremadamentebuenos
ResponderEliminarsaludos! CHICKEN
Espero que a partir de ahora podais decir eso de "no problemo" :D
ResponderEliminarEcha un vistazo, quizá esta es otra forma:
ResponderEliminarCLIC AQUI
Keil. Probablemente esa sea una manera de evitar utilizar //<![CDATA[...etc., pero habría que valorar qué cuesta menos trabajo hacer. Gracias.
ResponderEliminarExcelente! muy bueno ahora ya se donde alojar mi scripts! Gracias =)
ResponderEliminar----
Oloman bastante tiempo sin acceder a tu ayuda ahora lo hago por que lo nesecito y me gustaria que me dijieras por que en mi elemento Estilos(HTML7) funciona expandir y contraer y en cambio en Link's Amigos(HTML8) no funciona? que puede ser? mira aqui va mi sitio http://eligor-siniestro.blogspot.com/
Creo que ya encontraste el fallo Eligor!, porque ahora mismo funciona bien. Saludos.
ResponderEliminarAsi es.. una pregunta te sabras el codigo para que por ejemplo un elemento HTML quiero que lo vea yo no mas NO los visitantes?
ResponderEliminarMételo dentro de un DIV o un SPAN con la clase
ResponderEliminarclass='item-control blog-admin'
De esa manera lo verás tú sólo cuando estés logueado. Si no, no lo verás ni tú.
Gracias es lo que buscava!
ResponderEliminarGenial, sos el mejor, no se que haria si este blog.
ResponderEliminarNo me canso de agradecer
Saludos!
Salutes muy interesante leer tus consejos, y ponerlos en practica, los invito si no es molestia a ver mi pagina es http://www.joseluisacevedo.blogspot.com y si puedes dame algun consejo para aplicarlo a mi pagina te agradeceria Oloman
ResponderEliminarVoy a guardar esta información para ir leyéndola mientras hago el intento de hacer un blog, no conozco del tema y pienso que es muy complicado, pero de todas maneras lo voy a intentar.
ResponderEliminar¿Consejos, Jose Luis? En gustos no hay nada escrito. No hay más que ver el engendro que tengo yo :D Si acaso, para que no parezca que me escaqueo, a mí se me ocurre que quizás podrías mostrar menos posts por página, para que la barra lateral y el cuerpo de entradas, ocupen más o menos la misma longitud. Pero lo dicho, es sólo un gusto personal.
ResponderEliminarInternet marketing, está bastante claro que te estás quedando conmigo ;)
pero si lo que quiero es copiar el codigo js dentro de un gadget y llamar a ese script desde otoro gadget o desde una entrada como hago???
ResponderEliminarde todas formas gracias muy buena la entrada.
Exactamente igual que si lo copias en la plantilla y luego lo llamas a continuación, desde otra parte de la plantilla, desde una entrada...
ResponderEliminarpero las entradas no me aceptan javascript es lo que estoy viendo..... sabras algo???
ResponderEliminarLas entradas si soportan javascript, lo que ocurre es que allí, la cosa es más delicada. Para empezar, el código debe ser redactado todo seguido, sin saltos de línea.
ResponderEliminarA veces te da un error al intentar guardar. Si está bien, a pesar de ese error, te dejará publicar y se verá sin problemas, pero sólo una vez publicado. No podrás hacer Vista Previa.
bueno porque lo que yo hago es agregar el script en un gadget y en otro gadget agrego el html para llamar al script. pero en la entrada cuando agrego el html para llamar al scritp no funciona.
ResponderEliminara y de una buena vez preguntarte si conoces algun servicio para alojar scritp??? dropbox es muy bueno pero noc si el bando de ancha es suficiente.
lo conoces??? de todas formas gracias por tus respuestas.
Eso que comentas no debería dar ningún problema, siempre que el código esté bien redactado, cosa que no sé ni puedo saber desde aquí.
ResponderEliminarY sobre dropbox, nunca lo he usado, pero creo que va bien. Otras opciones que sí me consta que funcionan bien, son Google Sites, Google Code y Fileden.
hola yo soy nuevo, queria preguntar si me pueden ayudar con un truco que vi.
ResponderEliminarresulta que para poder conseguir los links de descarga que tienen en un blog si o si tienes que dejar un comentario... como lo hacennnnn..... quiero ponerlo yo tambien asi por que me descargan mis cosas y ni si quiera agradecen. gracias
Ivan no he visto nunca nada por el estilo, pero es que tampoco sabría cómo hacerlo. Lo siento.
ResponderEliminarHola oloman. Muy buen artículo.
ResponderEliminarHe estado probando varias de las alternativas de alojamiento que propones y la que me parece mejor es la de google code a pesar de que en el blog de pizcas que comentas la hayan tachado diciendo que es mejor google sites.
Yo con google sites he encontrado problemas para ficheros javascript. Dicen que no se permiten pero luego sí funcionan realmente (renombrandolos como txt o no), pero tienen un comportamiento extraño y si se analiza su descarga (por ejemplo con firebug) se ve que lo rechaza inicialmente pero luego lo reintenta y sí se descarga. Pero a veces esto falla y no los descarga bien (por ejemplo si se usan desde blogs de blogger pasados a dominio personal) mientras que desde google code lo hace bien siempre a la primera.
Como tengo mucos otros ficheros en sites ne gustaría no tener que usar code solo para los js. ¿sabes cual puede ser el motivo de estos comportamientos?
Tomat los motivos, que es lo que preguntas, los desconozco. Aunque ambos sistemas están bajo la batuta de Google, son dos servicios independientes y supongo que de ahí sus diferencias.
ResponderEliminarNo sabía que Pizcos había decidido y publicado que Sites fuera mejor que Code para el alojamiento de ficheros, pero tiene su lógica. Google Code es principalmente para compartir y desarrollar rutinas y códigos de interés, en un espacio público, a modo de Wiki o web cooperativa.
Google Sites es para la creación de un sitio web personal y si permite alojamiento de ficheros, es sólo porque resulta necesario para crear una web.
Como se puede comprobar, ambos sirven para lo que necesitamos (alojamiento de ficheros 'especiales'), pero cada uno tiene una utilidad básica distinta de esa y en ambos casos, alejada del simple alojamiento.
Puestos a elegir, parece más lógico alojar en un sitio que es para uno mismo (Sites) que en otro que se supone público (Code), pero no veo ninguna otra razón más para decantarme por uno o por otro. Utilizo principalmente Sites, pero la verdad es que aprovecho ambos. ¿Un lío tener ambos? Pues sí, un poco; pero si algún día casca uno, siempre me quedará el otro. Dicen que nunca se pongan todas los huevos en la misma cesta...
Gracias en cualquier caso. Seguiré investigando a ver si consigo que funcionen los js desde sites para los blogs en dominio personalizado y si no lo consigo, los pasaré a google code.
ResponderEliminarHola
ResponderEliminarPuedes explicar con un poco mas de detalles, la parte:
1. SCRIPT DIRECTAMENTE EN LA PLANTILLA
Teniendo en cuanta que lo que deseo hacer es lo que explicas en eta entrada: http://oloblogger.blogspot.com/2010/09/integrar-publicidad-con-texto-posts.html
Saludos
Haniel, en el post que citas se explica al final cómo insertar scripts de publicidad en la plantilla y es precisamente cómo se dice también en ese punto 1.
ResponderEliminarSólo es necesario meter unos caracteres especiales (los que ahí se indican) antes y después del código del servicio, pero te anticipo que no siempre es necesario. Sólo utilízalos si el código que te proporcionan no funciona a la primera.
Hola, sabes porque no funcionan los javascript al pasar de blogspot a un dominio personal .com..., CASO: www.enfanceporlosninos.org
ResponderEliminarLo he revisado en distintas computadoras y e 3 Navegadores: Chrome, Mozilla y Safari, y no funciona en los útlimos 2
Esta muy buena tu página y aprendes muy rápido a utilizar blogger!
Armando, a mí no me ocurre eso. Tengo otro blog con dominio propio y los scripts siguen funcionando. Distinto es si además del dominio, también has cambiado el alojamiento. En ese caso, hay que reformular la dirección de los scripts.
ResponderEliminarTambién pueden fallar cuando llevan incluidos los símbolos que se explican en 1, ya que estos sólo son para Blogger.
Por último, otra causa puede ser el uso de comillas sencillas dónde debería haber dobles. En un script tienen que usarse las contrarias de las que se usen en el resto del código HTML.
En cualquiera de estos casos, insisto en que sólo fallan si se cambia de alojamiento. El cambio de dominio per sé no da problemas de esta índole.
una pregunta como hago para insertar un tabla dinamina que utiliza un script como la inserto en un post...
ResponderEliminarPues en un principio, cualquier script se puede poner en una entrada si lo metes entre <script type="text/javascript"> y </script>
EliminarSólo tienes que tener cuidado de que las comillas que tenga el script sean sencillas ('). Si por casualidad dentro de alguna función hay que usar comillas dentro de comillas, estas segundas tendrías que indicarlas como " para que Blogger no se lie.
Hola,
ResponderEliminarMe he instalado en este blog: http://pistocatala.blogspot.com.es/ esta plantilla: http://www.allblogtools.com/blogger-templates/3-columns/extra-news/
El problema es que para que funcione eso que hay al principio, de últimos posts, pues tienes que poner en un widget que te aparece al instalar esa plantilla llamado Random Posts un código que te indican en un .txt del .rar, para que te funcione.
Al poner ese código en ese widget y abrir el blog, en Chrome se me bloquea el blog, y en Firefox y IE me dice que el Script tarda mucho o no está funcionando y que lo detenga. No se porque pasa esto porque en la Versión Demo que te dejan ver antes de descargarte la plantilla lo de últimas entradas funciona perfectamente.
Qué puede estar pasando?
Gracias.
Hola. Lo que explicas parece indicar claramente que el script que hay en la demo y el que te pasan para instalar no es el mismo. He visto que la plantilla usa jquery-ui y puede que sea esa la utilidad que utiliza, aunque no se cómo se utiliza si fuera así. Quizás puedas preguntar en el sitio de dónde la descargaste.
EliminarGracias por ayudarme, estoy intentando contactar con el creador de la plantilla.
EliminarQue tal, muy buenos aportes muchas gracias.
ResponderEliminarQuiero alogar el scrip del índice (el del mandamiento xD) pero la vdd no entiendo mucho, podrías ayudarme por favor?
Hola Óscar. En esa entrada explico la manera más fácil de poner ese índice en el blog.
EliminarTienes que tomar el último trozo de código de esa entrada (el del "Aviso") y pegarlo directamente en una PAGINA. Nada más. Si lees las instrucciones verás que no hace falta ponerlo en la plantilla.
Hola, como sé para que sirve determinado script en mi plantilla?
ResponderEliminarHola. Pues para eso has de saber interpretar JavaScript, pero si no conoces ese lenguaje de programación, lo más fácil es borrarlo (copiándolo previamente en otro sitio para poder reponerlo tras la prueba) y ver qué es lo que desaparece o se modifica en tu blog.
EliminarOloman, tengo un problema, siempre que uso dominio propio en mis blogs se daña el javascript, no se muestra correctamente las páginas.
ResponderEliminarLos script los tengo alojados en sites.google.com, https://sites.google.com/site/rinconbloguero/javascript, y la página trabaja perfecto cuando uso el dominio de blogger si lo personalizo se daña, ¿Me podría ayudar?
Hola. Para echar un vistazo necesitaría saber cuál es tu blog, con qué JS te surgen problemas y en qué sitio concreto lo estás aplicando para que pueda verlo funcionando.
EliminarEste es una dirección con enlace propio, http://uniciencista.gfrodriguez.online/p/indice.html
EliminarMientras en esta que tiene el dominio de blogspot funciona bien, http://rinconbloguero.blogspot.com.co/p/indice.html
Muchas gracias.
Yo veo el índice funcionando bien en ambas direcciones ¿quizás seas tú -tu usuario- el único que no lo ve bien?
EliminarOloman, Blogger no quiere interpretar el simbolo "menor que" ni con los espacios antes y después. ¿Qué sugieres?
ResponderEliminarSi te refieres a la plantilla, no es sugerencia... es necesidad.
EliminarTienes que sustituir los símbolos < por < y los > por >
Hola tengo una duda despues que yo aloje el script en la plantilla que hago con el link donde apuntaba el dominio imagino que lo elimino pero que pongo en su lugar
ResponderEliminarNada Alejandro. Si el código JS lo pones en tu plantilla ya no necesitas un enlace para cargarlo desde el exterior. Al cargar la página ya se carga el script automáticamente.
EliminarEjemplo yo tengo un codigo que tengo que insertar en blogger para un reproductor el cual lleva tres script a los que tiene tres link mas 1 para el ccs cuando elimino los link a los script deja de funcionar el reproductor
EliminarMuchas Gracias Grupo ya encontre donde estaba el error era que estaba poniendo el script mal sin los comandos que ustedes explican en el post ya me esta funcionando perfectamente y carga rapidicimo, es un reproductor de audio que usa 3 script lo aloje los tres en la plantilla con el segundo metodo y carga rapidicimo ahora
EliminarMe alegro... y sobre todo de que encontraras tú solo la solución, porque si llegas a tener que esperar a ahora que es cuando estoy disponible :)
EliminarLes cuento lo que me sucedió con el truco de los gadgets. Empecé a pasar algunos scripts, primero no se ocultaba el nombre y entonces les borre los nombres, pero luego los gadgets desaparecieron de la nueva sección. Que susto, ya luego pille que se posicionaron solos. Por el ejemplo gadget que contenía el script del plugin chat de messenger, que se sitúa en la parte de abajo, paso a estar en la barra lateral derecha del cuerpo de la pagina. Aunque no fue un fantasma, si desapareció por completo uno, y era precisamente el tuyo sobre código que lee el tiempo de entradas. Así que elimine la sección hasta nuevo aviso. Parece una buen manera de alojarlos, ¿esta bien si los agrego en un gadget en las secciones predeterminadas?
ResponderEliminar