Skip to main content

How To Create Facebook Style – Like Unlike Using PHP


If you are looking for a source code on How To Create Facebook Style – Like Unlike Using PHP then you are at the right place. This sample work is very familiar to us. Today, most of us are using Facebook, and the interesting part in Facebook is to like the post of your friend, family, and etc.

In this article, we create a simple like unlike using PHP. For updating likes count in our database, we used jQuery. And, you can be used this source code in your simple SNS or it's called a Social Networking Site.

HTML Like Unlike Form

This source code where you can like and unlike the posts.

  1. <table class="demo-table">
  2. <tr>
  3. <th><strong>Sourcecodes In Sourcecodester</strong></th>
  4. </tr>
  5. <?php
  6. if(!empty($result)) {
  7. $ip_address = $_SERVER['REMOTE_ADDR'];
  8. foreach ($result as $tutorial) {
  9. ?>
  10. <tr>
  11. <td valign="top">
  12. <div class="feed_title"><?php echo $tutorial["title"]; ?></div>
  13. <div id="tutorial-<?php echo $tutorial["tutorial_id"]; ?>">
  14. <input type="hidden" id="likes-<?php echo $tutorial["tutorial_id"]; ?>" value="<?php echo $tutorial["likes"]; ?>">
  15. <?php
  16. $query ="SELECT * FROM ipaddress_likes_map WHERE tutorial_id = '" . $tutorial["tutorial_id"] . "' and ip_address = '" . $ip_address . "'";
  17. $count = $db_handle->numRows($query);
  18. $str_like = "like";
  19. if(!empty($count)) {
  20. $str_like = "unlike";
  21. }
  22. ?>
  23. <div class="btn-likes"><input type="button" title="<?php echo ucwords($str_like); ?>" class="<?php echo $str_like; ?>" onClick="moreLikes(<?php echo $tutorial["tutorial_id"]; ?>,'<?php echo $str_like; ?>')" /></div>
  24. <div class="label-likes"><?php if(!empty($tutorial["likes"])) { echo $tutorial["likes"] . " Like(s)"; } ?></div>
  25. </div>
  26. <div class="desc"><?php echo $tutorial["description"]; ?></div>
  27. </td>
  28. </tr>
  29. <?php
  30. }
  31. }
  32. ?>
  33. </tbody>

jQuery Script Like Unlike

This script will be run after you click the Like Unlike Icon.

  1. <script>
  2. function moreLikes(id,action) {
  3. $('.demo-table #tutorial-'+id+' li').each(function(index) {
  4. $(this).addClass('selected');
  5. $('#tutorial-'+id+' #rating').val((index+1));
  6. if(index == $('.demo-table #tutorial-'+id+' li').index(obj)) {
  7. return false;
  8. }
  9. });
  10. $.ajax({
  11. url: "more_likes.php",
  12. data:'id='+id+'&action='+action,
  13. type: "POST",
  14. beforeSend: function(){
  15. $('#tutorial-'+id+' .btn-likes').html("<img src='LoaderIcon.gif' />");
  16. },
  17. success: function(data){
  18. var likes = parseInt($('#likes-'+id).val());
  19. switch(action) {
  20. case "like":
  21. $('#tutorial-'+id+' .btn-likes').html('<input type="button" title="Unlike" class="unlike" onClick="moreLikes('+id+',\'unlike\')" />');
  22. likes = likes+1;
  23. break;
  24. case "unlike":
  25. $('#tutorial-'+id+' .btn-likes').html('<input type="button" title="Like" class="like" onClick="moreLikes('+id+',\'like\')" />')
  26. likes = likes-1;
  27. break;
  28. }
  29. $('#likes-'+id).val(likes);
  30. if(likes>0) {
  31. $('#tutorial-'+id+' .label-likes').html(likes+" Like(s)");
  32. } else {
  33. $('#tutorial-'+id+' .label-likes').html('');
  34. }
  35. }
  36. });
  37. }
  38. </script>

And, this is the result.

Result

Share us your thoughts and comments below. Thank you so much for dropping by and reading this tutorial post. For more updates, don’t hesitate and feel free to visit this website more often and please share this with your friends or email me at [email protected]. Practice Coding. Thank you very much.

Note: Due to the size or complexity of this submission, the author has submitted it as a .zip file to shorten your download time. After downloading it, you will need a program like Winzip to decompress it.

Virus note: All files are scanned once-a-day by SourceCodester.com for viruses, but new viruses come out every day, so no prevention program can catch 100% of them.

FOR YOUR OWN SAFETY, PLEASE:

1. Re-scan downloaded files using your personal virus checker before using it.
2. NEVER, EVER run compiled files (.exe's, .ocx's, .dll's etc.)--only run source code.

Add new comment

CAPTCHA
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.