Sistema de ‘likes’ tipo Facebook Gratis
A veces en alguno que otro proyecto me han pedido un sistema de likes tipo Facebook. Como sabrás, Facebook no permite la customización de su botón, y no puedes ponerle estilos diferentes. Hacer un sistema de likes es sencillo, y lo podemos complicar todo lo que queramos, pero en este caso voy a explicar los pasos básicos.
1. Necesitaremos jQuery para la petición ajax.
Archivo: ./js/like.js
En esta petición haremos una llamada a un archivo php que es el que ejecutará las consultas necesarias. Por tanto, esta función lleva la id única que identifica aquel elemento que quieras valorar.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
//Make de ajax get request with the unique ID function sendToDatabase(id){ $.ajax({ url: 'like.php?id='+id, type: 'get', beforeSend: function () { $(".like"+id).html("..."); }, success: function (response) { $(".like"+id).html(response); } }); } |
2. Un par de funciones necesarias
Archivo: ./functions/functions.php
Para a) obtener la ip del visitante y así evitar el voto duplicado; y b) conseguir los likes que tiene en ese momento la id única
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
//Function to get the current IP function getIp() { $ip = $_SERVER['REMOTE_ADDR']; if (!empty($_SERVER['HTTP_CLIENT_IP'])) { $ip = $_SERVER['HTTP_CLIENT_IP']; } elseif (!empty($_SERVER['HTTP_X_FORWARDED_FOR'])) { $ip = $_SERVER['HTTP_X_FORWARDED_FOR']; } return $ip; } //Function to get the likes from the database function get_likes($id){ include('./config.php'); //en este archivo tenéis que hacer vuestra conexión a la base de datos $query2 = "SELECT * FROM likes WHERE id_unica='".(int)$id."' LIMIT 1"; $result2 = mysql_fetch_array(mysql_query($query2,$conexionbd)); if($result2['likes']==""){ return '0'; }else{ return $result2['likes']; } } |
3. Archivo que realiza la petición like
Archivo: ./like.php
Este archivo es el que es llamado por la petición ajax para modificar la base de datos e incrementar el número de likes. Si detecta que la ip ya ha votado, no incrementa el número.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 |
//include files include('./config.php'); include('./functions/functions.php'); //Get the IP $ip = getIp(); $query2 = "SELECT likes,ip FROM likes WHERE id_unica='".(int)$_REQUEST['id']."' LIMIT 1"; //and ip LIKE '%".$ip."|%' $result2 = mysql_fetch_array(mysql_query($query2,$conexionbd)); //Make the query if($result2['likes']!=""){ //The ip has a like for the ID if(strstr($result2['ip'], $ip.'|')==true){ echo ($result2['likes']); //The ip doesn't have a like but we have record on the database, save the ip and update the vote. }else{ $newcount=$result2['ip']."".$ip."|"; $query = "UPDATE likes SET likes=likes+1, ip='".$newcount."' WHERE id_unica='".(int)$_REQUEST['id']."'"; $result = mysql_query($query,$conexionbd); echo ($result2['likes']+1); } }else{ //The ip doesn't have a like and it doesn't have a record on the database, save the ip and update the vote. $query = "INSERT INTO likes (id_unica,likes,ip) VALUES (".(int)$_REQUEST['id'].",likes+1,'".$ip."|')"; $result = mysql_query($query,$conexionbd); echo ($result2['likes']+1); } |
4. Finalmente llamamos a las funciones
Archivo: ./index.php
Es este caso, tenemos que crear los enlaces que que actualizarán los votos de los elementos.
1 2 3 4 5 |
<!-- Este enlace incrementa el número de votos, y podemos generarlo con php cargando la id de forma automática. --> <a href="#" onclick="sendToDatabase(this.id); return false;" id="123">ID 123</a> <br/> <!-- Y aquí es importante la clase -like + ID- ya que se usará para identificar el campo donde se mostrará el número de likes --> Votos <span class="like123"><?php get_likes(123); </span> |
Y con todo esto ya tienes todo lo necesario.
una pregunta, como puedo hacer para no usar sql, que se guarden las ip en un .txt ?
Muchas gracias, grandioso tutorial
Hola Gabriel. En este caso, para no usar la base de datos, tendrás que usar algunas de las funciones php para escribir en archivos, puedes ver muchos ejemplos en php.net sobre file_put_content file_get_content fopen fwrite o fclose.
hola tengo un problema al ponerlo en mi sistema de posts, me tira un error Cannot redeclare get_likes() (previously declared in D:\xampp\htdocs\sistema\functions\functions.php:5) in D:\xampp\htdocs\sistema\functions\functions.php on line 12
lo que entiendo es que no se puede redeclarar la misma varible 2 veces pero necesito para varios posts alguna ayuda? :c
no me sirve si es solo para uno
Hola Ivo. Ese error es porque estás cargando la misma función varias veces. Es decir estás cargando varias veces el archivo functions.php. Revisa esto primero, y después tienes una función PHP que te podría servir: http://php.net/manual/es/function.function-exists.php
Holaa! como le haces para que sin necesidad de recargar, la pagina te muestre el numero de votos en custion. He visto la funcion get_likes pero como e ue sin recargar se ejecuta esa consulta? [correoborrado], por si alguna respuesta, saludos!
Hola Deimer, pues son consultas con ajax, es decir, hace unos años todo era más complejo, hoy día es muy sencillo, de cara al usuario es muy fácil, pero de cara al programador implica más código. Échale un vistazo aquí: https://www.w3schools.com/xml/ajax_intro.asp