En XML existe una instrucción que nos permite especificar datos, utilizando cualquier carácter, sin que se interprete como una etiqueta, es decir, nos permite escribir los caracteres "prohibidos" como < > & sin necesidad de transformarlos en &lt; &gt; &amp;. Es la llamada CDATA (Character Data).

Usarla en Blogger nos da una ventaja, el código que debemos escribir es mucho más legible y evitaremos los típico mensajes de error al estilo: "The reference to entity "xxx" must end with the ';' delimiter" o "Tag is not closed".

Si miran la plantilla del blog, aún cuando no se hayan hecho modificaciones, veremos esa instrucción:
<b:skin><![CDATA[
.......
]]></b:skin>
¿Para qué nos sirve? Es lo que nos permitirá eliminar algunos archivos externos e incorporarlos directamente en la plantilla. No es lo que sugieren los especialistas ya que tener los scripts en archivos externos hace que los navegadores los cacheen y por los tanto, la navegación es más rápida pero, esa ventaja es relativa frente a la incomodidad de no tener un servidor adecuado donde alojarlas.

¿Cómo la utilizamos? Agregándola entre las etiquetas script:
<script type="text/javascript">
//<![CDATA[
[ ... aquí va el script ... ]
//]]>
</script>
Un ejemplo sencillo.

Este código sería rechazado al tratar de ingresarlo en la plantilla:
<script>
function demo(valor) {
if (valor < 0) {
valor = 0;
} else {
valor = 1;
}
</script>
Y aparecería el siguiente mensaje de error:

No se ha podido analizar su plantilla, porque no está bien formada.
Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The content of elements must consist of well-formed character data or markup.

Agregando CDATA, el código es aceptado y el script funcionará:
<script>
//<![CDATA[
function demo(valor) {
if (valor < 0) {
valor = 0;
} else {
valor = 1;
}
//]]>
</script>

29 comentarios:

La Blogueria  

Fascinante. Voy a reprobar algunos scripts que no podía calzar ni con palanca, ni parseando algunos caracteres.

Gracias! Saludos.

Responder
Gem@  

El problema sería que la plantilla quedaría colapsada de scripts algunos ocupan mucho espacio se haría interminable ¿no?

Responder
JMiur  

El "largo" de la plantilla es indifernte desde el punto de vista de la carga o del funcionamiento, sólo la hace más engorrosa de editar y en ese sentido, lo mejor es "comentarla" de tal manera de encontrar las cosas rápidamente.

Es cierto que se aconseja tener los scripts en archivos externos para que el navegador las utilice desde la caché pero, en casos de emergencia hay que usar lo que se puede. Por otro lado, si el script es chico, ese "cacheo" es relativo ya que el tiempo de carga no variará demasiado.

También es posible colocar algunos scripts fuera del header. Muchas veces, se colocan al final de la página, antes de </body>

También es posible colocar algunos en elementos HTML ya que no necesariamente son necesario cargarlos al inicio.

En lo personal, uso los scripts que provee Google y LightWindow alojado en SkyDrive. Todos los demás los he colocado en la plantilla.

Digamos que quiero desentenderme del asunto de los alojamientos externos y usarlos nada más para los demos de los posts.

Responder
Graciela  

ESE BENDITO LETRERITO EN ROJO, como sabes estoy aprendiendo, sale la porqueriita (nueva palabra para la RAE) ésa.
Saludos!!!

Responder
Markos  

¡Buenas! Te quiero pedir un favor muy grande;he estado mirando en muchos foros de WebMasters un script que te cambia automáticamente de cabecera y no lo doy encontrado, entonces te pido por favor si tú lo pudieras investigar por así decirlo , o encontrarlo y dónde hay que colocarlo y cómo...un millón de gracias

Responder
Claudio 'Poca Tinta'  

Justo por ese lado va la consulta que le he hecho a su email.

Saludos

J. Muir

Responder
JMiur  

Graciela: nos pasa a todos, ese cartelito es una maldición :D

Markos: explícame que hace el script ¿cambia las imágenes del header? Si es eso, es sencillo de resolver.

Caludio: acabo de recibirlo; veremos de que se trata ;)

Responder
Markos  

Sí ,en el script pones la URL de unas cuantas cabeceras y cada vez que actualizas la páginas se escoge una de ellas al azar. Gracias! :)

Responder
JMiur  

Fíjate si se entiende la explición de este post. allí hay un script ejempl oque haría exactamente eso.

Responder
Jimena de Kurbalain  

Gracias Miur por la información, que por cierto desconocía. Muy buen blog.

Saludos cordiales.

Responder
JMiur  

Saludos, Jimena, gracias por el comentario

Responder
Bonzu Pipinpadaloxicopolis III  

Con "comentarla" te refieres a anteponerle esto?

<!-- ======= Esto ======= -->

Responder
JMiur  

Todo lo que esta entre esos caracteres es ignorado por los navegadores. Un ejemplo:

<!--
TODO LO QUE ESTA ACA ESTA COMENTADO
Y POR LO TANTO, NO SE EJECUTA
-->

Responder
Admin  

oye jmiur una pregunta sabes como puedo aplicarle css para ponerle margen al script de outbrain.

y lo que quiero es aplicarle css para ponerle margin-left:50px; para que tenga margen de la orilla al post, porque cuando agrego el script se agrega el raiting de star en la orilla del post.

Responder
JMiur  

No sé a cuál te refieres.Deberías indicarme donde ver el ejemplo.

Responder
Admin  

Jmiur ya lo he colocado disculpa pero lo habia quitado ahora si puedes ver el sistema de rating de outbrain pero aparece pegado a la orilla izquiera del post y quisiera poneler margen-left para que no se pegue es un script sabes como aplicarle css?

Responder
JMiur  

Ahora lo veo. Por ejemplo, podrías probar con algo así:

#outbrain_container_0_bottom {margin-left:30px;}

Puse cualquier valor. Eventualmente, le agregas !important aunque no creo que sea necesario:

#outbrain_container_0_bottom {margin-left:30px !important;}

Responder
Admin  

Jmiur eres un genio man solo que hay un problema al colocar el css si funciona en el primer post se pone el margen pero ya en los demas post sigue igual pegado a la orilla porque sera?

Oye Jmiur te recomiendo crear una entrada explicando este problema porque varios usuarios tambien tienen la duda y seria bueno que les ayudaras =), bueno es solo sugerencia.

Responder
JMiur  

Parece que tiene ids diferentes IDs no sé por qué. No importa, en lugar de eso, usa esto y ahí sí, coloca el !important:

.div-wrapper {margin-left: 30px !important}

Responder
Admin  

Grasias Jmiur eres unico man siempre ayudando a los demas xd sin tu ayuda mi blog nunca se haria posible solo que jjaja otra duda el gadget de outbrain ya tiene margen y todo pero se muestra antes del more osea antes del corte de entra donde tengo " continuar leyendo esta entrada >> " pero quiero que aparesca despues del jump-link osea el more pero he intentado todo lo muevo el script al post footer y nada se podra mover?

Oye unna pregunta Jmiur como aprendiste tanto acerca del codigo de los blogs de blogger? algun tutorial

Responder
Admin  

oye Jmiur el gadget de outbrain ya tiene margen y se ve bien y todo pero se muestra antes del more osea antes del corte de entra donde tengo " continuar leyendo esta entrada >> " pero quiero que aparesca despues del "continuar leyendo esta entrada >> " osea el more pero he intentado todo lo muevo el script al post footer y nada se podra mover?

y mira estos blogs son de bloggers y tiene el linkwithin despues del more y el outbrain. asi lo quiero yo pero no puedo como le puedo hacer para que me aparesca el more y despues el linkwithing y de ahy el outbrain mira estas paginas:

www.ps2elite.net y www.360.furiagames.org

Oye unna pregunta Jmiur como aprendiste tanto acerca del codigo de los blogs de blogger? algun tutorialo solo experiencia xd porque eres bien chido =)

Responder
JMiur  

Para cambiarlos de lugar, busca el DIV del jump-link que es el MORE y muévelo arriba del otro. Lo mismo pasa con lo demás que debe ser un script. No sé exactamente que dicen en tu platilla, debes tratar de identificar cada parte y, simplemente, cambair el código de lugar.

No aprendí en ninguna parte, sigo aprendiendo a fuerza de meter la pata :D

Responder
Admin  

Grasias jmiur eres de los mejor siempre ayudandome, sigue asi man y seras mejor muchas grasias porfin resolvi todas mi dudas =)

Oye man como puedo crear un protector de links es decir que al dar click en un enlace de descarga como megaupload u otros hosting se redireccione a otra pagina donde halla publicidad u otros anuncios y que ahi aparesca el link original para descargar el archivo, he visto muchos blogs y he buscado en google y nada, un ejemplo de un blog donde esta implementado el script del protector de links: http://www.gamesviciantes.com/

y el script del protector del source: creo que esta en php o javascript sabes como hacerlo?

http://www.carnaporto.net/downloads/aHR0cDovL3RyYWNrLm96b25pb24uY29tL2FmZl9jP29mZmVyX2lkPTIxJmFmZl9pZD0xMjcaHR0cDovL3RyYWNrLm96b25pb24uY29tL2Fy3g4y3g44iou34o34i34giy3gy3g423g4iu24g3gvb4y3g42uy3g4y3go24324oi2lkPTIxJmFmZl9pZD0xMjc/protetor.js

Graxxx poor todo eres de lo Mejor Jmiur !!! ^^

Responder
Manfenix  

Hola JMiur, tengo la siguiente duda. Se puede colocar un script en un post?. Y en caso afirmativo, hay alguna regla a seguir para su inserción?.
Saludos :)

Responder
JMiur  

Sí. Se puede. Se coloca igual que en la plantilla pero no debe usarse CDATA.

En caso de tener símbolos como < y > deben ser cambiados y, dependiendo del editor que usaes, debe colcoarse en una sola línea.

Responder
Indeziisoow  

Hola JMiur, yo tenía la misma pregunta que Manfenix. Hice lo que le explicaste. Cambié los < > (por < gt; y después < >) pero no pasó nada. (También reemplacé las comillas por ' pero no pasó nada. ¿Tiene alguna solución para esto? ¿O algo que se nos haya escapado? Agredecería su ayuda.

Responder
JMiur  

Pués te diría que cambair los símbolos < y > no siempre resulta y que si se trata de escribor scripts en los posts, o deben ser muy simples o deben suarse archivos externos porque suelen generar problemas.

Responder
Indeziisoow  

Está bien, muchas gracias por su respuesta JMiur. :D

Responder
Silvio Sánchez  

Gracias! ha funcionado a la perfección en mi blog. Casi estaba que me rendia al respecto :)

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR