So eine Shoutbox ist eine nicht all zu schwere Anwendung und man braucht keine Vorkenntnisse. Also dann man direkt los:
wir fangen an mit index.php:
Diese Datei soll 2 Einträge ausgeben und die Möglichkeit bieten neue einzutragen.
<html>
<head>
<title>Shoutbox</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href=text.css" type="text/css">
<body bgcolor="12356">
<div align="center">
<h4>Shoutbox</h4>
<?php
echo "Hallo";
?>
Dürften keine Fragen aufkommen.
<?php
$datenbank = "daten.dat";
Wir starten den PHP Teil und und bestimmen die Datenbank.
$datei = fopen($datenbank,"r");
Wir laden die Datei.
$old=fread($datei, filesize($datenbank));
fclose($datei);
$x=explode("<!--trennung-->",$old);
WIr Trennen die einzelnen einträge.
for ($i=0;$i<8;$i++)
{
echo $x[$i];
}
?>
Wir geben sie aus:
<br>
<form method="post" action="gb.php">
<input frameborder="0" border=0" value="name" class=field type="text" name="name"><br>
<input value="dein text" border="0" class=field name="eintrag"><br>
<input type="submit" frameborder="0" name="Button" class=button value="Shout!">
</form>
Wir Setzen ein Eintragenformular unter die Einträge.
<a href="archiv.php">Archiv</a>
</div>
</body>
</html>
Wir verlinken die archiv Datei und beenden die Seite.
So nun kommen wir zu der Datei archiv.php:
Diese Datei soll alle Einträge ausgeben.
<!doctype html public "-//W3C//DTD HTML 4.0 //EN">
<html>
<head>
<title>Archiv</title>
<link rel="stylesheet" href="text.css" type="text/css">
</head>
<body bgcolor="123456">
<table width="300px" cellpadding="0"cellspacing="0">
<tr>
<td>
<h4>Shoutbox</h4>
</td>
</tr>
</table>
Hier müsste klar sein.
<?php
$datenbank = "daten.dat";
$datei = fopen($datenbank,"r");
fpassthru($datei);
?>
Ähnlich wie in der vorherigen Datei nur gibt er diesmal alle Dateien aus.
<br>
<div align="center"><a href="index.php">«back</a></div>
</body>
</html>
Ein Link zurück zur Index.php und die HTML Datei wird beendet.
So jetzt kommen wir zur gb.php:
Diese Datei soll die Einträge in die daten.dat schreiben.
<?php
$post_date = date("d.m.Y");
Wir öffnen den PHP Teil und bestimmen die Ausgabe des Datums (also ob 01.01.02 oder 01.01.2002 oder sowas halt)
$daten="<!--trennung-->
<br>
<table width=100 border=0>
<tr>
<td>
<b>$name:</b> $post_date
</tr>
</td>
<tr>
<td>
<div align=justify>
$eintrag
</div>
</td>
</tr>
<tr>
<td>
<hr width='100px' color='ffffff'>
</td>
</tr>
</table>";
Wir legen die HTML befehle fest mit denen er nacher die einzelnen Einträge ausgibt (wir geben sie also bei jedem EIntrag neu an). Die Tags sollten alle verständlich sein. Ausser vieleicht <!--Unsichbarer Komentar--> wei bei PHP das //.
Falls ihr Smilies haben wollt tragt den nächsten abschnitt mit ein, wenn nicht nicht.
$daten = str_replace(";)","<img src='smilie1.gif'>",$daten);
$daten = str_replace(":)","<img src='smilie2.gif'>",$daten);
$daten = str_replace("=)","<img src='smilie3.gif'>",$daten);
$daten = str_replace(":o)","<img src='smilie4.gif'>",$daten);
$daten = str_replace(":(","<img src='smilie5.gif'>",$daten);
$daten = str_replace(chr(7),"<br>",$daten);
Er ersetzt bestimmte Zeichenfolgen durch HTML Tags. Aslo macht er z.B. aus :) eine Bildverknüpfung.
Bei diesem Script habe ich eine CSS Datei benutzt mit folgendem Inhalt(text.css):
.titel {
font-family: Arial;
font-size: 10pt;
font-style: italic;
color: #FFFFFF;
}
.eintrag {
font-family: Arial;
font-size: 10pt;
color: #336699;
}
.author {
font-family: Arial;
font-size: 10pt;
color: #336699;
}
a {
font-family: Arial;
text-decoration:none;
color: #336699;
}
a:hover {
font-family: Arial;
text-decoration: none;
color: #ffffff;
}
body {
font-family: Arial;
font-size: 10pt;
color: #336699;
scrollbar-3d-light-color:#123457;
scrollbar-arrow-color:#000000;
scrollbar-base-color:#123457;
scrollbar-dark-shadow-color:#123457;
scrollbar-face-color:#123457;
scrollbar-highlight-color:#123457;
scrollbar-shadow-color:#123457;
}
h3,h4,h5 {
font-family: Arial;
color: #336699;
}
.field { font-family: Geneva, Arial, Helvetica, san-serif; font-size: 9px; color: #336699; border: #666666; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}
.button { font-family: Geneva, Arial, Helvetica, san-serif; font-size: 9px; color: #000000; border: 1px #CCCCCC outset}
input {
font-family: Arial;
background: #ffffff;
color: #000000;
font-size: 8pt;
font-weight: bold;
border-color: #517196;
border-colordark: #517196;
border-colorlight: #CCCCCC;
background-image: url('input.gif');
}
table {
FONT-SIZE: 9pt;
FONT-FAMILY: Arial;
}
Das ganze ist nun in einem schönem Lila gestaltet. Wer das nicht mag darf es natürlich beliebig Ändern.