7:34
Moderador
El botón Google+1 en el blog para que los usuarios puedan recomendar las entradas que les parecen interesantes. Pero también podemos colocar el botón +1 (Plus One) para que se recomiende no la entrada sino la página principal del blog.
Como sé que a muchos les puede parecer molesto tener siempre la barra visible, he incluido una cookie (a duras penas lo hice) para que el lector sólo lo vea una vez por semana, aunque por supuesto este tiempo lo puedes configurar a tu gusto.
Empecemos. Primero entra en Diseño | Edición de HTML y pega antes de </head> esto:
<script type='text/javascript'>
//<![CDATA[
// Cookies
function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function eraseCookie(name) {
createCookie(name,"",-1);
}
//]]>
</script>
Ahora pega antes de ]]></b:skin> estos estilos:
/* Barra Plus One
----------------------------------------------- */
#barraPlus1 {
position:fixed;
bottom:0px;
left:0;
height:24px;
background:#000; /* Color de la barra */
width:100%;
padding:5px;
filter:alpha(opacity=70); /* Transparencia de la barra */
-moz-opacity:0.7; /* Transparencia de la barra */
-khtml-opacity: 0.7; /* Transparencia de la barra */
opacity: 0.7; /* Transparencia de la barra */
z-index:900;
}
#mensajePlus1, #textoPlus1 {
color:#D8D8D8; /* Color del texto */
font-family:Verdana; /* Tipo de fuente */
font-size:16px; /* Tamaño del texto */
vertical-align: middle;
display:table-cell;
}
.botonPlus1 {
display:table-cell;
padding-left:20px;
}
.cerrarTextoPlus1 {display:none !important;}
A continuación busca la etiqueta <body> o esta línea:
<body expr:class='"loading" + data:blog.mobileClass'>
Debajo de cualquiera de ellas dos agrega este código:
<script type='text/javascript'>
//<![CDATA[
// barra Google +1 (ciudadblogger.com)
function saludoPlus1(plusone) {
var div_ty = document.getElementById("mensajePlus1");
if (plusone.state == "on") {
document.getElementById('textoPlus1').className='cerrarTextoPlus1';
div_ty.innerHTML = "¡Gracias por recomendarnos! Tu voto es importante para nosotros.";
} else {
document.getElementById('textoPlus1').className='cerrarTextoPlus1';
div_ty.innerHTML = "Parece que ya no te gustamos, ojalá nos des otra oportunidad.";
}
}
//]]>
</script>
<div align='center' id='barraPlus1'>
<span id='textoPlus1'>¿Te ha gustado el blog? Qué tal si nos regalas un +1</span>
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>
<div id='mensajePlus1'/><span class='botonPlus1'><g:plusone callback='saludoPlus1' href='http://nombre-de-mi-blog.blogspot.com'/></span>
</div>
<script type='text/javascript'>
//<![CDATA[
var divName = document.getElementById("barraPlus1");
if(!readCookie('cookiePlus1')) {
divName.style.display='block';
createCookie('cookiePlus1', 'cookiePlus1', 7); // Número de días que dejará de verse
}
else {
divName.style.display='none';
}
//]]>
</script>
IMPORTANTE
Para que la barra sólo aparezca unos minutos hay que cambiar esta parte del primer código:
days*24*60*60*1000
Se sustituye (con mucho cuidado) por esto:
days*60*1000
Resultado
Aparecera Al Final de tu Blog
Posted in: Botones Para Compartir,zona de blogger
0 comentarios:
Publicar un comentario