-->
Thumbs Up and Down en Comentarios de Blogger

Thumbs Up and Down en Comentarios de Blogger

Hace algún tiempo hablaba de añadir pulgares de votación en las entradas de Blogger. En esta oportunidad y a petición de @vivavalve mostraré cómo añadir un sistema de puntuación a cada comentario de nuestras entradas.


Vista previa del script:


Puedes ver trabajando este sistema en este blog de pruebas.

¿Cómo añadirlo a Blogger?

Paso 1: Añadiendo la sección:

Primero, vamos a ''Diseño | Edición HTML'', en donde marcamos ''Expandir plantillas de artilugios'', buscaremos la siguiente sección:
<dd class='comment-body'>

Si utilizamos una plantilla del Diseñador de Blogger, la sección a buscar es la siguiente:
<dd class='comment-body' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>

Debajo de ésta, pegaremos el siguiente código:
<div id='thumbscomentarios'>
<div class='js-kit-rating' expr:path='data:comment.cmtBodyIdPostfix' expr:permalink='data:post.url' expr:title='data:post.title' view='score'>
</div></div>


Paso 2: Añadiendo el script:

Ahora buscaremos la siguiente sección en nuestra plantilla:
</body>

Antes de esta, pegaremos el siguiente script:

<script src="https://sites.google.com/a/blogsydescargas.co.cc/ayudabloggers/scripts/RATINGSAYUDABLOGGERS.js"></script>


Paso 3: Añadiendo la flotación mediante CSS:

Busca la siguiente zona de tu plantilla:
]]></b:skin>

Arriba de ésta, pega el siguiente código:
#thumbscomentarios {
float: right;
padding:3px;
}


Guarda los cambios y listo.
Artículo aleatorio
BuySellAds
BuySellAds
BuySellAds
BuySellAds
BuySellAds
Artículos destacados
Mejora la caja de comentarios en Blogger con Disqus # - Mejora la caja de comentarios en Blogger con Disqus
Menú inferior estilo dock # - Menú inferior estilo dock
Habilitar los nuevos comentarios de Google+ en plantillas modificadas de Blogger # - Habilitar los nuevos comentarios de Google+ en plantillas modificadas de Blogger
Estructura básica de una plantilla HTML5 # - Estructura básica de una plantilla HTML5
Plantilla para Blogger: GeekLines # - Plantilla para Blogger: GeekLines