
Lo vi, me llamó la atención y lo puse en práctica.
El efecto queda genial lo podéis ver en mi blog de pruebas, se trata de añadir una burbuja y en su interior el número de comentarios de cada entrada.
El artífice de este invento es nuestro querido amigo Pizcos, vamos a seguir sus explicaciones pero aún así recomiendo ver su blog porque seguro que más de uno quedara encantado con todo lo que nos enseña.
Como de costumbre ubicamos ]]></b:skin> y justo antes añadimos:
background: url(url-imagen) no-repeat top right;
float:right;
text-align: center;
padding: 10px 0 0 0;
font-size: 150%;
width: 50px;
height:50px;
color: #fff;
}
.numComments a:link{
color: #CODIGO HEXADECIMAL;
}
.numComments a:visited{
color: #CODIGO HEXADECIMAL;
}
.numComments a:hover{
color: #CODIGO HEXADECIMAL;
}
Guardamos los cambios y expandimos la plantilla de artilugios donde buscaremos:
<b:if cond='data:post.title'>
Justo después añadiremos:
Veamos lo que según Pizcos podemos modificar:
.numComments {
background: url(url-imagen) no-repeat top right;
 Aquí definimos la imagen y su posición.float:right;
 Posición de todo el elemento.text-align: center;
 Alineamos el texto.padding: 10px 0 0 0;
 Posicionamos el numero.font-size: 150%;
 Tamaño del número.width: 50px;
 Ancho del conjunto, la imagen es de 50*50 pixeles.height:50px;
 Alto del conjunto.color: #fff;
 Color de la fuente..numComments a:link
 Color del número..numComments a:visited
 Color del link una vez visitado..numComments a:hover
 Color al pasar el  mouse.Colores hexadecimales.
Pizcos proporciona un zip conteniendo las imágenes que son las siguientes y también podéis guardar desde aquí.
 
 
 
 
 
 


0 comentarios:
Publicar un comentario