Para empezar tenemos que tener en cuenta una cosa, por defecto en la mayoría de las plantillas de Blogger, la tuya es la Rounders y también lo tiene así, el enlace a comentarios viene en la parte de abajo de las entradas como se ve en la imagen.
Tenemos dos opciones, o hacer desaparecer este enlace a comentarios o duplicarlo, es decir, mantener el que ya viene y añadir la nube arriba. Yo, particularmente, prefiero esta opción. Los comentarios nos gustan a tod@s y cuantas más posibilidades demos a quienes nos leen para comentar será más fácil que lo hagan.
Bueno, vamos a empezar con esta opción que te digo. Mantener la linea que viene por defecto y poner la imagen con enlace arriba.
Hay que ir al código HTML de la plantilla y con la casilla de expandir artilugiosmarcada buscamos esta parte del código:
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>
lo copiamos y buscamos la zona de la plantilla donde nos interesa pegarlo. Yo lo coloqué justo debajo de:
<b:includable id='post' var='post'>
Ahora tenemos que modificar un poco este código que hemos pegado, eliminamos dos etiquetas "<data:top.commentLabel/>" y "<data:top.commentLabelPlural/>" y cambiamos
<a class='comment-link' por <a class='comment-link2'
El código debajo de <b:includable id='post' var='post'> nos quedaría así:
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link2' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <b:else/><data:post.numComments/> </b:if></a>
</b:if>
</b:if>
</span>
Una vez hecho esto, buscamos ]]> y justo encima pegamos el siguiente código:
.comment-link2 {
font-size: 150%;
background: url(http://img368.imageshack.us/img368/2623/comentabe7.png) no-repeat top right;
height: 50px;
width: 53px;
text-align: center;
float: right;
margin: 5px 0 0 0;
padding:5px 2px 0 5px;
}
guardamos los cambios y ya tendremos la nube que nos enlaza con los comentarios.
Espero que te haya servido. Un abrazo
