This is a simple tutorial for creating a Posting Status Updates with Comment Like Facebook Using PHP/MySQL. But not only for posting, in this tutorial will you also learn on how to create a comment on the post being posted. This tutorial also contains a very easy to customize cascading style sheet (CSS).
Let’s start our tutorial.
Posting Status Updates with Comment Like Facebook Using PHP/MySQL Steps:
First, create a database then name it as any name you desire. In my case I use “itsourcecode” as my database name.
Then create table then name it as “posts” then put the following attributes.
[sql]
CREATE TABLE `posts` (
`post_id` int(11) NOT NULL,
`post_name` text NOT NULL,
`post_msg` text NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
[/sql]
Create another table then name it as “comments” then put the following attributes.
[sql]
CREATE TABLE `comments` ( `comment_id` int(11) NOT NULL, `post_id` int(11) NOT NULL, `user_name` text NOT NULL, `user_comment` text NOT NULL) ENGINE=MyISAM DEFAULT CHARSET=latin1;
[/sql]
For the CSS, create a “styles.css” file then put the following CSS codes.
[css]
body {
background-color: #5E5E5E;
color: #000000;
width: 70%;
margin: auto;
font: 15px Calibri;
padding-top: 20px;
}
.body {
background-color: #E5E5E5;
padding: 10px;
margin-top: 5px;
}
textarea {
background-color: #ffffff;
padding: 10px;
border-radius: 3px;
border: 1px solid #c0c0c0;
margin: 3px;
margin-bottom: 0px;
}
input[name=’uname’] {
background-color: #ffffff;
padding: 10px;
border-radius: 3px;
margin: 3px;
margin-bottom: 4px;
margin-top: 0px;
border: 1px solid #c0c0c0;
width: 154px;
}
.post-panel {
background-color: #FFFFFF;
border: 1px solid #c0c0c0;
margin-bottom: 10px;
border-radius: 5px;
}
.post-header {
padding: 10px;
}
.post-body {
padding: 10px;
border-top: 1px solid #c0c0c0;
}
.post-footer {
padding: 10px;
border-top: 1px solid #c0c0c0;
}
input[type=’submit’] {
background-color: #FFFFFF;
border: 1px solid #c0c0c0;
padding: 10px;
border-radius: 3px;
margin: 3px;
margin-top: 0px;
}
a {
color: #0005FF;
text-decoration: none;
}
[/css]
For the connection to the database. Create a “connection.php” file then put the following codes.
[php]
<?php
$mysqli = new MySQLi(‘localhost’, ‘root’, ”, ‘itsourcecode’);
?>
[/php]
Create an “index.php” file then put the following codes.
[php]
<?php include (“connection.php”);?>
<!doctype html>
<html>
<head>
<meta charset=”utf-8″>
<title>Comment to Post</title>
<link rel=”stylesheet” type=”text/css” href=”styles.css”>
</head>
<body>
<div class=”body”>
Simple Posting Updates With Comment in PHP and MYSQL
</div>
<div class=”body”>
<form method=”post” action=”post-action.php”>
<label>Add Post:</label><br>
<textarea name=”post_msg” required></textarea><br>
<input type=”text” name=”uname” placeholder=”type your name here…” required /><br>
<input type=”submit” name=”post” value=”Post” />
</form>
<?php
if (isset($_GET[‘post_action’])) {
if ($_GET[‘post_action’] == “posted”) {
echo ‘Successfully Posted!’;
}
}
?>
</div>
<?php
$posts = $mysqli->query(“SELECT * FROM posts ORDER BY post_id DESC”);
?>
<div class=”body”>
<b><?php echo $posts->num_rows ?></b> total posts
</div>
<div class=”body” style=”padding-bottom: 1px;”>
<?php
if ($posts->num_rows == null) {
echo ‘no posts yet’;
} else if ($posts->num_rows != null) {
while ($post_data = $posts->fetch_assoc()) { ?>
<div class=”post-panel”>
<div class=”post-header”>
<b><?php echo $post_data[‘post_name’] ?></b>
</div>
<div class=”post-body”>
<?php echo $post_data[‘post_msg’] ?>
</div>
<?php
$comments = $mysqli->query(“SELECT * FROM comments WHERE post_id = “.$post_data[‘post_id’].””);
?>
<div class=”post-footer”>
<a href=”view-post.php?post_id=<?php echo $post_data[‘post_id’] ?>”>Comment (<?php echo $comments->num_rows ?>)</a>
</div>
</div>
<?php }
}
?>
</div>
</body>
</html>
[/php]
For posting, create a “post-action.php” file then put the following codes.
[php]
<?php
include (“connection.php”);
if (isset($_POST[‘post’])) {
$post_msg = $_POST[‘post_msg’];
$uname = $_POST[‘uname’];
$post = $mysqli->query(“INSERT INTO posts (post_name, post_msg) VALUES (‘$uname’, ‘$post_msg’)”);
if ($post) {
header(“Location: index.php?post_action=posted”);
} else {
echo $mysqli->error;
}
}
?>
[/php]
For viewing and commenting on the post, create a “view-post.php” file then put the following codes.
[php]
<?php
include (“connection.php”);
if (isset($_GET[‘post_id’])) {
$id = $_GET[‘post_id’];
$post = $mysqli->query(“SELECT * FROM posts WHERE post_id = $id”);
$post_data = $post->fetch_assoc();
} else {
header(“Location: index.php”);
}
?>
<!doctype html>
<html>
<head>
<meta charset=”utf-8″>
<title><?php echo $post_data[‘post_name’] ?>’s Status Update</title>
<link rel=”stylesheet” type=”text/css” href=”styles.css”>
</head>
<body>
<div class=”body”>
<a href=”index.php”>Home</a> | <b><?php echo $post_data[‘post_name’] ?>'</b>s Status Update
</div>
<div class=”body”>
<div class=”post-panel”>
<div class=”post-body” style=”border: none;”>
<?php echo $post_data[‘post_msg’] ?>
</div>
<div class=”post-footer”>
<?php
$comments = $mysqli->query(“SELECT * FROM comments WHERE post_id = $id”);
?>
<b><?php echo $comments->num_rows ?></b> total comments<br><br>
<?php
while ($comment_data = $comments->fetch_assoc()) { ?>
<div class=”post-panel”>
<div class=”post-header”>
<b><?php echo $comment_data[‘user_name’] ?></b>
</div>
<div class=”post-body”>
<?php echo $comment_data[‘user_comment’] ?>
</div>
</div>
<?php }
?>
<form method=”post” action=”comment-action.php?post_id=<?php echo $id ?>”>
<label>Quick Comment:</label><br>
<textarea name=”comment” required></textarea><br>
<input type=”text” name=”uname” placeholder=”enter your name here…” required /><br>
<input type=”submit” name=”post_comment” />
</form>
</div>
</div>
</div>
</body>
</html>
[/php]
For posting a comment on the post, create a “comment-action.php” file then put the following codes.
[php]
<?php
include ‘connection.php’;
if (isset($_POST[‘post_comment’])) {
$post_id = $_GET[‘post_id’];
$comment = $_POST[‘comment’];
$uname = $_POST[‘uname’];
$comment = $mysqli->query(“INSERT INTO comments (post_id, user_name, user_comment) VALUES ($post_id, ‘$uname’, ‘$comment’)”);
if ($comment) {
header(“Location: view-post.php?post_id=$post_id”);
} else {
echo $mysqli->error;
}
}
?>
[/php]
If you have any questions or suggestion about Posting Status Updates with Comment Like Facebook Using PHP/MySQL, please feel free to contact me at our contact page.
where are the sql tables??
thers error index
Parse error: syntax error, unexpected ‘Posted’ (T_STRING), expecting ‘,’ or ‘;’ in C:\xampp\htdocs\encuentrostres\simpleposting\index.php on line 45
CREATE TABLE posts (
post_id int(11) NOT NULL,
post_name text NOT NULL,
post_msg text NOT NULL
)