Sistema de valoracion con estrellitas

Sistema de valoracion con estrellitas

Sistema de valoracion con estrellitas
3.8 (75.59%) 145 votos

Hey! ¿Como estas? Espero que genial como yo 😀 El dia de hoy vamos a comenzar a realizar un sistema de valoracion con estrellitas que nos ayude a conocer lo mas valorado por nuestros lectores, mostrar snippets mas atractivos y demas.. pero bueno, eso mas adelante por que el dia de hoy comenzaremos con la visualizacion de las estrellitas en nuestro contenido, algo bastante facil de realizar. Todo lo que necesitaremos sera escribir algo de html, algo de css para darle estilo y un poco de javascript para darle un extra de interaccion con el usuario, vamos ya!! 😛

Lo que haremos

Podemos explicartelo pero mejor te lo mostramos para que sepas si te animas o no 😀

Si ves al inicio de este articulo podrás ver un conjunto de estrellas, cinco para ser exactos, las cuales sirven para que valores este contenido ( que espero y sean 5 estrellas ) pues es precisamente lo que haremos en este articulo hoy 😀

La base Html

eso es todo el html!

crear-un-sistema-de-valoracion-con-estrellitas-1


¿Sabías que?

¿Necesitas hosting wordpress? WebEmpresa te ofrece un servicio super rápido, excelente soporte en español y certificado SSL gratuito:

WebEmpresa

El estilo Css

Aquí si es un poco mas ..

crear-un-sistema-de-valoracion-con-estrellitas-2

y algo de funcionalidad con javascript..

Un extra con Javascript

Pero antes llama a jquery así..

y a probarlo se ha dicho..

crear-un-sistema-de-valoracion-con-estrellitas-3

Proximos pasos..

¿Y Ahora? Lo siguiente que haremos en el próximo tutorial sera guardar esta información en la base de datos para registrarla y leerla, también nos falta añadirle microformatos para hacer que google se entere de nuestro nuevo sistema de valoracion y lo muestre en los resultados de búsqueda ( si! esas estrellitas que tienen algunos resultados cuando buscas en google 😀 ).

Hasta la próxima!

Crear un sistema de valoracion con estrellitas

Sistema de valoracion con estrellitas
3.8 (75.59%) 145 votos

5
Dejar un comentario

avatar
3 Comment threads
2 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
4 Comment authors
Francisco Martinez GichJonathan MelgozaPamelajose Recent comment authors
  Subscribe  
Notify of
Francisco Martinez Gich
Guest
Francisco Martinez Gich

Me gusta tu post pero lo único que encuentro es aue si cae por aquí un novato este código no le va a servir para nada si no le indicas donde va todo, le hablas de CSS y pregunto donde va en el o , en el o , en o ]]> Perdona no quiero dar lecciones a nadie solo es un consejo para facilitar a los que empiezan ahora, muchas gracias.

Pamela
Guest
Pamela

Hola Jonathan, un placer saludarte, estuve leyendo y probando tu aporte, me funcionó muy bien la verdad, quisiera preguntarte por el siguiente tutorial en donde creas la base de datos, ya esta disponible??? Agradezco tu respuesta. Saludos

jose
Guest
jose

Genial gracias.. A la espera del siguiente