Boton Google +1 con mensaje al hacer click

Con la llegada del bot?n +1 (PlusOne) y su prometedor �xito, es seguro que la mayor?a ya sabe c?mo agregar el bot?n +1 de Google en el blog. ?Pero, qu� posibilidades tiene el bot?n para ser configurado?

La verdad es que si partimos del punto que podemos hacer un callback para leer funciones Javascript entonces las posibilidades son muchas.

Una de esas posibilidades es poder mostrar un texto en el bot?n +1, un mensaje cuando el usuario nos regale un voto y otro mensaje para cuando el usuario quiera deshacer la recomendaci?n.

Puedes ver el ejemplo en este bot?n, si le das click para recomendar aparecer? un mensaje de agradecimiento, despu�s de eso dale click nuevamente y aparecer? un mensaje distinto.

Ahora vamos a ver c?mo ponerlo en el blog. Entra en Dise?o | Edici?n de HTML y marca la casilla Expandir plantillas de artilugios.
Si lo quieres debajo del t?tulo de la entrada entonces busca esta l?nea:

<div class='post-header'>

O si lo quieres al final de las entradas entonces busca esta l?nea:

<div class='post-footer'>

En cualquiera de los casos, agrega debajo de una de esas l?neas lo siguiente:

<script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
// mensaje Google+ (ciudadblogger.com)
function saludoPlusOne(plusone) {
var div_ty = document.getElementById("mensajePlusOne");
if (plusone.state == "on") {
div_ty.innerHTML = "?Gracias por recomendarnos! Tu voto es importante para nosotros."; document.getElementById('mensajePlusOne').className='msgPlusOne';
} else {
div_ty.innerHTML = "Parece que ya no te gustamos, ojal? nos des otra oportunidad."; document.getElementById('mensajePlusOne').className='msgPlusOne';
}
}
//]]>
</script>

<div align='right'><g:plusone callback='saludoPlusOne'/>
<div id='mensajePlusOne'/></div>

Ahora antes de ]]></b:skin> pega los estilos:

.msgPlusOne {
background:#0B0B3B;
color:#A4A4A4;
padding:10px;
font-style:italic;
}

Esos son los estilos que tendr? el recuadro donde aparecer? el mensaje, puedes establecer otros o simplemente no ponerlo si es que no quieres que tenga alguna apariencia. Lo que est? en color rojo son los mensajes que mostrar?, el primero es el mensaje que aparece cuando se hace click para recomendar, y el segundo para cuando ya no le gusta al lector.

Y habiendo hecho eso tendr?s el bot?n +1 de Google que muestra un mensaje al hacer click.