As a PHP developer, I'm sometimes asked to make a shoutbox. If the same thing happens to you, here's a quick guide. Obviously you'll want to add your own CSS to it above, but here's the basic idea.
We need a MySQL database table and three PHP files.
First, we need a file to save database information
---File #1:mysql.inc.php---
<?php
#Simply Shouting-shoutboxexample
# File name:mysql.inc.php
# Description: A file to hold database info.
$host ='localhost';
$user ='database_user_name';
$password='database_user_password';
$name ='database_name';
?>
Create a data table with four fields. We name it shouts. You may not have this SQL file before, create a PHP file "install.php". After using this file once, remember to delete it!
-- File #2: install.php --
<?php
#Simply Shouting-shoutboxexample
# File name: install.php
# Description: Creates the database table.
// include the database info file
include("mysql.inc.php");
//Connect to the database
$connection= @mysql_connect($host,$user,$password) or die(mysql_error());
$db= @mysql_select_db($name,$connection) or die(mysql_error());
//If we already have a table named "shouts", we need to delete it first
$sql='DROP TABLE IF EXISTS `shouts`';
$result= @mysql_query($sql,$connection) or die(mysql_error());
// Now make sure there is no table with the same name, create it
$sql='CREATE TABLE `shouts` (
`id` int(11) NOT NULL auto_increment,
`timestamp` TIMESTAMP NOT NULL DEFAULT CURRENT_TIMESTAMP,
`shoutby` varchar(50) default NULL,
`shout` varchar(50) default NULL,
PRIMARY KEY `id` (`id`)
) TYPE=MyISAM AUTO_INCREMENT=1';
echo'Creating table: 'shouts'....';
// close connection
$result= @mysql_query($sql,$connection) or die(mysql_error());?>
<html>
<head>
<title>Simply Shouting - Installation</title>
</head>
<body>
<br />
Your installation process is complete. Please delete all installation files from your server immediately. This program contains the following installation files:<br />
<br />
1) install.php<br />
<br />
<br />
<!-- I could just send them to index.phpautomatically, but then they'd wonder if it created correctly or not. -->
Click <a href="index.php">here</a> to get started.</html>
This is the main file:
--- File #3: index.php---
<?
#Simply Shouting-shoutboxexample
# File name: index.php
# Description: Main page to display our shouts.
//Contains database information
include_once("mysql.inc.php");
//Connect to database
$connection= @mysql_connect($host,$user,$password) or die(mysql_error());
$db= @mysql_select_db($name,$connection) or die(mysql_error());
?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style type="text/css">
<!--
body,td,th {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
-->
</style><body>
<div style="width:500px;height 400px; border:thin groove #519554;">
<?
// Display the latest 10 messages. First, initialize a counter
$counting=0;
// we need a counter because I want to show our shouts in ASC order
// (like a chat room)
$sql=mysql_query("SELECT * FROM `shouts`");
while($data=mysql_fetch_array($sql)){
//counts every row
$counting=$counting+1;
} //end while
// if the count comes back greater than 10, then we select the last
// 10 shouts for display.
if($counting>10){
$countlessten=$counting-9;
$sql=mysql_query("SELECT * FROM `shouts` ORDER BY `shouts`.`id` ASC LIMIT $countlessten,10");
}else{
//else it doesn't matter, there's less than 10!
$sql=mysql_query("SELECT * FROM `shouts` ORDER BY `shouts`.`id` ASC LIMIT 10");
}
while($data=mysql_fetch_array($sql)){
//my timestamp field in the database is basically useless to me unless
//I parse it. The following code parses the timestamp into things I
//can use.
$timestamp=$data['timestamp'];
$postedyear=substr($timestamp,0,4);
$postedmonth=substr($timestamp,5,2);
$postedday=substr($timestamp,8,2);
$postedtime=substr($timestamp,11,5);
$newpostedtime="";
$nomilitary=substr($postedtime,0,2);
// the hour is greater than 12, so we need to switch back to 1-12 and
// add a "pm"
if($nomilitary>=13){
$nomilitary=$nomilitary-12;
$newpostedtime=$nomilitary;
$newpostedtime.=":";
$newpostedtime.=substr($postedtime,3,2);
$newpostedtime.=" pm";
}
if($newpostedtime!=""){
$postedtime=$newpostedtime;
}else{
$postedtime.=" am";
}
//now that we have the time, let's get the shout and the shouter
$shoutby=$data['shoutby'];
$shout=$data['shout'];
echo$postedmonth."/".$postedday."/".$postedyear." at ".$postedtime." - <strong>".$shoutby." said: </strong>".$shout."<br ><br>";
// looks like: 12/1/2008 at 5:02pm - Josh said: Yo Yo Yo!
}
//below is the HTML form for creating the shouts
?>
<form id="newshout" name="newshout" action="newshout.php" method="post"><input name="shoutby" type="text" id="shoutby" onClick="javascript:this.value =''" value="Enter your name here" size="24" maxlength="50" />
<br><br><input name="shout" type="text" id="shout" onClick="javascript:this.value=''" value="Click & Shout!" size="24" maxlength= "50" />
<br><br><input id="submit" name="submit" type="submit" value="Shout!" /></form>
</div>
</body>
</html>
Finally, we need a PHP file to handle the form.
-- File #4: newsout.php --
<?
#Simply Shouting-shoutboxexample
# File name: newsout.php
# Description: Process the HTML form on index.phpand redirect.
//Get the name of the person who left the message
$shoutby=$_POST['shoutby'];
if($shoutby=="Enter your name here"||$shoutby==""){
//If no name is entered
$shoutby="Visitor";
}
if($_POST['shout']){
// Message
if($_POST['shout'] !="Click & Shout!"){
//they didn't shout the default, so continue processing
$shout=$_POST['shout'];
//Replace "<" and ">" to stop hackers
$shout=str_replace("<"," ",$shout);
$shout=str_replace(">"," ",$shout);
// Contains data information
include_once("dbaccess.php");
//Connect to database
$connection= @mysql_connect($host,$user,$password) or die(mysql_error());
$db= @mysql_select_db($name,$connection) or die(mysql_error());
//Insert message information into the database
$sql="INSERT INTO `shouts`(`shoutby`,`shout`) VALUES('$shoutby','$shout')";
//Close the connection
$result= @mysql_query($sql,$connection);
}
}
?>
<html>
<head>
</head>
<body onLoad="window.open('index.php','_self')">
</body>
</html>