Muestra a tus usuarios qué día es hoy

El script que vamos a presentar en el día de hoy es un script que plasma la fecha del día, en un gadget, sacandolo de la fecha que está dispuesto en tu ordenador sin necesidad de actualizar manualmente la fecha todos los días. Una buena manera de facilitar la búsqueda de fecha en tu blog. El ejemplo se puede ver a la derecha de este mismo blog.

Asignar fecha a tu blog

La única manera de asignar este truco es añadirlo a un gadget. Entonces vamos a Blogger → Diseño → Elementos de la página → Añadir gadget → Modo HTML/Javascript y pegamos el siguiente código:

<script type="text/javascript">
var mydate=new Date()
var year=mydate.getYear()
if (year < 1000)
year+=1900
var day=mydate.getDay()
var month=mydate.getMonth()
var daym=mydate.getDate()
if (daym<10)
daym="0"+daym
var dayarray=new Array("domingo","lunes","martes",
"miércoles","jueves","viernes","sábado")
var montharray=new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio",
"Julio","Agosto","Septiembre","Octubre",
"Noviembre","Diciembre")
document.write("<p>Hoy es "+daym+" de "+montharray[month]+" del "+year+"</p>")
</script>

El resultado de este código es el siguiente:

Título del blog en navegador con efecto de tipeo

En esta ocasión vengo a presentarles un script que hará nuestro título en el navegador web, más interesante y divertido.
Se trata de un truco que al implementarlo y guardarlo, el título del blog en el navegador plasmará el título del blog pero con efecto de tipeo.
El truco se puede ver en el Laboratorio de T.B.

Agregar efectos de título al blog

El truco se debe agregar en un elemento de la página como un código entonces vamos a: Blogger → Diseño → Elementos de la página → Añadir gadget → Modo HTML/Javascript y pegamos el siguiente código:

<script type="text/javascript">

var message="Entra a Teoriablogger.blogspot.com" //especifica un título
var message=message+" "
var temptitle=""
var speed="150"

function titler(){
if (!document.all&&!document.getElementById)
return
document.title=temptitle+message.charAt(i)
temptitle=temptitle+message.charAt(i)
i++
if(i==message.length)
{
i="0"
temptitle=""
}
setTimeout("titler()",speed)}

window.onload=titler
</script>

Lo que está escrito en rojo es el título que va a aparecer en el navegador.
Cuando lo hayas modificado, mira la pestaña de tu navegador y listo.

Entrada borrador, publicada ¿Programada?

Muchos bloggers no saben cómo hacer para cambiar el orden de la lista de entradas que ofrece el mismo Blogger. Sin embargo, no sólo existe esta función para cambiar el orden de las entradas, sino que también para programar una.

¿Qué significa programar una entrada en Blogger?

Una entrada programada crear una entrada normalmente, terminarla y ponerle fecha y hora de publicación, por ejemplo:
Son las 13:20hs del día 15 de octubre y terminé de escribir una entrada, pero la programo para que se publique automáticamente el 21 de octubre a las 15:20hs.

Programar entradas

Primero hay que crear la entrada y terminarla en Blogger → Botón Crear nueva entrada.
Ahora hacemos click en el enlace spoiler Opciones de entrada que se encuentra debajo del editor de textos:

Allí cambiamos el día actual por una fecha futura, por el día que quieres que se publique automáticamente. También puedes cambiar la hora a publicar. Cuando tengas determinado ambos campos, haz click en Publicar Ahora nos dirigimos a la lista de entradas, haciendo click en el título de tu blog.
Veremos que tendremos el post que acabamos de programar en la lista entradas como una entrada programada:

Incluir tu blog a Google y Yahoo

Si quieres que tu blog aparezca en los buscadores más visitados de la red, mira el siguiente recuadro que te indica cómo agregar tu blog a los buscadores como Google, Yahoo y Bing (de MSN).

URLs para añadir tu blog a los buscadores

Añade tu blog a Google: http://www.google.com.ar/addurl/?continue=/addurl
Añade tu blog a Yahoo (necesitas estar registrado): http://siteexplorer.search.yahoo.com/ar/free/request
Añadir tu blog a uno de estos buscadores es un proceso largo que puede durar semanas o incluso meses. Ni siquiera se garantiza si tu blog será añadido.

Asignar tooltips para enlaces con efectos

Antes de ver este post te recomiendo ver este que se relaciona: Atributo title

Con este truco te vamos a enseñar a crear un tooltip con códigos jquery y al pasar por un enlace o texto, el tooltip se mostrará con un efecto y persiguiendo al cursor, como podemos ver en el laboratorio de T.B..

Tooltip Jquery en tu blog

Vamos a Blogger → Diseño → Edición de HTML y bucamos el siguiente código: ]]></b:skin> y arriba pegamos el siguiente código arriba:

#easyTooltip{
padding:4px 9px;
border:2px solid #2086CA;
background:#fff;
color:#2086CA;
font-family:arial;
}

Ahora vamos a pegar el siguiente código abajo del mismo (]]></b:skin>):

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<!-- Comienzo de código Tooltip -->
<script type='text/javascript'>
$(document).ready(function(){
$(&quot;a.tooltip&quot;).easyTooltip();
});
</script>
<script type='text/javascript'>
//<![CDATA[
(function($){$.fn.easyTooltip=function(options){
var defaults={xOffset:20,yOffset:30,tooltipId:"easyTooltip",clickRemove:false,content:"",useElement:""};
var options=$.extend(defaults,options);
var content;
this.each(function(){
var title=$(this)
.attr("title");
$(this)
.hover(function(e){content=(options.content!="")?options
.content:title;
content=(options.useElement!="")?$("#"+options.useElement)
.html():content;$(this)
.attr("title","");
if(content!=""&&content!=undefined){$("body")
.append("<div id='"+options.tooltipId+"'>"+content+"</div>");
$("#"+options.tooltipId)
.css("position","absolute")
.css("top",(e.pageY-options.yOffset)+"px")
.css("left",(e.pageX+options.xOffset)+"px")
.css("display","none")
.fadeIn("fast")}},function(){$("#"+options.tooltipId)
.remove();$(this)
.attr("title",title)});$(this)
.mousemove(function(e){$("#"+options.tooltipId)
.css("top",(e.pageY-options.yOffset)+"px")
.css("left",(e.pageX+options.xOffset)+"px")});
if(options.clickRemove){$(this)
.mousedown(function(e){$("#"+options.tooltipId)
.remove();$(this)
.attr("title",title)
})}})}})(jQuery);
//]]>
</script>
<!-- fin de código de Tooltip -->

Y ahora vamos a aprender cómo hacer un tooltip en un enlace, cada vez que queramos publicar uno. Siempre que quieras publicar un tooltip, debes agregarle a la etiqueta <a> el atributo title y el contenido adentro: title="Contenido del tooltip" y ademas debes agregar el atributo class con el contenido tooltip dentro: class="Tooltip".
El enlace con tooltip se puede añadir en cualquier parte del blog (ya sea en una entrada, gadget o texto en la plantilla).

Código completo

<a href="http://teoriablogger.blogspot.com" id="tooltip" title="Obtiene ayuda para tu blog">Teoría Blogger</a>