Firma en los comentarios del autor

En una entrada anterior vimos como destacar los comentarios del autor del blog, dándoles un diseño distinto a los demás comentarios.

Usando este mismo sistema,  voy a explicar como añadir una imagen como firma en los comentarios del autor del blog, tal como lo he hecho yo.

[1] En primer lugar incluimos las modificaciones en la plantilla que se explican en esa entrada si no lo hemos hecho anteriormente.

[2] Una vez tengamos incluidos todos los cambios para distinguir nuestros comentarios del resto, añadimos la llamada a la imagen en el mismo código que habíamos colocado:

<b:if cond='data:comment.author == data:post.author'>
<dd class='blog-author-comment'>
<p><data:comment.body/><img class='firma' src='url_de_la_imagen_firma'/></p>
</dd>
<b:else/>

Como podéis ver, le hemos dado una clase (class) a la imagen (en el ejemplo "firma") aunque podéis poner cualquier nombre.

[3] Colocamos ahora en el CSS de la plantilla (antes de ]]></b:skin>) el código necesario para controlar la posición de la firma dentro del cuerpo del comentario:

.firma {
display:block;
width: 45px;
height: 28px;
}

En width: pondremos el ancho que tiene nuestra imagen y en height: el alto.

El resultado será entonces algo así:

Para controlar la posición de la firma, añadimos una nueva instrucción en el mismo código anterior:

.firma {
display:block;
width: 45px;
height: 28px;
padding-left: 90%;
}

Tendremos que variar el porcentaje (90% en el ejemplo) según la posición que queramos conseguir para la imagen.

En el blog de BanakaBanaka podéis ver otra forma muy interesante de incluir la firma del autor del blog en los comentarios.