Make A Flat Based Shoutbox, With Auto Refresh.

lailai

Apr 7 2008, 09:38 AM

With this tutorial, you will learn how to create a simple shoutbox, but only uses a .txt file. Also with auto refresh, and I am going to do a backgound.
We will be making 5 files.
1. index.php The main page
2. msg.php Reading msg.txt
3. msg.txt Note: You must give it 777
4. shout.php Where it add to msg.txt
5. bg.gif Background.

Index.php would be like this:

CODE

<html>
<head>
<title>Shoutbox</title>
</head>
<body>
<iframe src="msg.php" marginwidth="1" marginheight="0" height="200"width="153" border="0" frameborder="0"></iframe>
<FORM name="shout" action="shout.php" method="POST">
Name:<br>
<INPUT TYPE="TEXT" name="name" size="20"><br>
Message:<br>
<INPUT TYPE="TEXT" name="message" size="20"><br>
<br>
<INPUT TYPE="Submit" name="submit" value="Shout!" size="20">
</FORM>
</body>
</html>

Let's go over what the code do.
<html> -> <body> are just the title.
<iframe> gets msg.php which gets msg.txt. You will know why I do that later.
<FORM> -> </FORM> is where you can type what you want to shout.

Now let's make the msg.php!

CODE

<html>
<head>
<meta http-equiv="refresh" content="8;url=msg.php" />
</head>
<body>
<?php include('msg.txt'); ?>
</body>
</html>

I shouldn't really explan this.
Meta refresh the page every 8 sec.
<?php include gets msg.txt.

I did this was for it won't refresh the whole page, as if it refresh while typing it will rub out the msg.

Just make a msg.txt with 777.

And for shout.php:

CODE

<?php

$name = $_POST['name'];
$message = $_POST['message'];

$code = array(
    '/:\)/',
    '/:P/',
    '/:D/'
//Bla bla bla
);

$image = array(
    '<img src="smileys/1.gif">',
    '<img src="smileys/2.gif">',
    '<img src="smileys/3.gif">'
// Bla bla bla
);
$formatted = preg_replace($code, $image, $message);

$tag = ("<font size=\"2\" face=\"Arial\"><b>
$name:</b>$message
</font><br>");

$read = fopen("content.txt", "r");
$contents = fread($read, filesize('content.txt'));
fclose($read);
$write = fopen("content.txt", "w");
fwrite($write, "$tag $contents");
fclose($write);

print "<meta http-equiv=\"refresh\" content=\"0;index.php\">";

?>

I made a little smiley feature, and you can use it for bb codes like [heading] turns to <h2> and stuff.
Hope you enjoyed the tut!

datanizze

Jun 8 2008, 08:14 PM

OMFG, this was so helful, Even without any PHP-programming skills, I managed to add some new smilieys and get it to work according to my wishes

, very easy-to-understand tutorial with fast result.

only problem I had was that there was no space between two posts. however, I managed to fix this, but it was not in any of these files frome this tutorial, i got to change css-files, create new css-files and edit some other HTML-code.

Once again, GREAT tutorial! you made my understanding for PHP bigger now too....

but there is ONE thing. how do I make a check so that the user did type in a message, so i don't get empty messages (SPAM)??

StaticIp

Jun 17 2008, 03:59 AM

My browser tries to save the .php file every time I press shout

nitish

Jun 21 2008, 07:38 AM

QUOTE(StaticIp @ Jun 17 2008, 09:29 AM)

My browser tries to save the .php file every time I press shout

You are probably running it from your computer without php installed. You can download software like Easy PHP, WAMP. Just search them on google.
Then copy those files to something like www or htdocs in the installation folder and run the server.

minimcmonkey

Jun 25 2008, 09:44 PM

Nice tutorial, havent used it yet, but i must! as i havent done any PHP for a long time, and intend to do some more before i start creating my new website!

Nice thread!

Forbez

Jun 25 2008, 10:43 PM

Nice and simple, I love it. You really put a lot of care into this tutorial. Well done mate. I may be using this myself sometime.

Perhaps you could post some suggested different CSS styles for this.

lailai

Jul 21 2008, 09:46 AM

Thanks guys. Some guy has stole my tut, so I need to get that fixed before posting more tuts here.

ADD REPLY / Got an Opinion!	Remove these ADs!	RAPID SEARCH!	Free Web Hosting	[X]
Express your Opinions, Thoughts or Contribute more info. to help others. Ask your Doubts & Queries to get answers, So that "Together We can help others!"	Register FREE for AD-FREE forum, Create your own topics, Ask Questions, track topics, setup subscriptions & notifications and Get a Free Website w/ Email and FTP.		500MB Space No Ads, CPanel, FTP, PHP, MySQL, EMails - 100% FREE