Enhanced comments system – PHP, mySQL, jQuery and AJAX

facebookThis was long due but finally it’s here. I present to you the enhanced version of the Facebook comments system (which was published a month ago). A lot of readers asked for this version, so how can I say no to them. Without wasting any time let’s first check out what this system has to offer.

This version of the comments system has the following features.

  • Only logged-in users can post comment
  • User authentication via Facebook
  • Comments are now stored in the database
  • Ability for the user to delete the comments posted by them
  • User profile images via Gravatar
  • Completely AJAX based
  • Protection against CSRF (Cross site request forgery)
  • Secure sessions as sessions are stored in the database

 

Seems promising? It surely is. Here are the important links. Demo or Download.

 

Impressed with the demo? Now, let’s explore the system from the scratch. To begin with, the SQL structure is shown below.

The steps explained throughout this tutorial form the core of the comments system. I have tried to keep this system as simplified as I could. Please note that I have not explained you the process of Facebook authentication as I have already covered that over here. I hope that you guys going to like this effort of mine. Do let me know what you think of this in the comments.

  • Ajit

    very nice bro :) i loved it… ! are u making the wallscript too… with this ??

    • 69signals

      Hey mate!

      I will be releasing an MSN (Mini social network) script shortly. Subscribe to this blog via Feedburner to stay updated. :)

      • Ajit

        Thanks bro im waiting for your MSn version.. Hopefully how much time u’ll take it to make it..?? and im already subscribed..i guess!!

        • 69signals

          I am working to make that live in a weeks time.

          • Ajit

            thank you bro waiting for u :)

          • rajesh

            hi bro

            nice tutorial of enhanced comment system but when i try to download enhanced facebook like comment system the download file is not extracting displaying that file has been damaged please make me download link works fine so that i will download code.

          • 69signals

            Hey mate! Thanks for pointing out this. I have updated the download link. You can download it now without issues :)

          • eyter

            hello Akshit, what about to make a buttom “update” like facebook? you did the “delete” regards

          • Ajit

            hey bro is your MSN version is been completed ??

          • 69signals

            Hey! It will be released this Saturday (31st Aug).

          • Ajit

            Thanks bro will wait for your update :)

          • Ajit

            hey bro any updations ??

          • 69signals

            Hey mate! It’s little delayed. Final testing is going on. Should be up in a day or two. Just want to be 100% sure before making it available for download. :)

          • Ajit

            ok bro no issue… will wait for your update thanks :)

          • Ajit

            bro any update ?

  • rajesh

    hi bro enhanced tutorial nice tutorial i downloaded the code but and hosted in localhost in wamp but when i try to execute the code it shows empty page please tell me how to execute that code thanks

    • 69signals

      Hey!

      Have you connected to the database correctly? Database details are stored in the database.php file located in php/common folder. Change the details with yours.

      Paste the SQL structure at the beginning of the post in your database to create the required tables for the demo to work.

  • Leon Cunningham

    Hello I am trying to implement your demo but i got a ‘server error’ message after creating the database and navigating to the index.php

    • 69signals

      Can you paste the error message over here?

  • Fico

    Esto es una prueba

  • Behine Pardazaesh

    ok

  • Neocsatornaja

    Where is the “init.php”?
    I not saw in zip and your code

    • http://www.akshitsethi.me/ Akshit Sethi

      Hey!

      “init.php” is present where the “index.php” file is. That is root folder of the ZIP file.

      • Neocsatornaja

        Okey thx, i suggest edit your code,because now incorrect,,because the “init.php” not exist on zip, and if you try this code,that’s becouse fail and you get php error.

      • Neocsatornaja

        Or review your zip,because the init.php missing.

        • http://www.akshitsethi.me/ Akshit Sethi

          Hi,

          I checked the ZIP file. The file is present in the archive. Are you sure you checking the right file?

          • Neocsatornaja

            Yes,here the screenshot:

          • Neocsatornaja

            Can you send me just the missing file?

          • http://www.akshitsethi.me/ Akshit Sethi

            Can you try downloading the zip file again because init.php is present in the zip. But as you are saying it’s missing from your download, please let me know your email so that I can mail you the file.

          • Neocsatornaja

            Thx,this fixed my problem, I gess the rar is damged in past :)

          • Neocsatornaja

            Can you help me a little bit please?

            I’d like to intagrate this for my wordpress,but this a little complicated.

            I’d like to create a link for meta datas(like poseted on,posted in,category,etc)the link name is quick comment.

            When you click this,you can get this comment form and you can add comment for the wordpress comment database.
            This important:
            If you’re not login,must be register with wordpress register form.
            And if possible,the comment form try get the avatar picture from gravatar.com.
            Thx for your help and your time!

          • http://www.akshitsethi.me/ Akshit Sethi

            Hey!

            I wish I could spare time to help you out in this but I am fully occupied these days. Still, I will try to post a topic on WordPress integration in coming weeks.

          • Neocsatornaja

            Thank you for your help and time!
            You’re the best!
            Please write me a comment if you’re done,tha’s becouse i get new mail for your comment.

          • Neocsatornaja

            Hey!
            What’s up?
            You done it with this ?:$

  • Sendy Putra Wiratama

    Hello Bro, Can you enhanced again comment with images ^_^

    • http://www.akshitsethi.me/ Akshit Sethi

      Hey mate!

      I will add this feature to the next version of the comments system. Thanks for the suggestion.

      • Neocsatornaja

        And if you can,also add edit feautre for this grate comment system :D

    • Happy Chhor Lyheang

      I am support this too if next time version

      • Happy Chhor Lyheang

        But could you tell first ? how to we store in database when upload image and with title

        • Sendy Putra Wiratama

          may be base64?

  • Neocsatornaja

    Now I intalled this for my server and I gess I found a bug.
    When you click the login link,the link redirect to facebook,then redirect to your site.
    How can I fix this?

    • thisisull

      I stuck here too, something to do with the gravitar code pulling in http://www.akshitsethi.me/links that end up replacing the page with Akshit’s code and comments from facebook, but its a job to debug, I can’t get any further.

  • Negrodamus2011

    so you delete peoples comment even though they are warning others of a security risk. Nice way to be honest bro.

    • http://www.akshitsethi.me/ Akshit Sethi

      Hey!

      I have not deleted the comment. Must have been deleted by the user himself.
      I really appreciate your concern in this regard but I have not deleted anyone’s comment.

  • http://akheel.110mb.com mrakheel

    Hi Akshit,
    your script working fine.. but can u plz collapse comment plz..

  • Hôùssém Thë Ïlït

    Hi bro … I have a problem whith the script :/

    http://dz-lik.tk/com/

    • thisisull

      I’m having this same problem, anyone help on this?

  • Amjad Aziz

    I am trying Enhanced comments system using PHP, mySQL, jQuery, and AJAX. I get the following error.
    Given URL is not allowed by the Application configuration.: One or more of the given URLs is not allowed by the App’s settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App’s domains.

  • Dev

    What are the chances, you can add comment replies, collapsible comments,
    A ‘Like’ system for the comments.. and use the profile picture from FB
    when you connect *you can save it to your server after you connect with
    FB* Then the only other thing I would need for this to be perfect. is to
    make it object oriented, I think? with a Simple API. So We web
    developers can implement it on different parts of our page. i.e. On each
    file someone can download. on each picture. On each profile. Just
    anywhere we need comments, it’d be nice to be able to add it to that
    section.

    i dunno maybe with a function: Comments($contentType, $contentID, $userID)

    something like that. what do you think?

    • http://www.akshitsethi.me/ Akshit Sethi

      Hi,

      Thank you for the suggestion. It’s a nice one. I look forward to further develop this comments system but as of now don’t have much time. It will be good to see any member joining hand to speed up things. :)

  • Peter

    Hello, I am trying to use this comment system, but I have got error after I pressed log in link for adding comment. I am redirected but with this error message:
    “Given URL is not allowed by the Application configuration.: One or more
    of the given URLs is not allowed by the App’s settings. It must match
    the Website URL or Canvas URL, or the domain must be a subdomain of one
    of the App’s domains.”

    Did you ever fall in such a situation ? Many thanks.

  • neil4real

    Hi Akshit!

    I’m returning a blank page when i load init.php? I’ve connected to the database as the black screen does not appear. Any thoughts?