En una entrada anterior vimos la forma de mostrar los comentarios de Blogger, Google+ y Facebook todos juntos, sin embargo no se me ocurrió mostrar el número total de comentarios de todos los sistemas a la vez. Ahora con este tutorial veremos como llevarlo a vuestros blogs.
Como Instalarlo
Si ya habéis instalado la anterior entrada de comentarios, seguid estos pasos:
Paso #1: Copia de seguridad de la plantilla!
Paso #2: Plantilla >> Editar HTML (* Pulse Dentro Editor * Presione CTRL + F para activar el cuadro de búsqueda) y buscar el siguiente código:
<div id='com-header'>Paso #3:y debajo de ello agrega el siguiente código:
<div class='comments-count-blo-goo'>
<div align='center'>
<div class='comment-google'><div class='g-commentcount' data-color='#666666' data-font-family='arial' data-font-size='13px' data-preexisting_count='0' expr:data-href='data:post.url'/></div>
<div class='comment-blogger'><data:post.numComments/> comentarios</div>
<div class='comment-facebook'><fb:comments-count expr:href='data:post.url'/> Comentarios</div>
</div>
</div>
<style>.comments-count-blo-goo {padding: 5px;margin-left:10px;background: rgb(248, 248, 248); margin-top: 5px; border: 1px solid rgb(229, 229, 229);border-radius: 3px; line-height: normal; vertical-align: top; font-size: 13px; font-family: arial; margin: 0 2px 15px 10px; }
.comment-blogger, .comment-google, .comment-facebook { padding-left: 18px; height: 16px; display: inline-block; width: 110px; }
.comment-blogger { background: url("//www.blogger.com/img/logo-16.png") no-repeat; background-size: 14px;}
.comment-google {background: url("//www.google.com/images/icons/ui/gprofile_button-16.png") no-repeat;background-size: 14px; vertical-align: top; line-height: normal;}
.comment-facebook { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm8A2KvgQ7gsWNwtEG6cKy31IQJqGLJ5yNruPUhNI5hKITAX0lNoU8r0oeO7lmMaQ9iJk8HD-WEPE9w_7lcXYWafMHoD9pxu0Ofv5QbZrCdm1bNRbTwyiYR3Oay7DQbLQDmte81rtTCeU/s400/fbcomment.png") no-repeat; background-size: 14px; vertical-align: top; line-height: normal;}
.comment-total { font-size: 13px; vertical-align: top; display: inline-block; }
.comment-total div, .comment-google div, .comment-facebook div { vertical-align: top !important; } </style>Con esto ya tendremos funcionando el número de comentarios de cada Red Social en nuestros blogs.
Como siempre digo: si no entiendes algo "COMÉNTALO".
