Cuadros de texto incrustados en Blogger

A veces necesitamos incrustar cuadros de texto en los posts o artículos de Blogger. Son cuadros que crean barras de desplazamiento para poner textos largos. Veamos la forma de hacerlo con el código correspondiente que tenemos que utilizar. En el siguiente ejemplo os dejo el trozo de código necesario para hacer lo que debajo tenéis: un cuadro de texto con barras de desplazamiento. Sólo hay que copiar el código y llevarlo al blog propio.

<span id="fullpost"><div align="center"><pre style="overflow: auto; width: 500px; height: 150px;"><div align="left"><span style="font-size: 100%;">

En este espacio ponemos el texto que queramos; sea largo o corto.

</span></div></pre></div>

Cuadros de Texto

Con un sencillo código, puedes crear un pequeño cuadro con un texto que se desplaza hacia arriba. Prueba a modificar el color, la dirección, etc. Experimenta...

Aquí el código:

<div align="center"><table bgcolor="#990000" border="1" 
width="200"><tbody><tr><td 
align="center"><marquee scrollamount="1" direction="up" 
height="50"><span style="color:#ffffff;">Con un sencillo 
código, puedes crear un pequeño cuadro con un texto que se desplaza 
hacia arriba.
Prueba a modificar el color, la dirección, etc.
Experimenta...
</span></marquee></td></tr></tbody></table></div>

Cambiar la presentación de las fechas de las entradas

Podemos cambiar la típica fecha del post por lo siguiente:  
Hace "tiempo transcurrido desde la publicación de la entrada"

Para ello hemos de modificar nuestra plantilla y añadir código javascript.
Pasos:

• Entrar al código html de la plantilla (Escritorio → Diseño → Edición de HTML)
• Marcar: Expandir plantillas de artilugios
• Colocar el código javascript siguiente detrás de: ]]></b:skin> 

<script type='text/javascript'>
function timeAgo(date1,date2,granularity){var self=this;periods=[];periods[&#039;semana&#039;]=604800;periods[&#039;d&amp;iacute;a&#039;]=86400;periods[&#039;hora&#039;]=3600;if(!granularity){granularity=5;}
(typeof(date1)==&#039;string&#039;)?date1=new Date(date1).getTime()/1000:date1=new Date().getTime()/1000;(typeof(date2)==&#039;string&#039;)?date2=new Date(date2).getTime()/1000:date2=new Date().getTime()/1000;if(date1&gt;date2){difference=date1-date2;}else{difference=date2-date1;}
output=&#039;&#039;;for(var period in periods){var value=periods[period];if(difference&gt;=value){time=Math.floor(difference/value);difference%=value;output=output+time+&#039; &#039;;if(time&gt;1){output=output+period+&#039;s &#039;;}else{output=output+period+&#039; &#039;;}}
granularity--;if(granularity==0){break;}}
return&#039;Hace &#039;+output;}
$(document).ready(function(){});
</script>

• Sustituir el siguiente código: <data:post.dateHeader/>

          Por: 

<scrip type='text/javascript'>document.write(timeAgo(&#39;<data:post.dateHeader/>&#39;));</script>

• El último paso es cambiar el formato de fecha para que sea compatible con el script entra a: Escritorio → Configuración → Formato → Formato de cabecera de fecha. Cambiar el formato de fecha por el sexto de arriba hacia abajo: 7/18/2010. Guardar los cambios.

Comentarios recientes en el blog

Para mostrar los últimos comentarios añadidos tenemos un gadget: Recent Comments
Pero parece ser que su funcionamiento es errático.

Podemos solucionarlo añadiendo el gadget Feed y colocar como dirección del feed:

http://el_nombre_de_tu_blog.blogspot.com/feeds/comments/default