En esta oportunidad les compartiré el mismo estilo que utilizo yo en los avatares.
El resultado es muy similar a este:
Avatares redondeados. |
Tutorial:
En ''Diseño | Edición HTML'' (''Plantilla | Editar Plantilla'' si usas Blogger 2011) busca la siguiente sección:
]]></b:skin>Arriba de esta, pega el siguiente código:
#comments-block.avatar-comment-indent {
margin-left: 0;
}
#comments-block .avatar-image-container {
border-radius:45px;
float: left;
height: 49px;
position: static;
width: 49px;
}
#comments-block .avatar-image-container img {
border-radius:45px;
display: block;
float: none;
min-height: 45px;
min-width: 45px;
padding: 2px;
}
#comments-block .avatar-image-container.avatar-stock {
border-radius:45px;
background: #dadada url(http://3.bp.blogspot.com/-Ug-KluyFuHk/TiNB5HDJUeI/AAAAAAAABaE/BmDbfhNf4nI/s1600/question+comments.png) no-repeat 50% 50%;
}
#comments-block .avatar-image-container.avatar-stock img {
display: none;
}
img.delayLoad {
max-height: 45px;
max-width: 45px;
min-height: 45px;
min-width: 45px;
}
Guarda los cambios y listo.
Importante:
- Es muy posible que necesites modificar las secciones para que los avatares no sobrepongan los comentarios.
- Si no se ven bien, tendrás que aplicar estilos al contenedor ''comment-author''.
- Yo creé una imagen redonda para los comentarios anónimos, pero no es necesario ya que si utilizas una imagen de 45x45px cuadrada, se verá redonda igual.
No hay comentarios:
Publicar un comentario