Hace poco veíamos cómo crear un sistema de calificación por estrellas con CSS.

Hoy, eso ha cobrado un nuevo nivel: mi primer plugin para WordPress.

Es un plugin muy sencillo de usar, con opciones fáciles, y muy ligero. Podéis verlo en funcionamiento en este mismo post (y en el resto) ;)

Instalación

1- Instalar el plugin

Actualización: Ahora el plugin está en el directorio oficial de WordPress, así que ya podéis instalarlo buscando EC-Stars-Rating desde vuestro escritorio, o descargarlo desde la página oficial. También podéis calificarlo si queréis ;).

Luego tenéis que activarlo, pero ya sabéis cómo va eso, no?

2- Mostrar las estrellas

Ahora sólo falta que en vuestro tema pongáis (allá donde queráis que aparezca, probablemente en single.php o content-single.php) la siguiente línea de código:

<?php 
if(function_exists('ec_stars_rating')) {
	ec_stars_rating();
}
?>

Listo! He pensado en incluirlo en el directorio de WordPress, pero primero tengo que tener una página de documentación (o sea esta).

Configuración

Básicamente el plugin tiene una página (en Ajustes » EC Stars Rating), donde podéis escoger:

  • Tamaño de las estrellas: El valor de la propiedad font-size de CSS para las estrellas (si las estrellas son más grandes o pequeñas).
  • Colores: El color de las estrellas por defecto, de las estrellas votadas (el valor actual) o al pasar el ratón por encima, y el color de las estrellas al hacer click.
  • Mostrar los votos: Si el número de votos y votantes se debería de mostrar.
  • Usar microformats: Si se debería usar microformats o microdata. Con microformats aparece un link al post, y consigue que salgan las famosas estrellas en google.
  • Usar jQuery: He hecho una versión del script sin jQuery, para aquellos que no lo usen (el 95% de los sitios de WordPress lo usa, pero el mío no, así que… ;)). Sin jQuery no hay soporte para IE7, pero esto a mí no me parece ningún problema…

Soporte

Hasta que este plugin sea aceptado en el directorio de WordPress, cualquier problema (espero que pocos), lo podréis comentar aquí.

Descarga

78 pensamientos en “Calificación con estrellas para WordPress: EC-Stars-Rating

  1. Bitacoras.com
  2. Imagen de Miguel ÁngelMiguel Ángel el dijo:

    ¡Eres grande Emilio! El plugin me ha sido de gran utilidad. Muy recomendable para aquellos que quieren permitir que las entradas de su bitácora sean calificadas por los visitantes. Un plugin limpio, con un peso ligero, simple y práctico. Mucho ánimo para seguir iluminando un camino que cada vez se hace menos estrecho.

    MUCHAS GRACIAS.

    Un abrazo, amigo.

  3. Imagen de Alejo Méndez el dijo:

    Emilio, yo te quería preguntar si hay una manera de agregar los efectos a:hover y a:link varias veces. Es decir, rojo el título de las entradas, pero en la sidebar que el archivo o las categorías se vean celestes. Entiendes ¿?

    Gracias y perdón por colocarlo en este post.

  4. Imagen de DaniDani el dijo:

    Hola.
    El plugin es excelente.
    Me preguntaba si sería posible agregar una función para visualizar las estrellas mediante shortcode y no modificando el código del tema.
    Además, no he encontrado widget que pueda mostrar los posts más votados.

    • Imagen de Emilio Cobos Álvarez el dijo:

      Hey! Esa es una idea genial (ambas, en realidad).

      Ahora mismo no puedo hacerlo por falta de tiempo (ni siquiera he podido actualizar el post para decir que ya está en el directorio oficial).

      Me pongo en cuanto pueda, estáte atento al feed para recibir actualizaciones.

      • Imagen de DaniDani el dijo:

        Perfecto.
        Las dos funciones podrían ser muy útiles, ya que este es el plugin de calificaciones más rápido que he probado.
        Estaré atento a las próximas publicaciones del directorio.
        ¡Buen trabajo!

      • Imagen de jona el dijo:

        Hola emilio, antes qué nada gracias por responder. he puesto el codigo pero aun asi, sigue sin funcionar. La verdad que no se qué puede ser, ademas las estrellas aparecieron en google y desaparecieron . :/ – dejo link del sitio.

  5. Imagen de Christian el dijo:

    Hola capo, como andás?
    te quiero hacer una consulta, estoy probando tu sistema de calificación en una página que tiene un fondo oscuro, y noté que en “stand-by” te muestra el promedio de voto en las estrellas poniendo un cuadrito transparente sobre las estrellas no alcanzadas.
    Hay manera que en el estado normal muestre el promedio de votos tal cual se vé al estar haciendo hover por ejemplo?

    Muchas gracias, espero haberme explicado
    Abrazo, y Felicitaciones por tu plugin, realmente de todos los que probé es el que mejor resultado me dio por su simpleza

    Saludos!

  6. Imagen de Kikobeats el dijo:

    Hola!

    El plugin me parece muy bueno y me ha venido como anillo al dedo. ¡Felicidades!

    Me gustaría poder explotarlo un poco y, por ejemplo, obtener los post más puntuados en un intervalo de tiempo (Más puntuado de la semana, del mes, del año….)

    ¿Crees que podría hacerlo?

    He visto plugins en donde puedes ajustar esa opción en el shortcode (claro que eran plugins que iban destinados a otro tipo de tareas, por ejemplo, un calendario). Como he visto que este plugin no tiene nada parecido y en principio no sé cómo podría hacerlo he decidido preguntarte directamente :)

    Un saludo!

    • Imagen de Emilio Cobos Álvarez el dijo:

      Siento por haber tardado en responder (estaba con la selectividad).

      Ahora mismo sólo está la opción de usar los más puntuados en general (en la última versión).
      Hacer intervalos llevaría a la sobrecomplicación del plugin (tener que guardar fechas de los votos…), que por su finalidad (ser ligero) y estructura actual no podría ser llevado a cabo.

      Lo siento, pero eso ahora no está en mis planes. No obstante, es código libre, así que cualquiera podría modificarlo a su gusto.

  7. Imagen de ElenaElena el dijo:

    Hola!
    Acabo de instalar tu plugin que me parece genial y sencillo, pero me ha surgido una duda, ¿sería posible mostrar los votos en una sección de últimos post? En plan el título, la descripción y la votación…

    Saludos y enhorabuena por el plugin! :)

  8. Imagen de ElenaElena el dijo:

    Muchas gracias por contestar.

    Me surge otra duda, las valoraciones se almacenan en base de datos? Estoy buscando la forma de acceder a ellas de forma externa :P

    Gracias!

  9. Imagen de StevenSteven el dijo:

    tengo un problema con este plugin lo instalo en una web que estoy creando pero al momento de configurar las opciones de tamaño y color el plugin no toma los cambios, ademas no anda el plugin no cuenta los votos

    Estoy manejando la version de jquery 1.7.1, he probado con otras versiones y aun no funciona, y no me toma los valores que dejo en las opciones de configuracion del plugin
    la web que estoy creando actualmente esta en este link:

    http://interactiva.net.co/chicas/?p=43
    aca tengo una prueba de un post con el plugin y ya podran darse cuenta que no funciona

    Agradezco me puedan ayudar!!

  10. Imagen de AutoCultivo el dijo:

    Gracias Emilio , va de lujo, ligero , sencillo y con microformats. Los he probado todos y me quedo con este Made in Spain :) , el resto eran monstruos muy pesados que me relentizaban la web 1 segundo.

    Mi web consume con bbpress y buddypress 55 mb de Ram , ¿ que te parece, bien o es mucho? 70 queries.

    Un saludo , buen verano

    • Imagen de Emilio Cobos Álvarez el dijo:

      Hombre, 70 queries en principio es mucho, pero claro, son un montón de datos a manejar… La cantidad de ram que consuma no sólo depende del programa (que sí, bbpress y buddypress son programas muy pesados, al igual que wp) sino también del servidor, y dependiendo de sus características puede ser muy pesado o muy poco… Sin duda depende de las características de la web.

  11. Imagen de LarsLars el dijo:

    Hi Emilio,
    Thanks for a excellent plugin. Can you please tell me how I manage to center-align the rating stars under my posts? Right now they are left-aligned.

    Best regards,

  12. Imagen de jairo lopezjairo lopez el dijo:

    saludo me pasa que istalo el plugin,pero me sale en la parte de arriba de titulo de la entrada y no abajo qu es lo que esta pasando gracias por su pronta respuesta

  13. Imagen de fernando el dijo:

    Emilio! primero decirte que eres un genio! y segundo tengo algunas dudas para hacer funcionar este sistema de votación. Estuve viendo el post de votación con css, seguí los pasos, y se ve bien en mi sitio (que por cierto no tienenada de wordpress) y ahora me encuentro con este plugin de wordpress, mi duda es si puedo hacerlo funcionar en mi sitio web sin wordpress o bien si me podrias explicar (si es sencillo) como hacer para ponerlo en mi sitio! saludos, no se si me expresé bien y si me podes interpretar ya que no soy muy hábil con esto de el wordpress, de todas formas saludos y seguí así!!

  14. Imagen de IvanIvan el dijo:

    Emilio, muy buen plugin, muchas gracias por compartirlo.

    Te hago una pregunta, creo que no tiene esta función, quiero ordenar en el index los post mas votados. No tiene esta función no ?

  15. Imagen de Paloma el dijo:

    Hola Emilio,

    Gracias por el plugin. Acabo de instalarlo y funciona muy bien, pero no consigo que aparezcan las estrellas en Google. He seleccionado microformats en los ajustes, pero siguen sin salir. ¿Tengo que hacer algo más?
    Saludos
    Paloma

  16. Imagen de VíctorVíctor el dijo:

    Hola! Antes de nada, darte la enhorabuena por el plugin, es fantástico y super sencillo de usar incluso para los que hemos empezado hace poco a probar este tipo de cosas jeje. Se agradece mucho el trabajo dedicado.

    Verás, después de varios días usándolo sin problema se me han descolocado las estrellas. Ahora en vez de aparecer en línea aparecen en columna. No entiendo por qué puede ser, no he tocado nada del código, incluso he probado reinstalándolo por completo… Y no cambia nada.

    http://www.ciudadesyrincones.com/
    Este es el blog en cuestión

    Gracias de antemano por la ayuda!

    • Imagen de Emilio Cobos Álvarez el dijo:

      Lo primero, siento haber tardado en contestar. Ahora al grano:

      Estás usando el método del shortcode, me equivoco? En ese caso, se aplica la función wpautop por defecto, generando párrafos que hacen que veas las estrellas en líneas diferentes.

      Lo que tienes que hacer es añadir al archivo functions.php de tu tema:

      remove_filter( 'the_content', 'wpautop' );
      add_filter( 'the_content', 'wpautop' , 99);
      add_filter( 'the_content', 'shortcode_unautop',100 );

      Con eso debería de valer. Estoy planteándome ponerlo por defecto en el plugin, aunque al poder interferir con otros shortcodes, es posible que no lo haga.

      • Imagen de VíctorVíctor el dijo:

        No te preocupes, se agradece mucho la respuesta.

        Si, estoy usando shortcode (porque lo quiero tan solo en algunas páginas), y tras añadir el código en el archivo functions de mi tema, sigue saliendo igual. Por lo que veo usando el firebug, se crean unos despues del link de cada estrella, y es eso lo que hace que salten de párrafo.
        Como te dije, llevaba tiempo usándolo sin problema, y creo que se fastidió al actualizar la versión de wordpress… ¿Ha perdido compatibilidad?

        Muchas gracias, un saludo.

  17. Imagen de JuananJuanan el dijo:

    Buenas crack!! Me preguntaba si este plugin lo puedo adaptar para votar fotos y que aparezcan las mas votadas, es para hacer concurso de fotos. He probado nextgen voting pero esta absoleto y no encuentro nada que sirva. Gracias.

  18. Imagen de NikiNiki el dijo:

    Hi Emilio,

    Thanks for this nice plugin.

    I want to know how I can display the rating and some preceding text on the same line, for example: Rating: *****

    Right now the stars appear on a separate line.

    Regards,

    Niki

  19. Imagen de Lars el dijo:

    Hi Emilio,
    Something new has appeared after my update to 1.0.5. Suddenly, the post title have started to show up after the stars. This doesn’t look very good. I also having trouble with the translation. Can you please help me out?

  20. Imagen de MARIA SANCHEZMARIA SANCHEZ el dijo:

    Hola Emilio:
    Excellente plugin, pero nos gustaría saber si existe la opción de que aparezca en la parte superior de nuestros posts. Parece que podría ser más visible. Gracias y enhorabuena otra vez.

  21. Imagen de SandroSandro el dijo:

    Hola emilio, muchas gracias por las estrellas, funcionan muy bien!

    Tengo una duda…

    Coloco las entrellas en el index de mi pagina, eso quiere decir que las estrellas se mostrarán debajo de cada título del post, habrá alguna posibilidad que al entrar al post también me muestre las estrellas con sus actuales votaciones que se dieron en el index?

  22. Imagen de Miguel AngelMiguel Angel el dijo:

    Hola Emilio.
    Genial el plugin, simple, claro y directo.. muy bueno. Hay posibilidad de hacer otra forma que no sea una estrella?

    Gracias por adelantado.

  23. Imagen de MauricioMauricio el dijo:

    Excelente, funciona a las mil maravillas.
    Solo una pregunta, como se controlan los votos para que un usuario no pueda votar varias veces al mismo post. Lo pregunto ya que tengo que hacer una pequeña modificación.
    Muchas gracias por el aporte de verdad que esta excelente.

  24. Imagen de Daniel P Z el dijo:

    Hola amigo, muchas gracias por tu plugin, funciona excelente, pero tengo un par de dudas, el CSS que se integra directamente en el HEAD ” ….” , es simple y llanamente para que el plugin pueda escoger los colores definidos en las opciones?,. osea, yo puedo modificar el plugin para que no integre ese CSS en mi head, y definirlo desde mi propio style.css?, y otra cosa más, espero no andarte de pesado :) ; noto que en el FOOTER se agrega la llamada al jquery que necesita para poder funcionar el plugin además de los mensajitos que necesita, me pregunto si es necesario que este en el footer?, puedo cambiarlo para que aparesca en el header?, habria algún problema?, el motivo de esto es porque la WW3 validator me tira error, ya que como es un script me pide que lo ponga dentro de “”

    Espero con ancias tu respuesta, muchas gracias por el plugin

  25. Imagen de lisandrolisandro el dijo:

    Es un excelente plugins, pero tiene un detalle que estaria bueno solucionarlo, en la interface con un browser de chrome en la esquina superior de la estrella se deforma la imagen sin poder visualizarla correctamente son un par de pixeles, seria recomendable modificarla, lo provee en IE, FIRE y funcionan OK

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

Puedes usar las siguientes etiquetas y atributos HTML:<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre data-language=""> <ul> <ol> <li>
Para poner código usa <pre data-language="[lenguaje]"><code>[código]</code></pre>, y no olvides escapar el HTMl.