bueno voy a copiar aki el manual del sistema de ranking o votacion por estrellas que del que estais hablando lo copio pero le e arreglao algunos fallos en los nombres de los archivos y en el nombre de la base de datos que seguramente es lo que esta dando problemas luego pongo mi duda el sobre este sistema de votacion ranking.
1- Crear una imágen
Es necesario una imagen con 3 estrellas en diferentes tonalidades. El fondo de la imágen debe ser igual al fondo de la página o capa donde se utilizará al final de este manual dejo el enlace de donde lo saque yo ahi podeis descargaros la imagen o incluso todos
los archivos del manual mismo podeis darle a guardar como en la imagen y con cualquier programa modificais el fondo es muy sencillo la direccion del tutorial original y donde teneis una imagen con las estrellas es http://www.plantillaswebgratis.info/recursos/rank.php . Si se desea modificar el tamaño de la imágen recordar que se deberá cambiar la especificación del tamaño en el archivo css (rating.css).
todos los archivos k creemos ahora se copia en el bock de notas y se guardaran como y el nombre que esta en el titulo.
2- Archivo css (rank.css)
Código CSS:
Ver original.rank ul {
list-style: none;
margin: 3px;
padding: 0px;
width: 125px;
height: 25px;
position: relative;
background: url(rank.gif) top left repeat-x;
margin-left:0px;
}
.rank li {
padding: 0px;
margin: 0px;
float: left;
}
.rank li.current-rating {
background: url(rank.gif) left bottom;
position: absolute;
height: 25px;
display: block;
text-indent: -9000px;
z-index: 1;
}
.rank li a {
display: block;
width: 25px;
height: 25px;
text-decoration: none;
text-indent: -9000px;
z-index: 20;
position: absolute;
padding: 0px;
background-image: none;
}
.rank li a:hover {
background: url(rank.gif) left center;
z-index: 1;
left: 0px;
}
.rank a.star-1 {left: 0px;}
.rank a.star-1:hover {width: 25px;}
.rank a.star-2 {left: 25px;}
.rank a.star-2:hover {width: 50px;}
.rank a.star-3 {left: 50px;}
.rank a.star-3:hover {width: 75px;}
.rank a.star-4 {left: 75px;}
.rank a.star-4:hover {width: 100px;}
.rank a.star-5 {left: 100px;}
.rank a.star-5:hover {width: 125px;}
Código fuente del ejemplo (index.html)
Código HTML:
Ver original <li class="current-rating" style="width:100px;">Currently 4/5 Stars.
</li> <li><a href="#" title="dar 1 estrella de 5" class="star-1">1
</a></li> <li><a href="#" title="dar 2 estrellas de 5" class="star-2">2
</a></li> <li><a href="#" title="dar 3 estrellas de 5" class="star-3">3
</a></li> <li><a href="#" title="dar 4 estrellas de 5" class="star-4">4
</a></li> <li><a href="#" title="dar 5 estrellas de 5" class="star-5">5
</a></li> Rated
<b>4
</b>/5 estrellas (269 votos)
con este archivo solo podras probar el efecto de las estrellas sin necesidad de la base de datos pero no
es el codigo final para la web solo es de prueba.
3- Creamos la Base de datos, tablas y registros
Ahora ya tenemos el aspecto gráfico de nuestro sistema de votos por estrellas, pero aún no realiza ninguna votación. Necesitamos almacenar las votaciones de los usuarios y para ello lo primero que deberemos hacer es una base de datos como se indica aqui abajo.
3.1- Crear la base de datos con el nombre bd_rank y entramos a ella con use.
abrimos la consola de mysql y ponermos:
3.2-se puede crear nombre y usuario para esta base de datos yo en mi caso no pongo.
3.3-se crean las tablas y registros necesarios:
Tabla rank: Esta tabla almacena el ranking de la página, sección o noticia que se reankea. Esta tabla contiene 3 campos. (id, media, votos), el primer identifica la página o sección que se quiere rankear, el campo media, contiene la media de votos (1 al 5) y el campo votos, el total de votos recibidos.
Tabla votos_usuarios: Esta tabla almacena temporalmente el identificador de la página o sección votada, el identificador del usuario (IP del ordenador del usuario) y la fecha en que se voto. Esta contiene datos temporales porque cada vez que un usuario realice un voto, comprobará los regístros y eliminará los que esan diferentes a la fecha actual y evitará que un mismo usuario vote a una misma página o sección más de una vez.