Comentários Personalizados para Blogger

De noovo?
Sim, xD. Eu, novamente não gostei do último que postei, então trouxe outro, e esse realmente veio para ficar. Esse tem efeito hover e tudo ao passar o mouse em cima dos botões.
Peguei lá no Viva La Ni
 É facinho de fazer, espero que vocês gostem!
O resultado é esse:

Vá em Editar HTML e com Ctrl + F procure por ]]></b:skin>

Acima dele, cole esse código: 

#comments h4, #comments .comment-author a, #comments .comment-timestamp a { /*Texto "X comentários"*/
font-family: 'Pompiere', cursive; /*Fonte do total de comentários*/
color: #262626; /*Cor da fonte do numero total de comentarios*/
font-size: 25px; /*Tamanho da fonte*/
font-weight: normal;
text-transform: uppercase; /* todas as letras em maíusculo */
}
#comments {
background: #fff; /*Fundo da área geral dos comentários*/
padding: 15px; /* tamanho da área */
}
.comments .comment-block { margin-left: 70px; margin-bottom: 0px;} /*Espaço entre o avatar da pessoa e o corpo do comentário*/
.comment-header {
background: #c74e84; /*Cor de fundo do nome do autor do comentário*/
padding: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.comment-header a {
color: #fff !important; /*Cor do nome do autor do comentário*/
font-family: 'Pompiere', cursive;/*Fonte*/
font-size: 16px; /*Tamanho da fonte do nome do autor do comentário*/
font-weight: normal;
}
.comment-header a:hover {
color: #FFE7BA !important; /*Cor do nome do autor do comentário quando passa o mouse*/
text-decoration: none;
}
.comments .comments-content .datetime a{
font-size: 16px !important; /*Tamanho da fonte da hora e data do comentário*/
float: right; /*Data alinhada a direita*/
line-height: 20px; /*Altura da linha da data e hora*/
font-family: 'Pompiere', cursive; /*Fonte do texto*/
}
.comments .comments-content .comment-content{ /*Bloco de texto do comentário*/
margin-top: -10px; /*Espaço entre o bloco de texto do comentário e o nome do autor*/
position: relative;
background: #fff; /*Fundo do bloco de texto do comentário*/
padding: 10px;
color: #000; /*Cor da fonte do bloco de texto do comentário*/
font-size: 18px; /*Tamanho da fonte*/
font-family: 'Pompiere', cursive; /*Fonte*/
border: 1px dashed #c74e84; /*Borda, se preferir aumente o valor e a cor*/
border-top: 0px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.comments .avatar-image-container {
/*Tamanho do avatar */
max-width: 50px;
max-height: 50px;
min-height: 50px;
min-width: 50px;
border-radius: 100%; /*Foto redonda, altere o valor se preferir*/
border: 4px solid #f0b8b8; /*Borda da foto, altere o valor e a cor se preferir*/
}
/*Tamanho do avatar */
.comments .avatar-image-container img{
max-width: 50px;
max-height: 50px;
min-height: 50px;
min-width: 50px;
}
/*Respostas*/
.comments .comments-content .comment {
padding: 5px 10px !important;
font-family: 'Pompiere', cursive;/*Fonte do Respostas*/
font-size: 14px; /*Tamanho da fonte*/
text-transform: uppercase; /*Todas as letras em maiúsculo*/
}
.comments .comments-content .comment a:hover{
color: #c74e84; /*Cor do texto do respostas quando passa o mouse*/
}
.comments .comment .comment-actions a {
padding: 5px;
background: #c74e84; /*Fundo dos botões responder e excluir*/
color: #fff; /*Cor do texto dos botões responder e excluir*/
margin-top: 25px;
margin-right: 10px;
font-size: 16px; /*Tamanho do texto dos botões*/
font-family: 'Pompiere', cursive; /*Fonte dos botões*/
border: 0px solid #000; /*Borda, aumente o valor e altere a cor se preferir*/
text-transform: uppercase; /*Todas as letras em maiúsculo*/
-webkit-border-radius: 5px; /*Borda arredondada*/
-moz-border-radius: 5px;
border-radius: 5px;
transition-duration: 0.45s;
-moz-transition-duration: 0.45s;
-webkit-transition-duration: 0.45s;
}
.comments .comment .comment-actions a:hover {
background:#f0b8b8; /*Cor do fundo dos botões quando passa o mouse*/
color: #c74e84; /*Cor do texto dos botões quando passa o mouse*/
text-decoration: none;
}
.comments .continue { border-top: none; }
.comments .continue a {display: none;}

Para usar a mesma fonte que está no print, procure por <head>

E abaixo desse código que você acabou de achar, cole esse:

<link href='http://fonts.googleapis.com/css?family=Pompiere' rel='stylesheet' type='text/css'></link> 

Obs: Para que funcione, é importante que o Local dos Comentários do seu blog esteja em Incorporado

Espero que dê certo!