lunes, 24 de octubre de 2011

Avatares en comentarios en Blogger (Para plantillas que no incluyen esta función)

Algunas plantillas de Blogger no incluyen la opción de mostrar el avatar de quién comenta, lamentablemente es una característica que los diseñadores deberían incluir en todo momento y que no lo hacen.

Hace un tiempo atrás creé una plantilla básica para blogger con la cual pudieran manipular un poco mejor las técnicas de diseño, por despiste olvidé incluir este sistema así recomiendo que si desean practicar aprovechen esta template para incluir el sistema de avatares en los comentarios.


El tutorial:


En "Diseño | Edición HTML" deberás marcar la casilla "Expandir plantillas de artilugios".  Deberás buscar el siguiente código:
<dl id='comments-block'>
Reemplázalo por el siguiente:

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

Si no lo encuentras busca el siguiente código:
<div id='comments-block'>
Y éste sustitúyelo por:
<div expr:class='data:post.avatarIndentClass' id='comments-block'>

Ahora deberás buscar el siguiente código:
<a expr:name='data:comment.anchorName'/>
Arriba de éste pega el siguiente código:
<b:if cond='data:comment.favicon'>
<img class="avatar-comentario" expr:src='data:comment.favicon'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>
Posteriormente guarda los cambios y listo.

Importante:

Para aplicar estilos y corregir algunos errores de visualización deberás trabajar mediante CSS con la class .avatar-comentario de la siguiente forma:
.avatar-comentario {
width:45px; /*Ancho del avatar*/
height:45px; /*Alto del avatar*/
otros-atributos;
}

Estos códigos van siempre antes de ]]></b:skin>.

No hay comentarios:

Publicar un comentario