Como Colocar Balão Personalizado com o Número de Comentários do Lado do Título do Post

Neste post estarei ensinando aqui no Dicashot como você pode estar colocando em seu blog um balãozinho com o número de comentários em cada post. Isto é muito útil, pois, seus leitores poderão ver quantas pessoas comentaram cada post incentivando também a deixar um comentário.


                                                          Seguir @DicashotBlogger

Para Inseri-lo no blogger é bem simples:

Vá no seu HTML pressione as teclas CTRL+F e pesquise por:

 <b:includable id='post' var='post'>    

Se não encontrar pesquise por: <class='post-title entry-title'>


Cole esse código logo abaixo, da tag encontrada:

<span class='post-comment-link-arriba' style='background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiN2IinM-KCkR4oKylLfMtEQwSEmxeJ9QHmvesVuELj-ehHlyuiGmgTOjHEjVFB876mWxMBsNqKXUkiqdVij8dXwt2X7909UV_Y3rVCGhemJ3wdugObiXy1ZtaYFB_fVgSSv8IGImh5H09s/s400/Comentario.png) no-repeat top right; width:90px; height:80px; text-align:center; float:right;padding-top:19px'><br />
<b:if cond='data:post.allowComments'><br />
<a class='comment-link' 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><br />
</b:if><br />
</span><br />

A parte destaca em AZUL no código, é a imagem. Altere de acordo com o seu gosto.

Você  também pode ajustar o tamanho da imagem:

- no trecho: width:90px corresponde a largura
- no trecho: height:80px corresponde a altura
- no trecho: padding-top:19px Corresponde ao numero que fica dentro do balão portanto altere esse valor até o numero de comentários ficarem na posição correta, lembre-se esse código muda a posição no sentido vertical (para cima e para baixo)