Calificar entradas en Blogger


Tener un sistema de calificación de entradas en nuestro blog es importante, pues aparte de la opinión de nuestros lectores su calificación también es importante para determinar la calidad de nuestras entradas; así pues hoy les comparto y les enseño cómo instalar un sistema de calificaciones en nuestro blog para ello haremos lo siguiente:



Para insertarlo en nuestro blog vamos a Plantilla | Editar HTML y buscamos esta línea:
<div class='post-footer'>
Debajo de ella pegamos el siguiente código:
<div align="right">
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div expr:id='"labels_" + data:post.id' style='display: none; visibility: hidden;'> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <data:label.name/>,</b:loop></b:if></div>Califica este artículo: <div expr:id='data:post.id' class='ffbs_rate'>{[[&#39;&lt;img src=&quot;http://static.graddit.com/img/star.png&quot;/&gt;&#39;]]}</div> <div expr:id='&quot;ffbs_stats_&quot; + data:post.id' class='ffbs_stats'></div>
<script type='text/javascript' expr:src='&quot;http://graddit.com/rate/eng/5/&quot; + data:post.id + &quot;?id=&quot; + data:post.id + &quot;&amp;stats=ffbs_stats_&quot; + data:post.id + &quot;&amp;labels=labels_&quot; + data:post.id + &quot;&amp;info=info-&quot; + data:post.id + &quot;&amp;info_delay=2&amp;url=&quot; + data:post.url + &quot;&amp;class_star=ffbs_star_img&amp;class_star_set=ffbs_star_img_set&amp;class_star_vote=ffbs_star_img_vote&amp;views=yes&amp;votes=yes&amp;average=yes&quot;'></script>
</b:if>
</div>

Esto es todo para que esté en funcionamiento el nuevo sistema de calificaciones en sus entradas de Blogger.


¿No Comprendes muy bien? 
Mira el vídeo.

Calificación entradas - Blogger

54 comentarios:

  1. Hola instalé este código y me iba de maravilla, pero hace muy poco creo que ha dejado de funcionar el código, sabes de alguna solución o algo parecido?

    Gracias por tu trabajo:)

    ResponderBorrar
    Respuestas
    1. Hola amigo bueno parece y creo que el sitio web ya no existe, o lo cambiaron por esta razón los cripts no funcionan!!

      Pero miraré como puedo solucionar para actualizar el post..

      Borrar
  2. Muchas gracias por tu rápida respuesta, ojalá puedas arreglarlo, me gustaban mucho esas estrellitas, mira tonterías que le gustan a una:)

    ResponderBorrar
    Respuestas
    1. Hola de nuevo creo que eres mujer jaja discúlpame por mi comentario anterior bueno sí ya encontré otro reemplazo actualizaré el post en un par de días o menos, si gustas puedes seguir el blog para que estés al tanto !

      Borrar
  3. No pasa nada Andrés, logico si comento como anónimo:) estaré al tanto del cambio que hagas, muchas gracias:)

    ResponderBorrar
    Respuestas
    1. Hola de nuevo bueno ya actualicé el post es más sencillo ahora !! Saludos espero te sirva nuevamente !! ya lo probé !!!

      Borrar
  4. Hola Andrés, muchas gracias por la actualización, te quería preguntar si sabes si a este código se le puede cambiar la imagen por otro icono (?)

    También comentarte que he encontrado otro sitio de estos de calificaciones, bastante personalizable, lo malo es que pide registro, no se si será algo habitual...mira te paso enlace:

    http://rating-widget.com/get/rating/

    Gracias por tu ayuda:)

    ResponderBorrar
    Respuestas
    1. Hola no, no se puede cambiar el icono pues el script ya está hecho en su totalidad y cambiarlo haría que probablemente no funcione... Aunque su forma de instalación es muy sencilla..

      Respeccto al otro sitio ya lo había visto, pero, sé a la gente le gustan las cosas sencillas y el sólo hecho de registrarse los hace negar para instalar algo de todas formas es bueno, el registro es algo normal si quieres puedes hacerlo....

      Saludos,

      Borrar
  5. Hola otra vez, mira lo he instalado pero las estrellas salen alineadas en vertical en vez de horizontal, no lo entiendo..

    Gracias Andres por la explicación.

    ResponderBorrar
    Respuestas
    1. Podrías mandarme el link de donde las pusiste pues ya las coloqué ayer en mi blog y funcionaron perfectamente.- !

      Borrar
  6. Andrés ya está, ya he podido arreglarlo, gracias otra vez:)

    ResponderBorrar
  7. Oye Disculpa :/ yo tengo un diseñador de Plantillas y no me aparece esto (div class='post-footer') :( ¿No sabes en que parte va?

    ResponderBorrar
    Respuestas
    1. Hola Anónimo Es algo bastante raro ya que debería salirte esta línea por lo meos alguna parte de ella debo investigar y quizá luego te comente de nuevo como lo solucionamos...

      Saludos,

      Borrar
  8. Si Andres, es muy raro, pero encontre el <div class='post-header> y no se ve tan Mal Jaja Muchas Gracias, me encanta este sitio :)

    ResponderBorrar
    Respuestas
    1. Hola UCL2015 Qué bien que diste con la solución, y gracias tratamos de hacer de Bloggin Red un sitio acogedor :D

      Saludos,

      Feliz año...

      Borrar
  9. Oye la coloco y bien todo, pero esta demasiado grande :S no sabes a que se debe?

    ResponderBorrar
    Respuestas
    1. Hola UCL2015 A decir verdad creo que no se puede hacer mucho ya que es un script y reducir de forma igualitaria el tamaño a todo el gadget va estar un poco difícil....

      Saludos,

      Borrar
  10. Pues sigo las instrucciones y todo, pero nada, no aparece nada :(

    ResponderBorrar
    Respuestas
    1. Hola Mary Si quieres pasa el link de tu blog para verificar lo que hiciste y poder acertar con una solución...

      Saludos,

      Borrar
  11. Hola Andrés, por fin, tu sistema fue el único que me funcionó de un montón que probé en mi blog de Blogger! Pero cuando quiero puntuar un post me sale una publicidad, un add de bytespit, ¿no se puede quitar?
    Gracias

    ResponderBorrar
    Respuestas
    1. Ya te he respondido en el comentario más reciente que hiciste.

      Saludos,

      Borrar
  12. Hola, vuelvo a ser la de antes jejeje, además de salir la publicidad, el sistema creo que no me funciona, no queda claro cómo votar 5 estrellas, 4, 1... (no cambian de color ni ningún indicativo que te diga cómo estás puntuando) y pulse donde pulse me pone "rating: 0, vote:1"

    ResponderBorrar
    Respuestas
    1. Hola, anónimo verás el tutorial propuesto aquí el código como tal es de un sitio web que ofrece el servicio y como dijiste al igual que tú busqué mucho sobre uno que funcionara de forma efectiva hasta ahora es el que aquí se ve, supongo que ofrece publicidad ya que es gratuito y necesitan lucrar el servicio, por otra las fallas que se puedan presentar como te digo pueden venir directamente desde el script que ofrece la plataforma...

      Saludos,

      Borrar
  13. Hola Andrés, te dejo el link de mi blog, he seguido las instrucciones y nada que aparecen las estrellas, no se que esté haciendo o mal, o que tengo que cambiarle. http://mew19fiction.blogspot.mx/ y éste, no te sorprendas por el contenido del mismo jajajaa xD

    ResponderBorrar
    Respuestas
    1. Hola MaryChuy D.G. Prueba buscando este código en el HTML de tu blog luego, pegas el del tutorial (el de calificación) el código lo saqué de tu blog, por otra parte verifiqué si era que el sistema no funcionaba pero sí sirve te dejo un ejemplo donde se implementó:

      http://senorjuventud.blogspot.com/2015/03/padre-salva-cria-cerdito-de-morir.html

      Lo puedes observar debajo del título de la entrada...

      Entonces concluyo que el sistema de calificaciones si sirve, pero, tu blog tiene una estructura un tanto distinta sólo se debe buscar donde se deje ver y queda..

      Saludos, ;)

      Borrar
  14. El editor de blogger rechaza el codigo, es mas despues de esa linea es imposible colar cualquier otra cosa, el problema es que al presionar el boton de apagado, la pagina no se guarda, pero la quitas y todo bien

    ResponderBorrar
    Respuestas
    1. Hola david Santillan No entiendo bien lo de presionar el botón de apagado (?)

      Saludos,

      Borrar
  15. hola, yo puse el código y no aparece nada :( creo que voy a sacarlo

    ResponderBorrar
  16. yo lo pegue en mi sitio web y no me funciona es solo para blog ? como se puede poner en un sitio web creado en webnode

    ResponderBorrar
    Respuestas
    1. No he probado webnode, pero, es lógico que el tutorial es dirigido para blogger :( así qe lo siento...

      Saludos,

      Borrar
  17. No funciona ya este codigo, deberias crear otro post relacionado. Saludos

    ResponderBorrar
    Respuestas
    1. Hola Legion voy a verificar que pasa en caso tal crearé una modificación en el post sobre este truco...

      SAludos,

      Borrar
  18. Hola, por lo que veo sacaste el codigo de aquí http://graddit.com/ratings-widget

    Puedes acomodar esta? https://i.gyazo.com/60f4aa4b971b8a7027b3e8e4d7592f42.png creo que es el mejor de todos, porfa he tratado de hacerlo yo, pero no he podido, un abrazo!!

    ResponderBorrar
    Respuestas
    1. Hola Alejandro del que me hablas a que plataforma pertenece para poder hacer el análisis...

      Saludos,

      Borrar
  19. Respuestas
    1. No hablaba de eso pero ya entiendo que deseas en la página de graddit está el que me dices que deseas, no se si la intentaste ya seleccionalo copia el código que te sale en el otro lado de tu gadget de puntuación escogido ahora en tu blog la plantilla busca:

      <div class='post-footer'>

      y Pegalo debajo pero debes verificar cuantos elementos de esos tienes repetidos y prueba en cada uno hasta que se visualice en las entradas de tu blog,

      Saludos,

      Borrar
  20. me refiero a cambiar los ID que da graddit por el que " + data:post.id'" lo he intentado pero nada :c

    ResponderBorrar
  21. si me entendió bro? si me puede ayudar?

    ResponderBorrar
  22. Respuestas
    1. HOla Alejandro perdón la tardanza tienes que buscar el identificador específico en la lista de identificadores de blogger en este caso para usarlo pero depende de cuál para incorporarlo...

      Saludos,

      Borrar
  23. Hola, no me funciona el codigo podrías por favor pasarme uno para mi pagina web desde ya muchas gracias.

    ResponderBorrar
    Respuestas
    1. Hola voy a verificar los códigos pues ya tiene 4 años el post.

      Saludos,

      Borrar
  24. como lo coloco en mi web ? ayuda¡¡¡ quiero colocarlo para cuando ellos califiquen 1 articulos solo lo agan 1 ves , y que salgan todas las personas que dieron clix a un estrella es de sir 10 4 estrellas 5 3 estrellas y asi , o si puede colocar , cuando el articulo sea bueno y jente vote sellenen las estrellas de amarillo , ese codigo no me agarro en mi web porque solo es html , quiero saver como pongo css espero respuestas o un codigo para mi gracias .)

    ResponderBorrar
    Respuestas
    1. Hola Dinero a Clicks el código no es sólo HTML también hay JS en él si no, no trabajaría en lo absoluto.

      Saludos,

      Borrar
  25. Yo acabo de ponerlo y aunque inicialmente no me funcionó en "post-footer" fui tanteando hasta que encontré la parte final de la entrada en mi plantilla. Te agradezco mucho porque luce muy bien, pero porqué sale un cuadro de anuncio cuando coloco el cursor sobre las estrellas?

    ResponderBorrar
    Respuestas
    1. Hola Moda Femenina, gracias por escribir, te salen anuncios porque seguramente la plataforma que ofrece el servicio los incorpora ya no es algo que dependa de mí o de sólo el script es como úsale gratis pero muestra anuncios nuestros.

      Saludos,

      Borrar
  26. Gracias,
    Funciona Super Bien.

    También pueden entrar directamente a la pagina y configurar las estrellas a su gusto.

    http://graddit.com

    ResponderBorrar

ESTAMOS EN: