• We just launched and are currently in beta. Join us as we build and grow the community.

How To Create Facebook Style – Like Unlike Using PHP

neonfelix

Anime Frame-by-Frame Artist
N Rep
0
0
0
Rep
0
N Vouches
0
0
0
Vouches
0
Posts
46
Likes
81
Bits
2 MONTHS
2 2 MONTHS OF SERVICE
LEVEL 1 400 XP
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. <center

    >
  2. <table

    class

    =

    "demo-table"

    >
  3. <tbody

    >
  4. <tr

    >
  5. <th

    ><strong

    >

    Sourcecodes In Sourcecodester</

    strong

    ></

    th

    >
  6. </

    tr

    >
  7. <?php
  8. if(

    !empty(

    $result)

    )

    {
  9. $ip_address =

    $_SERVER[

    'REMOTE_ADDR'

    ]

    ;
  10. foreach (

    $result as $tutorial)

    {
  11. ?>
  12. <tr

    >
  13. <td

    valign

    =

    "top"

    >
  14. <div

    class

    =

    "feed_title"

    ><?php echo $tutorial[

    "title"

    ]

    ; ?></

    div

    >
  15. <div

    id

    =

    "tutorial-<?php echo $tutorial["

    tutorial_id"]; ?>

    ">
  16. <input

    type

    =

    "hidden"

    id

    =

    "likes-<?php echo $tutorial["

    tutorial_id"]; ?>

    " value="<?php echo $tutorial[

    "likes"

    ]

    ; ?>

    ">
  17. <?php
  18. $query =

    "SELECT * FROM ipaddress_likes_map WHERE tutorial_id = '"

    . $tutorial[

    "tutorial_id"

    ]

    . "' and ip_address = '"

    . $ip_address . "'"

    ;
  19. $count =

    $db_handle->

    numRows($query);
  20. $str_like = "like";
  21. if(!empty($count)) {
  22. $str_like = "unlike";
  23. }
  24. ?>
  25. <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

    >
  26. <div

    class

    =

    "label-likes"

    ><?php if(

    !empty(

    $tutorial[

    "likes"

    ]

    )

    )

    {

    echo $tutorial[

    "likes"

    ]

    . " Like(s)"

    ; }

    ?></

    div

    >
  27. </

    div

    >
  28. <div

    class

    =

    "desc"

    ><?php echo $tutorial[

    "description"

    ]

    ; ?></

    div

    >
  29. </

    td

    >
  30. </

    tr

    >
  31. <?php
  32. }
  33. }
  34. ?>
  35. </

    tbody

    >
  36. </

    table

    >
  37. </

    center

    >

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.

1_30.png


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.


Download
You must upgrade your account or reply in the thread to view hidden text.
 

450,053

322,753

322,762

Top