Gegen Bilderklau - Das Original | Druckvorschau: Fotoalbum mit PHP und MySQL

Geschrieben von Dasher am 13.03.2008 um 16:19:

Fotoalbum mit PHP und MySQL

Hinweis: Dies ist ein Teil von einem Turtorial für ein Datenbank basierendes Fotoalbum. Da es zu groß ist für ein Tut habe ich es in mehrere Teile geteilt. Sobald der nächste Teil online ist, verlink ich es im letzt geschriebenen Turtorial. Geschrieben wurde das Turtorial für Funpic bzw. Ohost

1. Die Theorie

Folgende Features wird unser Fotoalbum haben:

Kategorien, denen die Bilder zugeordnet sind, können über ein Webinterface erzeugt werden (Löschen von Kategorien ist ebenfals möglich)
Bilder können Kategorien zugeordnet werden
Mit dem Upload der Bilder werden automatisch Thumbnails erstellt
Bildern kann eine Überschrift und ein beschreibender Text zugeordnet werdne

2. Die Datenbank
Als erstes gehst du in PHPMyAdmin rein. Dort legst du erst einmal eine neue Tabelle für die Kategorien an.

code:
1: 2: 3: 4: 5: 6:	CREATE table kategorien ( id int(5) NOT NULL auto_increment, name varchar(50) NOT NULL default '', PRIMARY KEY (id) ) TYPE=MyISAM;

Als nächstes kommt die Tabelle für die Bilder:

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:

CREATE table bilder
(
 id int(5) NOT NULL auto_increment,
 name varchar(50) NOT NULL default '',
 breite varchar(5) NOT NULL default '',
 hoehe varchar(5) NOT NULL default '',
 thumb varchar(50) NOT NULL default '',
 nbreite varchar(5) NOT NULL default '',
 nhoehe varchar(5) NOT NULL default '',
 ueberschrift text NOT NULL,
 beschreibung text NOT NULL,
 kategorie int(5) NOT NULL default '0',
 PRIMARY KEY  (id)
) TYPE=MyISAM;

3. Zugangsdaten
Zur Sicherheit solltet ihr die folgenden Daten in einer externen Datei ablegen. Der Name der Datei soll include.php lauten.

php:

1:
2:
3:
4:
5:
6:
7:
8:
9:

<?php
$server = "localhost";
$user = "[B]Username[/B]";
$passwort = "[B]Datenbankpasswort[/B]";
$datenbank = "[B]Datenbankname(Wenn es deine einzige Datenbank bie Funpic oder Ohost ist, dann ist es dein Benutzername)[/B]";
$tabelle = "bilder";
$verbindung = mysql_connect($server,$user,$passwort) or die ("Konnte keine Verbindung herstellen");
mysql_select_db($datenbank) or die ("Datenbank existiert nicht");
?>

So. Jetzt musst du deine Daten anpassen. Ich hab es dir erleichtert. Du brauchst nur das Fettgedruckte ändern.

4. Die CSS-Datei
Ich arbeite sehr gerne mit externen CSS-Dateinen, da sie die Aktualliesierung der Seite vereinfachen. Deshalb wird dasgesammte Tut solch eine Datei haben. Diese Datei nennen wir style.css

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:

div {
font-weight: bold;
font-size: 15px;
color: #8a8a8a;
line-height: 15px;
font-family: verdana, arial, helvetica;
}
h2 {
font-weight: bold;
font-size: 15px;
text-transform: uppercas;
color: #000000;
line-height: 15px;
font-family: verdana, arial, helvetica;
}
a {
color: #2f5faf;
text-decoration: none;
font-size: 12px;
color: #000000;
line-height: 15px;
font-family: verdana, arial, helvetica;
}
a:hover {
colof: red;
text-decoration: underline;
}
input {
background-color: #ffffff;
border: 1px #2f5faf solid;
margin-top: 1px;
margin-right: 1px;
margin-bottom: 1px;
margin-left: 1px;
font-weight: bold;
font-size: 11px;
color: #2f5faf;
line-height: 14px;
font-family: verdana, arial, helvetica;
}

Dies ist sind nur die wichtigsten Style-Daten die ihr für das FA braucht. Natürlich solltet ihr es weiter ausbauen und verändern.

5. Die Frameset-Definition
Jetzt kommen wir zum leichten Teil. Dies dient einfach dazu dem ganzen FA eine Struktur zu geben. Oder kurz: Wir erstellen einen Frame. Dieser Code ist für ein ganz normales Frame-Design. I-Frames sehen zwar schöner aus, aber da es bereits ein Tut dafür gibt werd ich nicht näher darauf eingehen.

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:

<html>
<head>
<title>Fotoalbum</title>
</head>

<frameset cols="200,*">
  <frame src="kategorie.php" name="kategorie" frameborder="0"/>
  <frame src="startseite.htm" name="content" frameborder="0"/>
</frameset>
<noframes><body>Leider k&ouml;nnen keine Frames angezeigt werden.
</body>
</noframes></html>

6. Die Navigation
Als Navigation dient uns die Datei kategorie.php. Wenn noch nicht geschehen öffne bzw. erstelle diese Datei. Sie bekommt folgenden Inhalt.

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:

<html>
<head>
<title>Kategorien</title>
<link rel="stylesheet" type="text/css" href="style.css" /></head>

<body bgcolor="#000099"><h2 style="color:#ffffff">Kategorien</h2>
<table cellpadding="0" cellspacing="2" width="150" border="0" bgcolor="#ffffff">
<?php
include('include.php');
$result = mysql_query("SELECT id, name FROM kategorien");
$menge = mysql_num_rowa($result);
while($row = mysql_fetch_row($result))
{
?>
<tr>
  <td bgcolor="#ededed">
    <a href="galerie.php?name=<?php echo urlencode($row[1]) ?>&kategorien=<?php echo urlencode($row[0]) ?>" target="content"><?php echo $row[1] ?></a>
  </td>
</tr>
<?
  }
?>
</table>
<br>
<br>
<a href="neuesbild.php" target="content" style="color:#ffffff">Neues Bild einf&uuml;gen</a><br>
<br>
<a href="loeschen.php" target="content" style="color:#ffffff">Bilder l&ouml;schen</a><br>
<br>
<a href="kategorieneu.php" target="content" style="color:#ffffff">Kategorie einf&uuml;gen</a>
</body>
</html>

So. Das wars erstmal für den ersten Teil. Das nächste mal kommt rein:

Neue Kategorie anlegen
Neue Bilder einfügen
Thumbnails erstellen
Bilder löschen
Bilder ansehen

Bei Fragen einfach in den Thread hier schreiben

Liebe Grüße
Dasher

Geschrieben von Waterice am 13.03.2008 um 17:08:

Falsche Kategorie. Augenzwinkern

Würde gerne mal eine Demo sehen?

Geschrieben von Dasher am 13.03.2008 um 17:44:

@Waterice: Demo folgt bald. Mal schauen wenn ich glück habe schaff ichs heute noch.

Geschrieben von cll am 14.03.2008 um 10:06:

ich frag mich wie das funktionieren soll. die whileschleife ist total verkorkst.

while($row = mysql_fetch_row($result))
{
?>
<tr>
<td bgcolor="#ededed">
<a href="galerie.php?name=<?php echo urlencode($row[1]) ?>&kategorien=<?php echo urlencode($row[0]) ?>" target="content"><?php echo $row[1] ?></a>
</td>
</tr>
<?
}

das müsste doch so aussehen:

while($row = mysql_fetch_assoc($result))
{
echo "<tr>
<td bgcolor=#ededed>
<a href="galerie.php?name=$row[name]?kategorien=$row[id] target=content>$row[name]</a>
</td>
</tr>
}

was sollte $row[0] und [1] sein? und warum schließt und öffnest du php dauernd?

absicht, dass du name und id übergibst? die id allein würde reichen um die Kategorie zu definieren...

ich muss allerdings zugeben, dass ich noch nie mit fetch_row gearbeitet habe. sieht allerdings umständlicher aus.

Geschrieben von Dasher am 14.03.2008 um 16:15:

Also bei meiner Freundin (der ich mit diesem Code ein Fotoalbum gemacht habe) hat es geklapt. Hast du denn mal aus getestet ob es funktioniert?

Geschrieben von Freak am 15.03.2008 um 17:47:

Das geht schon so mit dem öffnen und schließen, mein Gestüt ist auch zu großen Teilen so aufgebaut und es funktioniert smile

Geschrieben von .Maybe am 16.03.2008 um 22:57:

Ich öffne und schließe PHP bequemerweise auch andauernd... Solange keine Fehler auftreten finde ichs voll okay, es so zu machen, wies eben funktioniert...
Aber auf eine Demo wäre ich auch gespannt ;-)

Geschrieben von ShivaChewy am 29.11.2009 um 15:22:

Kommt der Rest noch? smile

Geschrieben von .Senseless am 29.11.2009 um 20:03:

Dashers letzte Aktivität: 27.05.2008 19:17

Ich denke nicht, dass da noch was kommen wird.
Aber vllt. würde sich ja jemand anders bereit erklären, den Code weiterzuschreiben und / oder eine Demo hochzuladen.. smile