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
Marca de agua en las imágenes con CSS # - Marca de agua en las imágenes con CSS
Cómo obtener la primera imagen del post en Blogger sin Javascript # - Cómo obtener la primera imagen del post en Blogger sin Javascript
Efecto de desenfoque con CSS # - Efecto de desenfoque con CSS
Ocultar entradas con determinada etiqueta en el inicio de Blogger # - Ocultar entradas con determinada etiqueta en el inicio de Blogger
Personalizar las plantillas "Vistas dinámicas" en Blogger # - Personalizar las plantillas "Vistas dinámicas" en Blogger