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

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>.
Artículo aleatorio
BuySellAds
BuySellAds
BuySellAds
BuySellAds
BuySellAds
Artículos destacados
Crea texturas y motivos para tu blog con Adobe Photoshop # - Crea texturas y motivos para tu blog con Adobe Photoshop
Añadir CSS a los enlaces según tipo de archivo # - Añadir CSS a los enlaces según tipo de archivo
¡Hemos actualizado el diseño del blog! # - ¡Hemos actualizado el diseño del blog!
Conociendo CSS3 - Animaciones # - Conociendo CSS3 - Animaciones
Thumbs Up and Down en Comentarios de Blogger # - Thumbs Up and Down en Comentarios de Blogger