Advanced Shoutbox

Advanced Shoutbox Ok, You're kind of new to PHP programming and you deeply want to have a place where people browsing your site can leave some comments on your site... isn't that cute. Well, you've surely seen it before, the Shoutbox.

First things first, what to we need to get this working?!

A host that supports PHP, the access to a mySQL database, a text editor and some coffee to stay awake of my boring speeches.

Step 1 - Creating the mySQL table

Before we get to the codes of the shoutbox, let's create a mySQL database:

CREATE TABLE 'shoutbox' (
'id' INT(12) NOT NULL AUTO_INCREMENT,
'username' VARCHAR(25) NOT NULL,
'email' VARCHAR(25) NOT NULL,
'message' TEXT NOT NULL,
'date' VARCHAR(15) NOT NULL,
'ip' VARCHAR(25) NOT NULL ,
PRIMARY KEY ('id'))

Here, we created a table called "shoutbox", with the id, username, email, date, message and ip rows. If you don't know how to create a mysql database, ask your host administrator.

Ok basically, a shoutbox is made this way:

1. Show the latest posts
2. Show some forms for the users to add their comments.

This is really simple in my opinion, let's code this.

Step 2 - Create a new file, connect.php

We need to create a connection to the database. We could type the code in our shoutbox.php but it could be dangerous if we enter the private informations directly in it. So we create a basic connect.php page that we can protect with a .htaccess file later. So open your text editor, and save it as connect.php, insert this code in it:

<?php

$co_host = "localhost"; // sql database host
$co_name = "username"; // username
$co_pw = "password"; // password
$co_db = "database name"; // database name you got access to

mysql_connect($co_host,$co_name,$co_pw) or die(mysql_error());
mysql_select_db($co_db) or die(mysql_error());
?>

Step 3 - Create a new file, shoutbox.php

Create a new page called shoutbox.php and enter this:

<html>
<head>
<title>Shoutbox!</title>
<style type="text/css">

</style>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" style="padding: 2px">
<?php

// If submitted
if($_POST['submit']) {

// Verify if the fields were filled.
if(!$_POST['username']) {
echo 'Error, You need to post your Username!';
die;
}
if(!$_POST['email']) {
echo 'Error, You need to post your Email!';
die;
}
if(!$_POST['message']) {
echo 'Error, You need to post a Message!';
die;
}

// Date format
$date = date("d/m/y"); // http://www.php.net/date

// Assign variables of the forms
$username = $_POST['username'];
$email = $_POST['email'];
$message = $_POST['message'];
$ip = $_SERVER['REMOTE_ADDR'];

// Connect to the database
include('connect.php');

// Insert the info in the shoutbox table.
$query = "INSERT INTO shoutbox (username, email, message, date, ip)
VALUES ('$username','$email','$message','$date','$ip')";
mysql_query($query);
// close connection
mysql_close();

// Show message to let them return to the shoutbox
?>
<div align="center">Thank you for submitting.<br>
Return to the <a href="shoutbox.php">shoutbox</a>!
<?php
// If NOT submitted
} else {

// connect to the database
include('connect.php');

$query = "SELECT * FROM shoutbox ORDER BY id DESC LIMIT 10";
$result = mysql_query($query);
// Create a table
?>

<table width="100%" cellpadding="0" cellspacing="0" border="0">

<?
// Run a While loop for the rows
while($c = mysql_fetch_array($result))
{
?>
<tr>
<td><a href="mailto:<? echo $c[email] ?>">
<? echo $c[author] ?></a> says:
<div align="justify"><? echo $c[message] ?></div>
</td>
</tr>
<tr><td>on <? echo $c[date] ?>
<hr noshade="noshade" size="1" style="border-style: dashed" color="#000000" /></td></tr>
<? } ?>

</table>

<form method="post" action="shoutbox.php">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>Username :</td>
<td><input type="text" name="username" class="forms"></td>
</tr>
<tr>
<td>Email :</td>
<td><input type="text" name="email" class="forms"></td>
</tr>
<tr>
<td>Message :</td>
<td><input type="text" name="message" class="forms"></td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="submit" value="Speak!" class="subtmit"></td>
</tr>
</table>
</form>

<?
}
mysql_close();
?>
</body>
</html>

Ok, we created a page that said: If someone posts, add it to the database, if not, show the messages and the form inputs. Isn't that simple? Yes it is and it's logical. Now it's your turn to modify it all you want. Switch some codes, values and stuff to learn the few commands we threw out there.

In conclusion, a shoutbox is a nice way of letting the visitors express themselves about your website. It is clear, easy to code (I hope), and easy to customize.

If I was not clear in some points, feel free to contact us, we'll be glad to help you.

Creating a Shoutbox
This tutorial - Creating a Shoutbox will keep your interest as well as teach you a great bit of design with all the code you will need right on the page. The author makes it a snap with lots of photos and illustrations.
Basic Shoutbox
This is an interesting and helpful tutorial for designing an Advanced Shoutbox. The author explains in this two part article that your blog or website can have a place for visitor comments. The author starts by showing you how to....
5 Ways to Keep Visitors Coming Back
A lot of successful websites depend on returning visitors to account for a major part of their traffic. Returning visitors are easier to convert into paying customers because the more often they return to a site, the more trust they have in that site.
Advanced Image Uploader
This is an advanced image uploader...
Backlinks - Lifeblood Of Your Website
Over the years search engine technology has advanced. Once all you needed was a website and some meta tags to get listed. Now as the search engines and the search engine spammers race against each other to stay ahead, technology has advanced significantly.
Advanced Text Linking Strategies
There are some advanced things you can do when considering your link text that will allow you to gain even more benefit from them.
Do You Need A Website Designer?
One of the first decisions you, as new internet business owner, must make is whether you will build your own website or if you will hire a professional website designer.
How To Find Expired Domain Names
Every day thousands of domain names expire. Some owners no longer have any use for the domain name and let it expire. There are owners who have no idea that their name has expired. Once the domain name expires it can also be referred to as a deleted domain name.
The Advantages of Dynamic Website Content
Think about your own surfing behavior. What types of websites do you visit the most often; which ones keep drawing you back? If you are like most internet surfers, you will spend much of your time hanging around websites with dynamic website content, or content that is updated constantly...
SEO Techniques: Increase the SE Ranking of your Website
Higher search engine ranking is necessary to improve the sales of your products and services. But to achieve this objective, you require improving the search engine visibility of your website. It is not so simple to achieve a good rank in this competitive age.