EasyComment: Easily add comment function to your web page
Follow on Twitter

EasyComment jQuery Plugin

Allowing visitors to leave comment on your web page can never be easier with the help of EasyComment. EasyComment is a lightweight yet full functional jQuery plugin that can be easily embedded in any web page to allow visitors to leave comments on that page. No database is required. EasyComment also support multi section comments within one page. EasyComment has the following features:

EasyComment Document


How to setup/use EasyComment?
Suppose your domain is http://www.your-domain.com/, and EasyComment will be installed right under the root directory.
  1. Login to your web server and create a folder under your domain directory called easy-comment
  2. Download the source code from here and upload the following files to easy-comment:
    • jquery.easy-comment.min.js
    • ec-comment.php
    • ec-moderator.php
    • ec-dashboard.html
    • ec-comment.png
    • ec-close_box.png
  3. Within <header> section of your web page, add the following two lines: 
    <script type="text/javascript" 
        src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" 
        src="http://www.your-domain.com/easy-comment/jquery.easy-comment.min.js"></script>
  4. Within your web page, add <div> element to the right place as a comment container. For example: 
    <div id="my-comment"></div>
    For comment container, you should always give an ID attribute so that you can seperate it from others when you are in the dashboard.
  5. To use EasyComment, you will have to enable it within jQuery.ready() function. 
    jQuery(document).ready(function(){
   $("#my-comment").EasyComment();
});
    Or specify the EasyComment path explicitly if you are not install EasyComment under root directoy 
    jQuery(document).ready(function(){
   $("#my-comment").EasyComment({
      path:"/path-to-easy-comment/easy-comment/"
   });
});
    Notice the path here should be the absolute path to the folder where you install EasyComment. For example, if your domain is https://www.jswidget.com/, and you create a folder called my_comment under the domain root folder. You should be able to access that folder by typing https://www.jswidget.com/my_comment in the browser's address bar. The path value should then be "/my_comment/".
  6. Below is a functional template file. 
    
<html>
  <head>
    <title>EasyComment Sample</title>
    <meta http-equiv="X-UA-Compatible" content="IE=9" />
    <script type="text/javascript" 
            src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
    <script type="text/javascript" 
            src="./easy-comment/jquery.easy-comment.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function(){
    // Your other javascript code if any

    $("#id_of_your_comment_container").EasyComment({
      path:"/lab/easy-comment/", //Change it to the folder where you put the easycomment files
      moderate:false,
      maxReply:5
    });
    // Your other javascript code if any
    });
    </script>
  </head>
  <body>
    <div id="id_of_your_comment_container" style="width:1024px;height:800px;"></div>
  </body>
</html>
    View Example
  7. You can now start using EasyComment.
 
OptionsDefault valueDescription
path /easy-comment/ Set the path where the EasyComment is installed.
maxReply 5 The depth of reply for individual comment. 0 will disable reply to any comment.
moderate false False to publish the comment immedietely, True to wait for approval. If moderate is set to true, you should change the moderator email address in ec-comment.php to your address so that you can receive notification when a new comment is posted.
height null If height is null, the EasyComment will use the height set in the container element. If height is a numeric value, the container height will be set to this value. Scollbar will show if needed.
countPerPage 10 Number of comments displayed per page. If countPerPage = 0, there will be no paging buttons, all the comments will be shown in current page.
hasSubject false True to have subject field in the comment form.
hasEmail false True to have email field in the comment form.
hasSite false True to have web site field in the comment form.

Source Code Download

Do you like EasyComment?

EasyComment is distributed under "New BSD License", so you can use it everywhere, even in commercial applications. If you appreciate my work, you can support it by making a small donation:

Care to leave your comment?