(Source files) How to create a commenting system using php and MySql (php tutorial)

Hello, today we are going to create a commenting system using php and MySql database.
Check demo from here:

So for the HTML and CSS part i have attached here the template that we will work on, so this tutorial will be about integrating php and MySQL into that template and make it work

From here Download the HTML and CSS (If you wan the full work check down at the end of the article).

Let's get Started:

Part I : Database creation and environment setting 

So we will create database and table inside to store comments, all what we need is two fields in a table. so we create a database and we call it -cmt-

Inside of this database let's create a table and call it -com- with two fields like this

You can do all this or just download the MySQL Queries to build up the database from here:

Now everything's all right, let's write some php codes.

Part II : Database Connection

First thing every php developer start with, IS TO CONNECT DATABASE WITH SCRIPT

So for the connection we will create another php file and write this small script on it :

<?php
$con = mysqli_connect("localhost","my_user","my_password","my_db");

// Check connection
if (mysqli_connect_errno())
  {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }
?>

then we replaced our database details in the previous code and we get:

<?php
$con = mysqli_connect("localhost","root","","cmt");

// Check connection
if (mysqli_connect_errno())
  {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }
?>

Then save the file as db.php newt to index.html file.

Now we include the db.php into html one using include function.

<?php

include ('db.php');
?>

SO IMPORTANT:

Another thing is to change the extension of index.html to index.php so the php file can read php codes.

Part III : Store data into database

Open the index.php file and we will get data from the form using $_POST function, and it function that when i click on, and we will use it on submit button of the form to work as: when i click on submit { GET DATA FROM FORM }, it's an easy algorithmic.

<?php

$_POST['name']; // this get data from name input in form

?>

Now let's get the form values and store them into variables:

so we create a new file and call it cmt.php and write down this code:

cmt.php

<?php
     
                 $name = (htmlspecialchars($_POST['name'])); 
     $comment = (htmlspecialchars($_POST['comment']));

?>

Now values of name and comment are stored in the two variables $name and $comment.

we call the db.php file to cmt.php again and we use the sql query to store the two variables values in database so the final code will be like that.

<?php
    include ('db.php'); 
                 $name = (htmlspecialchars($_POST['name'])); 
     $comment = (htmlspecialchars($_POST['comment']));
                $sql = "INSERT INTO com (name, comment)
     VALUES ($name, $comment)";
// Here we are going to check if records are added to database or not

if ($con->query($sql) === TRUE) { // if records has been add we will be redericted to home page
    echo "New record created successfully";

header('Location: index.php');
 
} else {// if not show error
    echo "Error: " . $sql . "<br>" . $con->error;
}
?>

Everythings is explained in the comments of the php code.

Part IV : Get records from database and show as comments

So we go back to index.php file and we will use this code in comments section:

><?php
$sql = "SELECT * FROM com";
$result = $con->query($sql);

if ($result->num_rows > 0) {
    // output data of each row
    while($row = $result->fetch_assoc()) {
  $name=$row['name'];
  $comment=$row['comment'];
       
    }
} else {
    echo "There is no comments";
}?>

Now from the code data in table are stored in the two new variables $name and $comment.

We will do some replacement in the latest comment section and code will be like this :

<h2>Latest comments</h2>
                    </div><?php
$sql = "SELECT * FROM com";
$result = $con->query($sql);

if ($result->num_rows > 0) {
    // output data of each row
    while($row = $result->fetch_assoc()) {
  $name=$row['name'];
  $comment=$row['comment'];
       ?>
     <div class="rpost">
                        <p><a href="#19"><?php echo $comment; ?></a> <br/>
                        <a href="#20"><?php echo $name; ?></a></p>
                    </div>
                    
    
    <?php
    }
} else {?>
<div class="rpost">
                        <p><a href="#19">There is no comments</a> <br/>
                       
                    </div>
   <?php 
}?>
                   
                    

                    
                </div>

So all code of index.php

<?php
include ('db.php');
?>

<!DOCTYPE html>
<html >
  <head>
    <meta charset="UTF-8">
    <title>Commenting system</title>
    
    
    
    
        <link rel="stylesheet" href="css/style.css">

    
    
    
  </head>

  <body>

    <!-- My first HTML & CSS -->

<!-- designed by Riki Tanone: http://drbl.in/gUhL -->

<html>

    <head>

        <meta charset="utf-8">

        <title>Let's leave comments</title>
        <meta name="description" content="This is a trial">
        <meta name="author" content="jlalovi">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">   
        
        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="css/main.css">
        <link rel="stylesheet" href="http://i.icomoon.io/public/temp/90320a65cd/UntitledProject2/style.css">

    </head>

    <body>
 
        <div id="main-container">
            <div id="left-container"> <!-- Left part -->
                <div id="newPost" class="container"> <!-- Add New Post -->

                    <div class="side bar">
                        <ul>
                            
                            <li><a href="" id="document"><span class="fontawesome-file-alt"></span></a></li>
                            
                        </ul>
                    </div>

                    <div class="newPostContent">
                        <h1>Add New Comment</h1>
      
      

                          
        
   <form method='POST' action='cmt.php'>     
                        <input type="text" name="name" placeholder="Your name" id="post-title"> 

                       
                        <textarea name="comment" class="post-body"></textarea>

                        
                        <input type="submit" value="submit" class="btn"></a>
      </form>
                    </div>                   
                </div>

                

               
            </div>

            <div id="middle-container"> <!-- Middle Part -->
                <div id="relatedPosts" class="container"> <!-- Related Posts -->
                    <div class="bar title-bar">
                        <h2>Latest comments</h2>
                    </div><?php
$sql = "SELECT * FROM com";
$result = $con->query($sql);

if ($result->num_rows > 0) {
    // output data of each row
    while($row = $result->fetch_assoc()) {
  $name=$row['name'];
  $comment=$row['comment'];
       ?>
     <div class="rpost">
                        <p><a href="#19"><?php echo $comment; ?></a> <br/>
                        <a href="#20"><?php echo $name; ?></a></p>
                    </div>
                    
    
    <?php
    }
} else {?>
<div class="rpost">
                        <p><a href="#19">There is no comments</a> <br/>
                       
                    </div>
   <?php 
}?>
                   
                    

                    
                </div>

                <div id="tags" class="container"> <!-- Tags -->
                    <div class="bar title-bar">
                        <h2>About</h2>
                    </div>
                    <br><br>
                    <p>This is created for a commenting with php tutorial by <br>
     Www.digitalservicesmarket.biz</p>
                </div>

                
                </div>
            </div>
        </div>
    </body>
</html>
    
    
    
    
    
  </body>
</html>

Now everythings is on work .

download the source files now:

Don't forget to share this on facebook twitter or google+ and subscribe to get everything new tutorial with source files.

If you have any questions, please feel free to add comments.

may you'll be interested downloading others of our free scripts:

http://www.digitalservicesmarket.biz/2015/06/managing-it-park-php-script-ready-to.html