Comment System Using PHP & MySQL

In this blog, we will learn how to make Comment  System in PHP & MySQL. On the Blog page we mostly see a comment system on the website in this blog we will create a nested comment and reply system by using simple steps:

Step1: Create Database comment_system_php

CREATE DATABASE comment_system_php;
 

Step2: Create table blogs

CREATE TABLE `blogs` (
  `id` int(11) NOT NULL,
  `addeddate` date DEFAULT NULL,
  `title` text COLLATE utf8mb4_unicode_ci DEFAULT NULL,
  `description` longtext COLLATE utf8mb4_unicode_ci DEFAULT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;
 


Step3:
Create table comments

CREATE TABLE `comments` (
  `id` int(11) NOT NULL,
  `blog_id` int(11) DEFAULT NULL,
  `comment_id` int(11) DEFAULT NULL,
   `name` varchar(100) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
  `description` longtext COLLATE utf8mb4_unicode_ci DEFAULT NULL,
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;


Step4:
Create connection.php file

<?php
$servername = "localhost";
$username = "root";
$password="";
$db = "comment_system_php";
 
// Create connection
$conn = mysqli_connect($servername, $username, $password,$db);
 
// Check connection
if (!$conn) {
  die("Connection failed: " . mysqli_connect_error());
}
 
?>
 


Step5:
Create index.php file

<?php
include('connection.php');
?>
 
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Blogs</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>
<body>
 
<div class="container">
  <h2>All Blogs</h2>
  <p>To Comment on blog please click on view detail link.</p>           
  <table class="table table-striped">
    <thead>
      <tr>
        <th>Sr.No</th>
        <th>Title</th>
        <th>Description</th>
                        <th>View</th>
      </tr>
    </thead>
    <tbody>
           
            <?php
           
            $sql="select * from blogs";
            $result=mysqli_query($conn,$sql);
           
           
            $i=1;
            while($data=mysqli_fetch_array($result))
            {?>
      <tr>
        <td><?php echo $i;?></td>
        <td><?php echo $data['title'];?></td>
        <td><?php echo $data['description'];?></td>
                        <td><a href="blog-detail.php?blogid=<?php echo $data['id'];?>">view detail</a></td>
      </tr>
            <?php $i++; } ?> 
    </tbody>
  </table>
</div>
 
</body>
</html>


Step6:
Create blog-detail.php file

<?php
include('connection.php');
 
 
function showComments()
{
            $comment="";
           
            $comment.=commenttree();
           
            echo $comment;
}
 
function commenttree($parentid=NULL)
{
            $comments='';
            $sql='';
           
           
            if(is_null($parentid))
            {
            $sql="select * from comments where comment_id='0'";
            }
           
            else
            {
                        $sql="select * from comments where comment_id=$parentid";
            }
           
           
            $result=mysqli_query($GLOBALS['conn'],$sql);
           
            while($data=mysqli_fetch_array($result))
            {
                        // echo $data['comment_id'];
                       
                        // echo '<pre>';
                        // print_r($data);
                       
                       
                        if($data['comment_id']=='0')
                        {
                         $comments.='
                         <div class="media border comment0 p-3">
    <div class="media-body">
      <h4>'.$data['name'].'<small><i> Posted on February 19, 2016</i></small></h4>
    
             '.$data['description'].'
     
              <p><a href="#postcomment" class="btn btn-primary mt-2 float-right" onclick="reply('.$data['id'].')">reply</a></p>
             </div>
             </div>
              ';
                        }
                        else
                        {
                                    $comments.='<div class="media border reply p-3">
    <div class="media-body">
      <h4>'.$data['name'].'<small><i> Posted on February 19, 2016</i></small></h4>
    
             '.$data['description'].'
     
              <p><a href="#postcomment" class="btn btn-primary mt-2 float-right" onclick="reply('.$data['id'].')">reply</a></p>
              </div>
              </div>
              ';
                        }
             
                       
                                   
                                   
 
        $comments.='<div class="media  parent p-3">
    <div class="media-body">'.commenttree($data['id']).'</div></div>';
 
                        }
           
           
           
           
           
            return $comments;
 
}
 
 
 
$blogid=$_GET['blogid'];
 
if(isset($_POST['submit']))
{
           
            if(empty($_POST['commentid']))
            {
                        $commentid='0';
            }
            else
            {
                        $commentid=$_POST['commentid'];
            }
           
            $sql="insert into comments (blog_id,comment_id,name,description) values ('".$blogid."','".$commentid."','".$_POST['name']."','".$_POST['description']."')";
           
            $result=mysqli_query($conn,$sql);
           
            if($result)
            {
                        echo '<script>alert("comment added successfully, we will published after verify your comment.")</script>';
            }
           
            else
            {
                        echo "Error: " . $sql . "<br>" . mysqli_error($conn);
            }
           
}
 
 
?>
 
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Blog Detail</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</head>
<body>
 
<div class="container">
<div class="col-lg-12">
<?php
$sql="select * from blogs where id=$blogid";
$result=mysqli_query($conn,$sql);
$data=mysqli_fetch_array($result);
?>
 
<h2><?php echo $data['title'];?></h2>
<p><?php echo $data['description'];?></p>
</div>
 
<div class="col-lg-12">
<h4>Comments</h4>
 
            <?php showComments(); ?>
           
 
</div>
 
<div class="col-lg-12" id="postcomment">
<h4 class="mt-4">Post Your Comment</h4>
 
<form method="post">
<input type="hidden" name="commentid" id="commentid">
<label>Name</label>
<input type="text" class="form-control" name="name">
 
<label>Comment</label>
<textarea class="form-control" name="description"></textarea>
 
<input type="submit" name="submit" class="btn btn-primary mt-2">
 
</form>
</div>
 
 
</div>
 
 
<script>
function reply(commentid)
{
           
            //alert(commentid);
            $("#commentid").val(commentid);
}
</script>
 
</body>
</html>
 


To create this comment system I have used the recursion concept.

Recursion: Recursion is a concept that allowing a function to call itself from within its own code.

 

Note: In this blog, we have inserted blogs in the table directly, there is not any add blog system, you can customize this code according to your need.

Download Source Code

Categories: web development php
Written By : Web Development Institute
Trending Courses

CodeIgniter

Regular : 45 Days

Fastrack : 20 Days

Crash : 10 Days

Advance Digital Marketing Expert Course

Regular : 6 Months

Fastrack : 3 Months

Crash : 2 Months

React JS

Regular : 45 Days

Fastrack : 25 Days

Crash : 15 Days

Laravel

Regular : 45 Days

Fastrack : 20 Days

Crash : 10 Days

Front End Developer

Regular : 6 Months

Fastrack : 4 Months

Crash : 2 Months

Web Expert with Python

Regular : 12 Months

Fastrack : 6 Months

Crash : 3 Months

Related Blogs

Request For Demo