This content was uploaded by our users and we assume good faith they have the permission to share this book. If you own the copyright to this book and it is wrongfully on our website, we offer a simple DMCA procedure to remove your content from our site. Start by pressing the button below!
Der Bestseller aktualisiert in der 6. Auflage! Alles redet von PHP und MySQL! Und unzählige Webseiten-Programmierer setzen die Programmiersprache PHP und die Webdatenbank MySQL mit viel Erfolg und Spaß ein. Du möchtest auch in diese Liga aufsteigen und tolle Webseiten mit PHP und MySQL erstellen? Dann ist dieses Buch von Johann-Christian Hanke genau richtig für dich! Du lernst zum Beispiel, wie du die Besucher auf deiner Webseite zählst und ein Gästebuch einrichtest, in dem deine Freunde Nachrichten veröffentlichen können. Selbst eigene Umfragen, Formulare für Feedback und ein kleines Weblog kannst du bald selbst erstellen. Falls du einmal nicht weiterweißt, springt dir Hund Buffi zur Seite und gibt dir gerne hilfreiche Tipps. Und das ist längst nicht alles, was das Buch zu bieten hat! Die CD ist randvoll mit Tools, die du für deine Webseiten-Programmierung brauchst. Die Videos zur Installation und Einrichtung helfen dir, damit du sofort mit dem Programmieren loslegen kannst. Auf der CD findest du alles, was du zum Programmieren brauchst: PHP 5, MySQL 5, den Apache-Webserver, die Editoren PSPad, Notepad++ und Aptana Studio, phpMyAdmin, XAMPP, SELFHTML, Videoworkshops, Lösungen zu den Aufgaben und den Programmiercode aus dem Buch
Über den Autor: Johann-Christian Hanke ist ein erfolgreicher Fachbuchautor und gibt Kurse an einer Volkshochschule in Berlin. Systemvoraussetzungen: Alle Windows-Versionen sowie Mac OS X und Linux Ab 11 Jahre, aber auch für Erwachsene, die eine wirklich einfache Einführung suchen.
Regalsystematik: Programmierung ISBN 978-3-8266-8674-0
Probekapitel und Infos erhältst du unter: [email protected] www.it-fachportal.de
Johann-Christian Hanke
(D)
Hanke
Ebenfalls in dieser Reihe erschienen:
€ 19,95
Auf der CD: pache-Webserver, PHP 5, MySQL 5, A ptana Studio, ,A PSPad, Notepad++ stallation In XAMPP, Videos zur rammiercode og und Einrichtung, Pr aus dem Buch
8674 8674.indd 1
07.01.2010 10:48:51
PHP und MySQL für Kids
Johann-Christian Hanke
PHP und MySQL für Kids
Bibliografische Information Der Deutschen Bibliothek Die Deutsche Bibliothek verzeichnet diese Publikation in der Deutschen Nationalbibliografie; detaillierte bibliografische Daten sind im Internet über abrufbar.
Bei der Herstellung des Werkes haben wir uns zukunftsbewusst für umweltverträgliche und wiederverwertbare Materialien entschieden. Der Inhalt ist auf elementar chlorfreiem Papier gedruckt.
ISBN: 978-3-8266-8674-0 6., aktualisierte und erweiterte Auflage 2010
Dieses Werk, einschließlich aller seiner Teile, ist urheberrechtlich geschützt. Jede Verwertung außerhalb der engen Grenzen des Urheberrechtsgesetzes ist ohne Zustimmung des Verlages unzulässig und strafbar. Dies gilt insbesondere für Vervielfältigungen, Übersetzungen, Mikroverfilmungen und die Einspeicherung und Verarbeitung in elektronischen Systemen.
Printed in Germany Lektorat: Katja Völpel Korrektorat: Petra Heubach-Erdmann Satz und Layout: Johann-Christian Hanke, Berlin
für Tabea, Florian und Linus
Inhaltsverzeichnis Vorwort
15
Was bedeutet eigentlich Programmieren? Wozu sind Datenbanken da?
15
16
Was kannst du mit PHP und MySQL alles machen?
17
Was ist ein Webserver und wozu brauchst du den?
18
Wie arbeitest du mit diesem Buch?
18
Was brauchst du für dieses Buch?
19
Wie gut kommst du mit dem Computer klar? Was ist neu in Auflage 6?
22
Wo gibt’s Hilfe, wenn es mal klemmt?
1
20
24
Deine coole Homepage mit HTML Richte dir einen Projektordner ein!
25
26
HTML auf Knopfdruck – mit PSPad
28
So wird’s perfekt: Überschriften, Absätze und mehr Hier bin ich: Ein Bild einfügen
40
Meine Hobbys kurz aufgelistet
43
Coole Links zu coolen Plätzen
45
Meine drei Lieblingsfächer in einer Tabelle Schickes Layout mit Style Sheets Schön bunt hier: Farben zuweisen So legst du die exakte Breite fest
Schlussbemerkung
64
Zusammenfassung
64
Ein paar Fragen …
65
… und ein paar Aufgaben
47
49 53 57
Eine Umfrage! Wie findest du meine Page? Tipps und Tricks zu PSPad
35
59
61
65 7
Inhaltsverzeichnis
2
Installiere deinen eigenen Webserver! Warum eigentlich ein Webserver?
68
Wie teuer ist die Homepage mit PHP/MySQL? How! Im Reich des »Apachen«
Nur noch etwas Handarbeit … und fertig! Testen: phpinfo() auf localhost 86
Zusammenfassung
87
Ein paar Fragen …
87
… und eine Aufgabe
3
75 81
83
88
Hallo echo – »Hallo Welt« Daten ausgeben mit echo
89
90
Variablen: Mein rechter, rechter Platz ist leer Ausgabe verschönern mit HTML-Tags Kleine Zeilenumbruchkunde
Pause muss sein: Die if-else-Entscheidungsstruktur
8
Der Tag vergeht: Zwischentöne mit elseif
123
Feldvariablen: Wochentage aufschreiben
125
Arrays die Zweite: Es geht auch kürzer!
128
116
Inhaltsverzeichnis
Assoziativ: Monatsnamen als Array … und wieder die Kurzform Den Monat ausgeben
131
132
Schlussbemerkung
133
Zusammenfassung
133
Ein paar Fragen …
134
… und ein paar Aufgaben
5
129
135
Seiten mit Passwort schützen Formular für das Passwort
137
138
Senden mit Methode: post oder get? Ausgabe des Passworts Testen mit if-else
139
141
143
Schönheitsfehler? Variablentest mit isset()! Mehr Möglichkeiten mit switch Inhalt mit include einbinden
144
147
151
Mehr Sicherheit: Endungs- und Ordnertricks Schlussbemerkung
154
Zusammenfassung
155
Ein paar Fragen …
156
… und ein paar Aufgaben
6
152
156
Etwas Mathe: Taschen(geld)rechner Nicht ohne Grund: Grundrechenarten
157
158
Rechenpraxis: Zwei mal Drei macht Vier …
159
Einnahmen minus Ausgaben: Taschengeldrechner
160
$_SERVER['PHP_SELF']: Daten an sich selbst schicken 164 Wie viel bleibt übrig? Prozentrechnung!
165
Traurige Säulen: Ergebnis als Diagramm
169
Plus, Minus, Mal, Geteilt? Select! So liest du ein SELECT-Feld aus
170 172
9
Inhaltsverzeichnis
Rechner de luxe: Wir schreiben eine Funktion Der Rechner im Einsatz Schlussbemerkung
180
Zusammenfassung
180
Ein paar Fragen …
181
177
… und ein paar Aufgaben
7
181
Schleifen: Die »Gratulationsmaschine« Die while-Schleife Der Bestseller: for
183
184
Prüfung zu Fuß: do while
189
190
Und die Geburtstagskerzen?
192
Have a break: Abbruchbedingung einfügen Und noch eine Schleife: foreach Schlussbemerkung
199
Zusammenfassung
199
Ein paar Fragen …
199
… und ein paar Aufgaben
8
174
194
195
200
Fürs Feedback: Formmailer selbst gestrickt 201 Die Funktion mail()
202
E-Mail mit Datums- und Zeitstempel Das Feedback-Formular
204
205
Professionell mailen: Fehler unterdrücken Formular um ein Name-Feld erweitern
210
Backslashes entfernen mit stripslashes() Prüfen! Sind alle Felder ausgefüllt?
207 211
212
Inhalt in die Formularfelder schreiben
216
Erweiterter Fehlertest: Mindestlänge und E-Mail-Check 221 Krönender Abschluss: Universal-Formmailer 10
Schlussbemerkung
231
227
Inhaltsverzeichnis
Zusammenfassung
232
Ein paar Fragen …
232
… und ein paar Aufgaben
9
233
Surfer wiedererkennen mit Cookies Was sind Cookies?
235
236
Grundeinstellungen im Browser
239
Krümelmonsters Keksfabrik: Cookies »backen« Der Keks bekommt ein MHD
243
Herumkrümeln: Cookies »verspeisen« Aufgegessen: Cookies löschen Schlussbemerkung
246
Zusammenfassung
246
Ein paar Fragen …
246
… und ein paar Aufgaben
10
244
245
246
Besucherzähler selbst gebaut
247
Zwei Dateien: So funktioniert das Beispiel Hitmaschine: Ein Textcounter Datei zum Lesen öffnen
249 250
Daten in eine Textdatei schreiben Rechtevergabe mit chmod
258
Zusammenfassung
258
Ein paar Fragen …
258
… und ein paar Aufgaben
11
252
253
Counter de luxe mit Cookies Schlussbemerkung
248
248
Der geheimnisvolle Dateizeiger
So funktioniert das Skript
241
256
257
259
Eine Umfrage mit grafischer Auswertung So sieht das Beispiel aus
261
262
Durch Komma separierte Textdatei
263
11
Inhaltsverzeichnis
Text am Trennzeichen zerlegen
266
Die unsichtbare Tabelle für das Diagramm … und wieder etwas Mathe: Dreisatz
267
268
Die Umfrageseite: So funktioniert das Skript
270
Schummeln verboten: Mehrfachvotes unterdrücken 273 … und wieder entsteht ein Array Schlussbemerkung
277
Zusammenfassung
277
Ein paar Fragen …
277
… und ein paar Aufgaben
12
274
278
Das eigene Gästebuch 279 (Zu) simpel gestrickt: Version 1
280
Hacking-Versuche unterbinden
283
Die Funktionen nl2br() und readfile() Schon besser: Gästebuch Version 2
284
So vermeidest du Doppeleinträge Gästebuch sicherer machen Schlussbemerkung
291
Zusammenfassung
292
Ein paar Fragen …
292
… und ein paar Aufgaben
13
283
286
290
292
Ein Adressbuch für dein Team Planung ist die halbe Miete
296
Geniales Tool: phpMyAdmin
298
295
Etwas SQL zum Anlegen der Datenbanktabelle Die Datentypen im Überblick
304
Trage ein paar Adressen ein!
307
Alle Teammitglieder da? Schaue nach! Daten als HTML-Tabelle ausgeben 12
312
317
Mit PHP: Eingabeformular selbst gestrickt
327
300
Inhaltsverzeichnis
Schlussbemerkung
332
Zusammenfassung
332
Ein paar Fragen …
333
… und ein paar Aufgaben
14
334
Gästebuch de luxe als Datenbanktabelle Datenbanktabelle planen
336
Daten erst einmal ausgeben
338
Das Eingabeformular entsteht
343
Mit Sicherheit: Reloadsperre und Magic Quotes Nicht alle Datensätze auf einmal
354
Links für die seitenweise Ausgabe
357
Schlussbemerkung
361
Zusammenfassung
361
Ein paar Fragen …
362
… und ein paar Aufgaben
15
348
362
Weblog für Kids: »Das Mini-CMS«
365
Pflichtenheft: Zuerst planst du das Projekt Schickes Design: Die Ausgabe aller Daten
366 368
Datenbankabfrage: Der MySQL-Teil im Überblick News von Gestern? Ältere Einträge anzeigen! Passwortschutz mit Cookie
Mehr gefällig? Hier klicken! 389
Zusammenfassung
389
Ein paar Fragen …
390
… und ein paar Aufgaben
375
379
380 383
Die Funktionen strlen() und substring() Schlussbemerkung
372
377
So bindest du die Beiträge ein HTML in PHP mit heredoc
335
385
390 13
Inhaltsverzeichnis
16
Aktivitäten verwalten: Wer kommt mit ins Kino? 391 Das Adressbuch bekommt Gesellschaft
392
Ist das noch normal? Daten aufteilen!
395
Nicht vergessen: Das Eingabeformular
399
Bitte bestätige: Name und Nutzer-ID
403
Wer kommt mit? Aus zwei mach drei!
406
SQL für Profis: Von Joins und Funktionen Schlussbemerkung
416
Zusammenfassung
417
Ein paar Fragen …
417
… und ein paar Aufgaben
17
411
417
Automatisch Geburtstagsgrüße versenden 419 MySQL und dein Dienstleister
420
ALTER TABLE: Neue Spalte mit ADD COLUMN Vorüberlegung: Pseudo-Cronjob einrichten So klappt’s: Das Geburtstags-Skript Schlussbemerkung
426
Zusammenfassung
427
Ein paar Fragen …
427
… und ein paar Aufgaben
420 421
422
428
Anhang A: Für Eltern und Lehrer
429
Anhang B: Hochladen der Seiten mit FTP Anhang C
437
Empfehlenswerte PHP-Editoren PHP und MySQL lernen
438
Stichwortverzeichnis 439 14
437
431
Vorwort PHP – was ist das? Lass mich dazu eine kleine Geschichte erzählen! Es war einmal ein Typ, der hieß Rasmus. Und Rasmus hatte eine eigene Homepage. Zugegeben, das ist heute nichts Besonderes. Doch damals (1994) besaßen die meisten Homepages den Charme einer verhauenen Mathearbeit. Es fehlte der Pfiff. Das ärgerte unseren Helden. Kurzerhand schrieb Rasmus ein paar Befehle, um seine Homepage »aufzupeppen«. Eine neue Programmiersprache war geboren! Er nannte sie Personal HomepageTools, kurz PHP. Und weil PHP so einfach war, fanden sich bald ein paar andere Computerexperten, die immer mehr »Pepp« zu PHP hinzufügten. Gemeinsam entwickelten und entwickeln sie PHP zur einer richtig coolen »HomepageAufpepp-Sprache«: Egal ob Besucherzähler oder Gästebuch – alles das konnte nun mit relativ wenig Aufwand »gebastelt« werden. Wenn du dieses Buch liest, gibt es schon die PHP-Version 5.4 oder sogar schon 6 – da ist in der Zwischenzeit also allerhand passiert. Auch auf deiner Homepage wird mit PHP bald allerhand passieren. Versprochen! Doch wozu brauchst du dieses Datenbankprogramm namens MySQL? Und was ist das genau? Das erzähle ich dir gleich! Doch vorher sprechen wir über die Sache, um die sich im Buch (fast) alles dreht … über das Programmieren.
Was bedeutet eigentlich Programmieren? Programmieren ist … wenn man dem Computer sagt, wo der Hase lang läuft. Du gibst dem Computer Befehle, die er automatisch ausführen muss. Angenommen, Lars Labertasche bestellt auf deiner Homepage drei Eimer deiner selbst gebrauten Spezial-Kaugummis mit Sprechblasen-Garantie. Dann soll der »Homepage-Computer« diese Bestellung an dich per E-Mail weiterleiten. Und zwar so schnell wie möglich. Damit der Computer das auch so macht wie du willst, schreibst du ihm alles vorher genau auf. Du gibst dem Rechner die entsprechenden Befehle und Anweisungen.
15
Vorwort
Vorwort
Und da liegt der Hase im Pfeffer: Computer verstehen kein Deutsch! Du musst wohl oder übel die Sprache der Computer lernen. Diese heißt in unserem Fall eben PHP. Wenn Lars hinterher doch 5 Eimer Lakritzschnecken oder 3 Sack Gemüsezwiebeln geliefert bekommt, hast du wohl einen Programmfehler gemacht. Aber das steht auf einem anderen Blatt. Programmfehler gehören zur Programmierer-Karriere dazu wie der »Geigerfleck« am Kinn eines Violinspielers.
Wozu sind Datenbanken da? Angenommen, dein kleines »Geschäft« auf der Homepage startet richtig durch: Lars ist inzwischen Stammkunde geworden. Neben Lars bestellen noch Lukas, Laura, Tim, Michelle und Jan regelmäßig deine selbst gekochten Kaugummis. Täglich kommen unzählige Bestellungen. Um weniger Stress zu haben, möchtest du nicht mehr jede einzelne Bestellung vom Computer geschickt bekommen. Du »befiehlst« dem Computer, alle Bestellungen in eine Liste zu schreiben. Solch eine Liste ist aufgebaut wie eine Tabelle: Alles steht fein säuberlich untereinander. Diese eine »Tabellen-Liste« wird nun als Datenbanktabelle bezeichnet. Das ist sehr übersichtlich, weil jede Bestellung in einer eigenen Zeile steht. Halt, da wäre noch eine Kleinigkeit: Wenn du Datenbanktabellen einsetzen willst, brauchst du wieder ein spezielles Programm, das Datenbankprogramm. Und hier nehmen wir MySQL. Warum? Weil MySQL viel kann, nichts kostet und sich wunderbar mit PHP verträgt. Merke dir: Eine Datenbanktabelle ist eine Art Liste in Tabellenform. Sie hilft dir, deine Daten effektiver zu speichern. Du kannst sie, musst sie aber nicht einsetzen. Eine oder mehrere zusammengehörige Datenbanktabellen werden auch als Datenbank bezeichnet. Am Beispiel eines Gästebuches zeige ich dir später, wie man es ohne und mit Datenbankunterstützung machen kann. Apropos machen …
16
Was kannst du mit PHP und MySQL alles machen?
Was kannst du mit PHP und MySQL alles machen? Fast alles! Wie wäre es mit einem Zähler? Dem eben erwähnten Gästebuch? Der Umfrage? Du möchtest die aktuelle Uhrzeit auf der Homepage anzeigen? Das Datum? Du willst dem Surfer mitteilen, dass er schon einmal auf deiner Homepage war. Kein Problem! Überprüfe, ob das Formular (z. B. für die Kaugummi-Bestellung!) richtig ausgefüllt wurde. Zeige Lars Labertasche alle Bestelldaten noch einmal an. Schreibe ein Programm, welches deinen fleißigen Bestellern bei jeder Bestellung eine Dankes-E-Mail schickt. Das Größte: Vieles davon geht sogar schon allein mit PHP. Doch ein Datenbankprogramm wie MySQL ist dann ungeschlagen, wenn viele Informationen verknüpft werden müssen. Klingt kompliziert? Nehmen wir an, du erweiterst das Angebot deines kleinen »Internet-Ladens«. Nun gibt es neben den »Kautschis« auch »Lakritzschnecken mit eingebautem Drehwurm«, »Pfefferminzbonbons mit Anisgeschmack« und andere selbst gemachte Leckereien. Wie stellst du deine Köstlichkeiten ins Netz? Du trägst alle Daten fein säuberlich untereinander in eine weitere Datenbanktabelle ein. Es gibt also eine extra Liste für deine Süßigkeiten und eine weitere Liste für die Bestellungen. Das macht es für den Computer einfacher, die Daten zu verwalten, weil alles wunderbar geordnet ist. Doch damit nicht genug. Weise den Computer an, Bestellung und Adressdaten in getrennten Tabellen zu führen. Das ist ungeheuer praktisch, denn nun muss Lars seine Daten nicht bei jeder Bestellung neu eingeben. Er bekommt einfach eine Nummer und wird jedes Mal anhand dieser Nummer vom Computer wiedererkannt. Lange Rede, kurzer Sinn: Im Endeffekt hast du ein richtiges kleines System von miteinander verknüpften Datenbanktabellen. Für jeden Zweck gibt es die passende Tabelle: Eine für die Produkte, eine für die Kunden und eine für die Bestellungen. Alle Tabellen gehören zusammen: Das ist ungeheuer praktisch und effektiv. Damit hast du eine tolle Datenbank geschaffen! Wenn du dieses Prinzip verstanden hast, kannst du praktisch alles mit PHP und MySQL machen. Und dieses tolle Prinzip schauen wir uns in den letzten Kapiteln des Buches und auch im Fortsetzungsband »PHP und MySQL Praxisbuch für Kids« etwas näher an. 17
Vorwort
Vorwort
Was ist ein Webserver und wozu brauchst du den? Was zum Teufel ist denn nun der Webserver? Es ist dein »HomepageComputer«. Also der Rechner, auf dem deine Homepage liegt. ‚Moment mal’, denkst du hier vielleicht. ‚Meine Homepage liegt doch z. B. auf meinem Rechner daheim. Dort habe ich sie erstellt und dort kann ich sie mir jederzeit ansehen.’ Das stimmt schon, an deinem Rechner kannst du deine Homepage sehen. Und du kannst sie deinen Kumpels zeigen. Doch damit alle etwas von deinen Seiten haben, musst du diese erst auf den »Homepage-Computer« im Web hochladen. Also auf den sogenannten Webserver. Das Wort Server kommt vom Englischen to serve. Das bedeutet soviel wie »dienen«. Der Webserver ist der Diener im Web. Hier liegen die Webseiten, die Homepages. Der Webserver dient so allen Besuchern. Denn die Besucher können die Seiten nun vom Webserver abrufen und mit ihrem Browser betrachten. Der Webserver sorgt übrigens auch dafür, dass PHP und MySQL richtig gut funktionieren. Er führt also die von dir aufgeschriebenen Programmbefehle aus. Erst dann zeigt er dem Besucher die gewünschte Seite. Der bekannteste und beste Webserver heißt übrigens Apache. Ja richtig, Apache wie der gleichnamige Indianerstamm. Bei solch einem tollen Namen muss die Sache ziemlich cool sein. Das ist sie auch! Die Arbeit mit PHP, MySQL und dem »Apachen« macht irrsinnigen Spaß. How!
Wie arbeitest du mit diesem Buch? Lahmes Lesen ist out, Selbermachen ist in: Dieses Buch enthält nicht nur sturen Text und öde Programmanweisungen, sondern vor allem Beispiele, Tipps und Tricks. Mitmachen ist also Pflicht. Es lohnt sich!
18
Doch wenn du mal keine Lust zum Abschreiben hast (oder dich immer wieder verschreibst), ist das auch nicht schlimm! Ich habe dir alle Beispiele auf die CD gepackt. Ansonsten zeige ich dir schnell noch, welche Symbole besonders wichtig sind.
Was brauchst du für dieses Buch?
Arbeitsschritte
>
Wenn du dieses Zeichen siehst, heißt das: Achtung, Action! Es gibt etwas zu tun. Schreibe eine Programmzeile, wähle einen Befehl oder führe einen Indianer-Freudentanz auf, weil dein Programm endlich funktioniert.
Stolperfallen und »Rettungsringe« Dieses Symbol findest du dagegen immer dann, wenn es problematisch wird. Hund Buffi hilft dir, Stolperfallen von vornherein zu umgehen. Lies also besonders gründlich, wenn du auf dieses Zeichen stößt. Vielleicht ist das ja gerade der »Rettungsring«, den du in diesem Moment brauchst? Aber auch Tipps und Tricks bauen wir in solche Kästen ein.
Besonders wichtige Stellen im Buch Immer wenn solch ein Ausrufezeichen am Textrand erscheint, wird es besonders wichtig. Du solltest den entsprechenden Kasten vielleicht zweimal lesen.
Fragen und Aufgaben Wiederholung ist die Mutter der Porzellankiste (oder so ähnlich). Deshalb gibt es am Ende jedes Kapitels ein paar Fragen und ein paar Aufgaben. Wie heißt es so schön: Übung macht den Meister. Die Antworten und die Lösungen zu den Aufgaben findest du auf der beiliegenden CD.
Was brauchst du für dieses Buch? Nun, einen Platz im Bücherregal. Spaß beiseite, natürlich einen Computer! Es muss nicht einmal der allerneuste Rechner sein. Hauptsache Windows und ein Internet-Browser sind vorhanden. Wir geben uns dabei ganz bescheiden, es müssen nicht die neusten Versionen sein. Du kannst sogar noch Windows 98 verwenden. Oder natürlich Windows 2000, Me bzw. das aktuelle Windows XP. Vom Prinzip her ist das Vorgehen bei allen Versionen gleich. Sollte es hier Unterschiede geben, mache ich dich rechtzeitig darauf aufmerksam.) Bei den Browsern ist Firefox sicher die beste Wahl, aber auch der Internet Explorer, Opera, Safari oder Google Chrome sind geeignet.
19
Vorwort
Vorwort
Alles andere findest du auf der CD! Mehr brauchst du nicht! Tatsache, um den Rest musst du dich nicht kümmern. Auf CD liefern wir dir alles andere mit, damit du sofort loslegen kannst. Hier findest du unter anderem: 0 PSPad – eine sehr gute Windows-Freeware zum Erstellen von Homepages mit PHP, ein Programm vom Ja Fiala. 0 Aptana Studio, die auf Java basierende Alternative für Nutzer von Linux und Mac OS. (Aber auch für Windows-Nutzer!) 0 PHP selbst (zum Programmieren der dynamischen Webseiten) und MySQL (das Datenbankprogramm, um mit Datenbanktabellen Ordnung zu schaffen) 0 phpMyAdmin (eine Art grafische Oberfläche für MySQL, damit du Datenbanken und Tabellen bequem einrichten kannst) 0 Apache-Webserver (damit du alles auf dem eigenen Computer ausprobieren kannst und so tust, als ob du einen eigenen Webserver hättest. How!) 0 XAMPP: Ein Super-Programm, welches dir alle bisher genannten Sachen fast vollautomatisch auf deinem Rechner einrichtet 0 FileZilla, ein Programm zum Hochladen deiner Homepage auf den Webserver 0 SELFHTML, eine schon fast zu profimäßige Einführung in HTML, die Sprache zum Erstellen von Homepages 0 NotePad++, ein flinker Windows-Editor zum schnellen Bearbeiten von PHP-Dateien.
Wie gut kommst du mit dem Computer klar?
20
Du solltest dich schon ein wenig mit dem Computer auskennen. Du kommst mit Maus und Tastatur klar? Prima! Dann kann kaum etwas schief gehen. Wenn du zusätzlich noch weißt, was Ordner sind und wie man diese anlegt, gehörst du schon in die Profi-Liga. (Und wenn nicht, ist das halb so wild, ich zeige es dir.) Im Notfall fragst du einfach deine Freunde, Geschwister oder Eltern. Vielleicht kennen die sich ja aus. Oder sie spendieren dir ein anderes Buch aus der Reihe »für Kids«? Zum Beispiel »PCs für Kids« (zu Windows Vista) von Hans-Georg Schumann.
Wie gut kommst du mit dem Computer klar?
Was ist neu in Auflage 4 und 5? Fünf Auflagen in fünfeinhalb Jahren – das hätte sich der Autor dieses Buches nicht träumen lassen. Die erste Auflage erschien 2003, die fünfte 2008. Vielen Dank für das große Vertrauen! Wir freuen uns riesig über diesen Erfolg. Grund genug, den gesamten Inhalt kritisch zu überprüfen und behutsam zu modernisieren. Soviel vorweg: Schon in der vierten Auflage von 2007 gab es umfangreiche Neuerungen, Ergänzungen und Erweiterungen! Hier ging es vor allem um das Thema Sicherheit. Die fünfte Auflage haben wir nochmals durchgesehen und an vielen Stellen verbessert.
Wichtig: Das Thema Sicherheit Besonders das Thema Sicherheit spielt inzwischen eine immer wichtiger werdende Rolle. Die Spamattacken werden immer heftiger, die Hacker immer dreister. Selbst große Programme wie das Content-ManagementSystem Joomla oder Foren wie phpBB werden bzw. wurden Opfer von Hackerattacken. Aus diesem Grund haben wir schon für Auflage 4 alle Skripte auf Sicherheit hin überprüft und in manchen Fällen etwas erweitert. Außerdem geben wir dir an vielen Stellen wertvolle Tipps und Tricks, wie du deine Skripte von vorn herein gegen Angriffe von außen schützen kannst. Sicherheit ist ein Prozess, kein Zustand. Was heute noch als sicher gilt, kann morgen möglicherweise schon erfolgreich gehackt werden. Auch ist der Aufwand für absolut sichere Skripte so hoch, dass du alleine für ein wirklich sicheres Gästebuch mehrere hundert Zeilen Code schreiben müsstest. Wir versuchen, den Mittelweg zu finden zwischen einfacher Verständlichkeit und Durchschaubarkeit auf der einen Seite und Sicherheit der Skripte auf der anderen Seite. Man kann es noch immer und immer ein Stückchen aufwendiger treiben. Aber an irgendeiner Stelle muss dann auch Schluss sein.
Videoworkshops In Auflage 4 haben wir erstmals Videoworkshops eingefügt. In diesen Videos führen wir dir beispielsweise die Installation von PHP und MySQL mit dem Tool XAMPP vor, damit du sofort mit dem Programmieren loselegen kannst. Du findest alle Videos im Ordner videos. Rufe die Datei index.html auf. Die Videos liegen im Flashformat vor. Mehr Informationen findest du in der Datei liesmich.txt.
21
Vorwort
Vorwort
Was ist neu in Auflage 6? Wenn du dich bisher gewundert hast, kann ich dich beruhigen: Du hast das richtige Buch erwischt. Vor dir liegt tatsächlich schon die sechste Auflage von 2010. Und das kam so: Kurz vor Weihnachten 2009 erreichte mich der Hilferuf aus dem Verlag: »Wir haben nur noch ganz wenige Exemplare auf Lager. Der Titel ist schneller ausverkauft als gedacht. Wir würden das Buch am liebsten sofort in einer neuen Auflage drucken!« Sofort war ein echtes Problem. Denn für eine weitere Auflage hatte ich mir ganz heftige Aktualisierungen vorgenommen. Ich wollte die Inhalte im Buch grundlegend modernisieren und meine Anleitungen für die Zukunft fit machen. Das bedeutet: 0 Alle HTML- bzw. PHP-Dateien müssten im immer weiter verbreiteten Universalzeichensatz Unicode (UTF-8) gespeichert werden. Denn vielleicht möchtest du auch einmal fremdsprachige Seiten mit allen möglichen Sonderzeichen erstellen und pflegen? Mit UTF-8 kannst du selbst »Chinesisch rückwärts« darstellen, deutsche Umlaute und Sonderzeichen sowieso. Und da inzwischen auch MySQL die Daten im Format UTF-8 sichert, wäre das auch aus diesem Grund sehr wichtig. 0 Dafür müsste ich einen neuen, Unicode-fähigen PHP-Editor finden, denn der gute alte Weaverslave von Thomas Weinert (der Editor der ersten fünf Auflagen) wäre mit dem Thema UTF-8 leider überfordert. Schade, Thomas, dass du noch keine Zeit zum Aktualisieren hattest! Schön, dass ich mit PSPad von Jan Fiala einen guten Ersatz gefunden habe. 0 Außerdem müsste ich beim Thema »Datenbankzugriff« auf die moderneren PHP 5-Funktionen zurückgreifen. Schon aus Sicherheitsgründen! PHP 5 ist inzwischen der Mindeststandard, praktisch alle Anbieter haben von PHP 4 auf PHP 5 umgestellt! Und veraltete Techniken gehören nun mal nicht in ein PHP- und MySQL-Lehrbuch. Eine Menge Arbeit – im Interesse der Sicherheit! 0 Die Installation des sogenannten lokalen Webservers (wir verwenden im Buch XAMPP) hat sich geändert. Auch hier müsste ich eine komplett neue Anleitung schreiben. 0 Auch die Informationen zu den Dienstleistern müsste ich aktualisieren, denn innerhalb eines Jahres kann viel geschehen.
22
0 Weiterhin wäre es schön, wenn ich mehr Tipps für Mac- und LinuxNutzer einbauen könnte, denn vor allem der Apple Macintosh gewinnt immer mehr Freunde. (Auch wenn es nur bei Tipps bleiben wird – für ausführliche Anleitungen fehlt leider der Platz.)
Was ist neu in Auflage 6? Nun, was soll ich dir schreiben: Ich habe es geschafft! Die vollständig aktualisierte 6. Auflage liegt vor dir. Weihnachtsbaum, Kerzenschein und Bescherung sind ausgefallen – Silvesterparty und Katerfrühstück auch! Dafür habe ich Tag und Nacht geschrieben, recherchiert, Code getippt und Code geprüft. Bis kurz vor dem Drucktermin. Denn das bin ich dir schuldig – eine gut verständliche PHP-Anleitung auf der Höhe der Zeit. Und wenn das Buch so gut ankommt wie die Vorauflagen, hat sich die Mühe auf jeden Fall gelohnt! Danke für dein Vertrauen! Danke auch an die vielen, vielen Leser, die mir Tipps, Korrektur- und Verbesserungsvorschläge geschickt haben. Ganz besonderer Dank geht an Sandra, Jonas und vor allem an Falk Joensson (http://jcoud.de). Gerade du, Falk, hast mir mit deinen umfangreichen Korrektur- und Verbesserungsvorschlägen sehr geholfen. Nobody is perfect und ich schon gar nicht. Wie gut, dass es solche aufmerksamen Leser gibt wie dich!
Das Betriebssystem spielt keine Rolle! Wundere dich nicht, wenn im Buch mal der eine oder andere Browser auftaucht. Der Grund ist ganz einfach: Ich habe die Anleitungen auf verschiedenen Rechnern getestet. Ich zeige dir sowohl Abbildungen vom Internet Explorer 8 unter Windows 7 als auch Bildschirmfotos des alten Internet Explorer 6 aus Windows XP. Auch Firefox ist natürlich vertreten. Warum diese Vielfalt? Du sollst sehen, dass das Ergebnis nicht vom Betriebssystem oder Browser abhängt. HTML, PHP und MySQL sind plattformunabhängig, sie laufen überall! Selbst auf dem Macbook Pro mit Snow Leopard oder dem altersschwachen Schulrechner mit Windows 2000 oder Linux. Im Web beim Dienstleister sowieso – und der arbeitet in der Regel unter Linux! Hauptsache, du hast das richtige Webserver-Programm und den passenden Code-Editor. Apropos Code-Editor: Da die meisten Leser mit Windows arbeiten, kommt der im Buch vorgestellte Code-Editor PSPad aus der WindowsWelt. Er ist schlank und schnell und läuft daher auch auf älteren Rechnern. Du kannst den Anleitungen jedoch auch an Macs oder LinuxRechnern folgen. Verwende lediglich ein anderes Entwicklungswerkzeug, einen anderen Editor. Programmcode und Ergebnis bleiben gleich. Für Mac- und Linux-Nutzer empfehle ich Aptana Studio. Du findest dieses Tool auf der CD im Ordner programme/aptana. Aptana Studio ist sehr leistungsfähig, benötigt dafür aber einen schnellen Rechner.
23
Vorwort
Vorwort
Wo gibt’s Hilfe, wenn es mal klemmt? Melde dich einfach! Für dieses Buch hat der Autor eine eigene Serviceseite im Web eingerichtet. Surfe zu www.phpkid.de! Hier findest du ein Forum, wo du mit anderen Lesern diskutieren und dir Hilfe holen kannst. Weiterhin listen wir brandheiße Tipps und Tricks zu Dienstleistern auf und informieren dich zu Änderungen nach dem Druck. Außerdem kannst du Fragen stellen, die wir dir dann hoffentlich schnell beantworten. Und du findest evtl. Fehlerberichtigungen, denn auch Autoren sind nur Menschen. Du hast Lust bekommen auf mehr? Dann legen wir dir die Fortsetzung dieses Titels namens »PHP und MySQL Praxisbuch für Kids« (2. Auflage) sehr ans Herz. Dabei stehen auf dem Programm: ein komplettes Forum mit Userverwaltung, das Schreiben eines RSS-Feedreaders, ein komfortables Fotoalbum und sogar das Planen und Programmieren eines Content-Management-Systems. Ganz nebenbei schnupperst du sogar noch ein wenig Objektorientierungsluft und lernst, wie man richtig guten Code schreibt. Gleicher Autor, gleicher Verlag, gleicher Preis. Voilà - jetzt geht es aber los mit PHP und MySQL! Doch zuvor lernst du noch etwas HTML und CSS. Gleich auf den nächsten Seiten. Einverstanden?
24
1 Deine coole Homepage mit HTML Auf los geht’s los! Wenn du mit PHP programmieren willst, musst du HTML können. HTML ist schließlich die Sprache, mit der eine Homepage geschrieben wird. Ohne HTML macht PHP keinen Sinn. Du kannst noch kein HTML? Nicht schlimm! In diesem Kapitel lernst du das Wichtigste zum Thema. Glaube mir, es ist kinderleicht. Na ja, fast … Du kannst schon HTML? Umso besser! Mache trotzdem mit, denn in diesem Kapitel zeige ich dir ein super Programm: einen sogenannten HTML- und PHP-Editor. Und ich verrate dir, wie du dein Projekt am besten organisierst. In diesem Kapitel lernst du, $ wie man eine HTML-Seite erstellt $ wie man Überschriften und Absätze notiert $ wie man Grafiken in die Seite einfügt und mit Farben arbeitet $ wie man Querverweise setzt, die Hyperlinks $ wie man Tabellen erstellt $ wie man der Seite mit Style Sheets ein schickes Layout verpasst Doch bevor es losgeht, besprechen wir gleich zu Beginn ein paar Dinge, die verdammt wichtig sind.
25
Kapitel
1
Deine coole Homepage mit HTML
Richte dir einen Projektordner ein! Ordnung ist das halbe Leben, geht dir dieser Spruch auch so auf die Nerven wie mir? Dabei kann ein wenig Ordnung im Nachhinein viel Zeit sparen! Und schon sind wir beim Thema Ordner. Richte dir zuerst einen Projektordner für deine Experimente ein. Diesen nennen wir phpkid und legen ihn direkt unter der FESTPLATTE C: ab!
Projektordner phpkid einrichten Wie geht das? Ganz einfach!
26
>
Starte zuerst den Windows Explorer. Die coolste Methode: Du hältst die Taste [Win] auf deiner Tastatur gedrückt. Das ist in der Regel die zweite oder dritte Taste von links in der unteren Reihe. Du erkennst sie am Windows-Logo. Jetzt tippst du mutig und unverzagt ein [E] wie »echt einfach« oder wie »Explorer«. Zack – schon startet das »Ordner-Verwaltungs-Programm« namens Windows Explorer.
>
Was nun, sprach das Huhn? Achte darauf, dass dein Laufwerk C: (die Festplatte) markiert ist. Klicke also auf der linken Seite auf das Symbol für deine FESTPLATTE. Es befindet sich unterhalb des Symbols COMPUTER (Windows 7 bzw. Vista) bzw. ARBEITSPLATZ (Windows XP).
>
Und nun richtest du deinen Ordner ein. In Windows 7 klickst du einfach auf die Schaltfläche NEUER ORDNER:
In Windows Vista gibt es diese praktische Schaltfläche leider noch nicht. Dort klickst du auf den Menüeintrag ORGANISIEREN und wählst den Menüpunkt NEUER ORDNER. In Windows XP und Windows 2000 ist der Weg noch etwas länger. Du klickst im Menü DATEI auf den Befehl NEU. Ein weiteres Menü klappt zur Seite. Wähle hier den Befehl ORDNER.
Richte dir einen Projektordner ein!
>
Jetzt erscheint ein Platzhalter-Ordner mit der Bezeichnung Neuer Ordner. Dieser Platzhaltername ist markiert. Du kannst ihn also direkt überschreiben. Klicke noch nirgends, sondern tippe einfach los. Tippe den Namen des neuen Ordners, im Beispiel phpkid.
>
Geschafft? Dann drücke einfach [Enter]! Fertig ist der neue Ordner.
Suche doch einmal deinen neuen Ordner. Du findest ihn im linken Bereich des Windows-Explorers. Er wird alphabetisch zwischen den anderen Ordnern einsortiert. Sollte dein Ordner nicht gleich zu sehen sein, ist das nicht schlimm. Der Windows Explorer ist manchmal ein »langsamer Geselle«, er vergisst das Aktualisieren der Ansicht. Hilf etwas nach, drücke auf die Funktionstaste [F5] auf deiner Tastatur. Hoppla, du hast dich beim Ordnernamen verschrieben? Oder der Ordner wurde an der falschen Stelle eingerichtet? Kein Problem! Wenn du einen Ordner umbenennen willst, klickst du ihn kurz an. Drücke nun die Funktionstaste [F2]. Schon »öffnet« sich der Ordnername und du kannst ihn korrigieren. Bestätige die Umbenennungsaktion wieder mit [Enter]. Natürlich lässt sich so ein Ordner auch löschen. Markiere ihn und drücke die Taste [Entf] auf deiner Tastatur. Schon ist der Ordner weg!
Einen weiteren Unterordner einrichten Weil das so gut geklappt hat, machen wir es gleich noch einmal. Erstelle diesmal einen Unterordner namens html. Dieser Ordner soll direkt unterhalb von phpkid entstehen. Diesen neuen Ordner nutzen wir für unsere ersten Gehversuche mit HTML.
>
Markiere den Ordner phpkid im Windows Explorer. Klicke ihn also im linken Bereich an.
>
Wähle nun wieder NEUER ORDNER (ORGANISIEREN|NEUER ORDNER bzw. DATEI|NEU|ORDNER) und richte den Unterordner html ein.
Gewöhne dir bei der Namensgebung für Ordner und Dateien generelle Kleinschreibung an. Die Ordner sollen also phpkid und html und nicht Phpkid und Html heißen. Das ist deshalb so wichtig, weil der Webserver (Homepage-Computer) später ganz pingelig zwischen Groß- und Kleinschreibung unterscheiden wird. Und wenn du hier etwas vermischst, wird die Homepage im Web nicht oder nicht richtig angezeigt. Bei genereller Kleinschreibung kann hier jedoch nichts »anbrennen«. Okay? 27
Kapitel
1
Deine coole Homepage mit HTML
Bitte blende die Dateiendungen ein! Ärgert dich auch, dass du unter Windows die Dateiendungen normalerweise nicht siehst? Jede Datei hat ja eine typische drei- bis vierstellige Endung, die nach einem Punkt an den eigentlichen Dateinamen angehängt wird. Mit .doc kennzeichnet man Word-Dateien, .txt steht für Textdateien, .html für HTML-Dateien und .php für PHP-Dateien. Normalerweise siehst du diese Endungen nicht. Das ist sehr ärgerlich, denn wir brauchen sie! Für unseren Kurs musst du die Dateiendungen unbedingt eingeschaltet haben!
>
Rufe den Windows Explorer auf. Wie ging das noch? Halte dafür beispielsweise die [Win]-Taste auf deiner Tastatur gedrückt und tippe kurz ein [E]. Wähle nun im Menü ORGANISIEREN den Befehl ORDNER UND SUCHOPTIONEN. (Windows XP: EXTRAS|ORDNEROPTIONEN.)
>
Geschafft? Das Dialogfenster Ordneroptionen erscheint. Gehe ins Register ANSICHT, es ist das zweite Register.
>
Suche nach einer Option, die je nach Windows-Version folgendermaßen heißt: Erweiterungen bzw. Dateinamenerweiterungen bei bekannten Dateitypen ausblenden. Sie ist abgehakt. Nimm das Häkchen weg!
>
Bestätige deine Einstellungen durch Klick auf OK. Nun siehst du bei allen Dateinamen auch die typische Endung und weißt genau, um welchen Dateityp es sich handelt.
Nimm das entsprechende Häkchen weg, klicke es einfach an!
HTML auf Knopfdruck – mit PSPad
28
Vorhang auf, die Show beginnt. Nele, Tim und Buffi, Jan (Programmautor) und ich (Buchautor) präsentieren: PSPad, den freien Code-Editor für Windows! Es handelt sich praktisch um ein Programm zum Schreiben deiner Homepage. Neben HTML beherrscht PSPad aber auch PHP und andere Programmiersprachen. Geschrieben hat das tolle Programm Jan Fiala, die Homepage von PSPad findest du unter www.pspad.com.
HTML auf Knopfdruck – mit PSPad
So wird PSPad installiert PSPad liegt auf der CD für dich bereit! Die Installation ist kinderleicht und erfolgt Schritt für Schritt per Setup Wizard (Installationsassistent).
>
Starte den Windows Explorer, z. B. durch Gedrückthalten von [Win] (die Taste mit dem Windows-Logo) und kurzem Tippen von [E]. Schaue in den linken Bereich des Windows Explorers. Gehe zum Laufwerk für die CD und hangele dich durch bis zum Unterordner programme/pspad.
>
Hier siehst du die Datei pspad454inst_en.exe. Doppelklicke auf diese Datei. Je nach Windows-Version erscheinen erst warnende Dialogfenster, die du bestätigen musst. Klicke z. B. auf AUSFÜHREN bzw. JA.
>
Geschafft? Das Fenster Welcome to the PSPad Editor Setup Wizard ist erschienen? Prima! Folge den Schritten der Installation.
>
Klicke auf NEXT, um zum nächsten Bildschirm zu gelangen. Klicke vor I accept the agreement. Nun klickst du erneut auf die Schaltfläche NEXT und hangelst dich Schritt für Schritt durch die gesamte Installation!
>
Klicke also immer wieder auf NEXT. Die Voreinstellungen gehen in Ordnung, die kannst du stets übernehmen.
>
NEXT verschwindet, die Schaltfläche INSTALL erscheint? Dann hast du eine weitere Etappe auf deinem Weg erreicht. Klicke auf INSTALL – jetzt endlich wird das Programm auf deiner Festplatte eingerichtet!
>
Klicke zum Schluss auf FINISH. Das Programm startet ganz automatisch – und zwar auf Deutsch!
Wenn du das entsprechende Häkchen im letzten Schritt belassen hast, legt PSPad automatisch eine Verknüpfung auf dem Desktop an. Außerdem erscheint es als Programmeintrag in der sogenannten Schnellstartleiste rechts neben der START-Schaltfläche! Das ist wirklich genial!
29
Kapitel
1
Deine coole Homepage mit HTML
Eine HTML-Datei erstellen PSPad ist gestartet? Jetzt erstellst du im Handumdrehen deine erste HTMLSeite. Doch vorher sollten wir uns noch für die »richtige« HTML-Variante entscheiden. Ich schlage das klassische HTML 4 vor. Hast du schon etwas Ahnung von HTML? Fragst du dich auch, welches die »richtige« HTML-Schreibweise sei? Die »klassische« oder die Neuformulierung namens XHTML mit strengeren Regeln? Fakt ist, dass die Entwicklung von XHTML als eigenständige Sprache gerade erst eingestellt wurde. An HTML 5 dagegen wird fleißig gewerkelt – der Klassiker lebt also weiter. Zwar wird es auch von HTML 5 wieder eine strengere »XHTML-Variante« geben. Aber eben nur als alternative Syntax. Wir bleiben daher im Buch bei der Schreibweise der bewährten, klassischen Version 4.01 – und zwar ohne X vor dem HTML. Und so erzeugst du in PSPad eine Musterseite im »klassischen HTML 4.01«:
>
Wähle im Menü DATEI den Befehl NEU. Das Dialogfenster Neu erscheint. Klicke auf die Registerzunge Neue Datei aus Vorlage erstellen.
>
Scrolle zum Zweig HTML und klicke auf den Eintrag HTML 4.01 Transitional. Klicke danach auf BEARBEITEN, nicht auf OK. (OK würde eine neue HTML-Seite in den Editor einfügen, die auf diesem Grundgerüst beruht. Doch das Grundgerüst ist noch nicht ganz perfekt!)
Klicke auf die Schaltfläche »Bearbeiten«, noch nicht auf »OK«.
> 30
Du hast auf BEARBEITEN geklickt? Super! Jetzt erscheint das eben erwähnte Grundgerüst. Und zwar direkt als Vorlage! Du kannst und musst diese Grundgerüst-Vorlage wunschgemäß ändern.
HTML auf Knopfdruck – mit PSPad
Die HTML-Vorlage von PSPad anpassen So sieht es aus – das HTML-Grundgerüst. Für meinen Geschmack gibt es noch einige Schönheitsfehler. Und bevor wir die einzelnen Zeilen genauer betrachten, merzen wir diese Schönheitsfehler einfach aus. Die von mir gezeigten Zeilennummern sind bei dir in PSPad nicht sichtbar? Wähle ANSICHT/ZEILENNUMMERIERUNG. 1
Soviel vorweg: HTML besteht aus Text, der durch sogenannte Tags gesteuert wird. Jedes Tag steht in spitzen Klammern. Es gibt in der Regel ein Tag zum Einschalten und eins zum Abschalten. Das Abschalt-Tag bekommt zusätzlich einen Slash (/) vorangestellt. Die Taste mit den spitzen Klammern findest du links unten auf der Tastatur. Drücke [<] für die öffnende spitze Klammer. Für die schließende Klammer > musst du zusätzlich die [ª]-Taste gedrückt halten. Die Dinge, die mich stören, habe ich unterstrichen. Es sind zum Glück nicht viele. In Zeile 2 änderst du das cs in de. (Es sei denn, du möchtest deine Webseiten auf Tschechisch erstellen. Unser Programmautor Jan stammt aus Tschechien, das ist der Grund für cs.) Die Passage windows-1250 am Ende von Zeile 4 ersetzt du durch utf-8. UTF-8 ist der Universalzeichensatz, der die Zeichen aller wichtigen Sprachen enthält. Damit decken wir einen viel weiteren Bereich an Sprachen ab als mit dem Windows-Zeichensatz. Schließlich ist Windows nicht der Nabel der Welt!
31
Kapitel
1
Deine coole Homepage mit HTML Zeile 5 <meta name="generator" content="PSPad editor … usw. kann entfallen. Niemand muss wissen, dass wir die Seite mit PSPad generiert (erzeugt) haben! Schließlich schreibst du sie per Hand. Zeile 6 Untitled ist so wichtig, diese Zeile möchte ich gerne direkt unterhalb von platzieren. Das ist erlaubt! Dann rutscht die Zeile mit dem Zeichensatz einfach eine Etage tiefer. Außerdem ersetze ich den Platzhaltertext Untitled durch Hier Titel eintragen. Damit du nie vergisst, den wichtigen Seitentitel einzutragen!
Das perfekte HTML-Grundgerüst Und so sieht das perfekte HTML-Grundgerüst für unseren Kurs aus: 1
2 3 4 5
Hier Titel eintragen <meta http-equiv="content-type" content="text/html; charset=utf-8">
6 7 8 9 10
Die »Umbruchpfeile« signalisieren, dass die Zeile noch weitergeht. Beachte das Leerzeichen!
Du findest dieses Grundgerüst auch auf der Buch-CD. Schaue in den Ordner beispiele\kapitel01 und öffne die Datei html-grundgeruest.txt. Schreibe nicht nur utf-8, sondern stelle in PSPad unbedingt auch das Format UTF-8 ein: Wähle dafür im Menü FORMAT den Befehl UTF-8. Nur dann werden deine Umlaute und Sonderzeichen richtig dargestellt! In einigen Kapiteln jedoch müssen wir eine Ausnahme machen. Dort schreiben wir statt utf-8 einfach iso-8859-1. Wir wählen außerdem FORMAT|ANSI. Das beugt Problemen mit Umlauten beim Versenden von E-Mails vor. Ich mache dich rechtzeitig darauf aufmerksam!
32
Und nun brauchst du diese aktualisierte Vorlage nur noch zu speichern. Wähle DATEI|SPEICHERN. Vorlagen legt PSPad automatisch im Ordner Template ab. Im Beispiel findest du die bearbeitete Datei unter dem Pfad C:\Programme\PSPad Editor\Template\HTML 4.01 Transitional.html.
HTML auf Knopfdruck – mit PSPad
Eine HTML-Datei erstellen Voilà – jetzt endlich erzeugst du eine HTML-Seite. Wähle wieder DATEI|NEU, Register Neue Datei aus Vorlage erstellen. Navigiere erneut zum Zweig HTML und … diesmal doppelklicke gleich auf HTML 4.01 Transitional. (Markieren und Klick auf OK geht auch.) Erneut entsteht das oben gezeigte, ideale Grundgerüst einer HTML-Datei. Allerdings nicht als Vorlage, sondern gleich als HTML-Datei. Und die schauen wir uns jetzt etwas genauer an! Die lange Zeile 1 ist eine Ausnahme, eine reine Formalie. Dahinter steckt die sogenannte Dokumenttypdeklaration (kurz DTD). Damit zeigen wir, dass es sich um HTML in der Version 4.01 handelt (»Übergangsfassung«). Zu lang, das Biest? Von dieser DTD gibt es zum Glück auch eine Kurzform:
Aus Platzgründen verwende und zeige ich im Buch ab Kapitel 2 nur noch die Kurzform. Soviel vorweg: In HTML 5 soll das ganze DTD-Gebilde drastisch verkürzt werden: . Zum Glück! Der eigentliche Beginn steckt im Tag , hier geht es los. Wie die meisten Tags tritt auch dieses Tag paarweise auf: Auf das Einschalt-Tag folgt ein Ausschalt-Tag. In Zeile 10 wird das Tag per wieder abgeschaltet! Im Tag befindet sich das Attribut lang mit dem Wert de. Damit zeigen wir, dass diese Webseite in Deutsch verfasst ist. Als nächstes folgt der Kopf, der »Head«. Dieser steckt »zwischen« den Tags , also zwischen Zeile 3 und Zeile 6. Wichtig ist der Titel (). Was du zwischen diesen Tags notierst, erscheint
später in der Titelzeile des Browsers. Also in der blauen Leiste ganz oben.
>
Trage hier doch einmal etwas Sinnvolles ein. Ersetze Hier Titel eintragen einfach durch den Text Homepage von Computerhund Buffi!
Was bedeutet Zeile 5? Mit diesem sogenannten Meta-Tag lege ich den Zeichensatz fest. Mit charset=utf-8 sorge ich dafür, dass du mit Umlauten wie ä, ö, ü und dem ß arbeiten kannst. Ein Ausschalt-Tag ist in diesem Fall ausnahmsweise nicht nötig. Meta-Tags treten nicht paarweise auf. Früher wurden Umlaute und Sonderzeichen wie das ß umschrieben. Statt ä schrieb man z. B. ä und aus ö wurde ö usw. usf. Das ß wurde durch ß ersetzt. Dank utf-8 ersparen wir uns diese Qual und ermöglichen den Einsatz praktisch beliebiger Zeichen. Deine Homepage ist damit gleich gut gerüstet für alle Sprachen der Welt!
33
Kapitel
1
Deine coole Homepage mit HTML In Zeile 7 wird der »Körper« des Dokuments eingeschaltet, der sogenannte »Body«. Zeile 9 schaltet den Body wieder ab.
Speichern nicht vergessen! Vergiss nicht, dein Projekt zu speichern. HTML-Dokumente sind Textdokumente. Sie werden mit der Endung htm bzw. html versehen. Ich schlage den Namen index.html vor. Warum? Eine Hauptseite wird in aller Regel index.html genannt! Und so speicherst du in PSPad:
>
Wähle im Menü DATEI den SPEICHERN-Befehl (oder tippe die Tastenkombination [Strg] + [S], das geht viel fixer!). Das Dialogfenster zum Speichern erscheint, der Fokus steht auf dem Feld Dateiname.
>
Tippe den Dateinamen ein, im Beispiel index.html. Navigiere zu dem Ordner, in dem du speichern möchtest. Im Beispiel gehst du zu C:\phpkid\html – im Feld Speichern in muss jetzt html stehen.
>
Klicke auf SPEICHERN, um die neue HTML-Datei zu sichern.
Achte darauf, die Datei im richtigen Ordner abzulegen!
>
Schaue in den linken Bereich, zum Toolfenster mit dem Mini-Explorer. Diesen Mini-Explorer erreichst du über das zweite Register. Navigiere hier zu dem Ordner, in dem du gespeichert hast. Im Beispiel gehst du zu C:\phpkid\html und klickst den Ordner html an.
>
Im unteren Bereich des Toolfensters findest du die Dateiliste. Hier sollte die index.html als Symbol zu sehen sein. Hat es geklappt?
Du kannst dieses pfiffige Toolfenster auch ausblenden. Wähle ANSICHT|TOOLFENSTER oder die Tastenkombination [Strg] + [F2]. Eine erneute Wahl dieses Befehls blendet das Toolfenster wieder ein. 34
So wird’s perfekt: Überschriften, Absätze und mehr
So wird’s perfekt: Überschriften, Absätze und mehr Und, wie schaut’s aus? Bewundere deine Seite doch einmal in der Vorschau! Dafür bietet dir PSPad folgende zwei Möglichkeiten:
Öffnen im internen Browser Das Öffnen im internen Browser ist ganz einfach. Drücke die Funktionstaste [F10], klicke das »Weltkugel-Symbol« an oder wähle HTML|VORSCHAU IM INTERNEN BROWSER. Schon öffnet sich ein neues Fenster und zeigt deine Seite.
Noch besser jedoch ist die externe Browservorschau. Dabei öffnet sich der Browser in einem eigenen Fenster und du hast den vollen Überblick. Nur hier wird auch der ungeheuer wichtige Seitentitel dargestellt, also der Text zwischen den Tags .
Öffnen im externen Browser Schaue in den linken unteren Bereich, zum Toolfenster. Wähle oben das zweite Register, das mit dem Ordnersymbol. Achte darauf, dass der Ordner html unter phpkid markiert ist. Schaue dann etwas tiefer – und zwar dorthin, wo die einzelnen Dateien des markierten Ordners angezeigt werden. Klicke mit der rechten Maustaste auf die zu öffnende Datei, rechtsklicke im Beispiel also auf index.html. Das Kontextmenü erscheint. Wähle ganz oben den Befehl ÖFFNEN. Die HTML-Seite wird im Standardbrowser geöffnet, in aller Regel ist das der Internet Explorer, bei mir jedoch der Firefox. Du möchtest einen anderen Browser wählen? Dann verwende den Befehl ÖFFNEN MIT und suche den anderen Browser heraus. Der Browser ist nicht aufgelistet? Suche ihn aus dem Dateisystem deiner Festplatte heraus. Das gelingt beispielsweise über die Schaltfläche DURCHSUCHEN bzw. PROGRAMM AUSWÄHLEN. Mozilla Firefox liegt in der Regel unter dem Pfad C:\Programme\Mozilla Firefox. 35
Kapitel
Deine coole Homepage mit HTML
1
Die HTML-Seite in der externen Vorschau. Als Browser habe ich den Firefox gewählt.
Die Seite ist leer, aber der Seitentitel von Zeile 4 steht schon da. Wo? Na ganz oben in der Titelzeile des Browsers. Dort steht nun ebenfalls Homepage von Computerhund Buffi. Du wunderst dich, warum bis jetzt noch kein Inhalt im Dokument zu sehen ist? Du hattest doch noch nichts hineingeschrieben! Der Bereich zwischen ist schließlich noch leer! Nur der Seitentitel ist schon vorhanden und der wird ja auch angezeigt!
Leben einhauchen: Überschriften und Absatz
>
Hauche deinem Dokument Leben ein: Klicke dazu in die bisher noch leere Zeile. Es ist die Zeile 8. Wir wagen uns nun an den Body. Schaffe ruhig durch mehrmaligen Druck auf [Enter] ein paar Zeilen Platz.
Auch der »Buch-Hund« Buffi wollte es sich nicht nehmen lassen, endlich mit einer eigenen Homepage aufzuwarten. Bitte sehr – in diesem Kapitel darf er endlich aktiv werden. Orientiere dich an Buffis Beispiel. Schreibe es ab. Ich empfehle dir, die HTML-Befehle erst einmal exakt so aus dem Beispiel zu übernehmen. (Nur den Text kannst du so ändern, dass er auf dich zutrifft!)
Homepage von Buffi
Guten Tag! Mein Name ist Buffi! Ich bin von Beruf Computerkinder-Hund mit allumfassender Allgemeinbildung. Meine Freunde heißen Tim und Nele.
Hier zeige ich dir ein Bild von mir!
36
So wird’s perfekt: Überschriften, Absätze und mehr
So wird der Code in PSPad dargestellt. Du kannst ruhig immer wieder [Enter] drücken, um den Code ordentlich auszurichten. Auf die Anzeige im Browser hat das keinen Einfluss.
Was haben wir da gemacht? Wir fangen mit einer Überschrift an! Mit dem Tag-Paar kennzeichnest du die heading 1, die Hauptüberschrift. Hier schmettert dir Buffi sein Homepage von Buffi entgegen.
Die Homepage beginnt mit einer Hauptüberschrift.
Im Text gibt es gleich noch eine weitere Überschrift, und zwar Hier zeige ich dir ein Bild von mir! Es ist eine heading 2, eine Unterüberschrift auf »zweiter Stufe«. Diese wird stets vom Tag-Paar eingerahmt. Insgesamt gibt es übrigens sechs Überschriftsebenen, du könntest also auch eine , usw. einsetzen. Doch ein HTML-Dokument besteht nicht nur aus Überschriften. Was ist mit dem Textabsatz mittendrin? Auch hierfür gibt es das passende Tag-Paar. Textpassagen »umwickelst« du einfach mit dem Tag-Paar ein. Das p steht dabei für paragraph, zu Deutsch Absatz.
37
Kapitel
1
Deine coole Homepage mit HTML
Wenn du möchtest, kannst du den Text innerhalb von Tags durch das sogenannte Stil-Attribut style (Attribut = Eigenschaft) gestalten. Deine Überschriften und Absätze stehen normalerweise bündig am linken Rand, also linksbündig. Deine Hauptüberschrift soll außer der Reihe zentriert (mittig) ausgerichtet werden? Ergänze im Einschalt-Tag
einfach das Attribut-Werte-Paar style="text-align: center" – und zwar nach einem Leerzeichen. Hinter diesem Stil-Attribut style verbirgt sich die Gestaltungssprache CSS. Die Angabe text-align: bezieht sich auf die Textausrichtung und center steht für zentriert. Dann sieht es so aus:
Homepage von Buffi
Geht auch: Stelle die Überschrift einfach in die Mitte!
Falls du die Überschrift dagegen nach rechts setzen möchtest, notierst du das folgendermaßen:
. Probiere es ruhig einmal aus! Es gelingt mit Überschriften und Absätzen, mit sogenannten Blockelementen. Genug probiert? Dann kannst du diesen Zusatz auch wieder löschen. Ich verzichte im Beispiel auf diesen Zusatz! Ich empfehle dir dringend, CSS zu lernen, damit du die wichtigsten Attribute und Werte zum Gestalten kennst!
Tags zur Hervorhebung von Zeichen Sicher gibst du dich nicht mit blankem Text zufrieden. Das wäre doch langweilig! Schau einmal in den Absatz. Auch hier findest du schon weitere interessante Tags vor. Mit (b wie bold) kannst du Wörter oder Wortgruppen hervorheben. Sie werden dann fett angezeigt. Das Tag-Paar (wie italic, kursiv) dagegen sorgt für eine Kursivstellung der entsprechenden Passage.
38
Die Tag-Paare und galten bis vor kurzem noch als veraltet. Als Alternative sollte man zu <strong> und <em> greifen. Die gute Nachricht: und werden in HTML 5 weiterleben, wenn auch mit leicht veränderter Bedeutung. Es gibt also keinen Grund, auf diese klassischen Tags zu verzichten!
So wird’s perfekt: Überschriften, Absätze und mehr
Die wichtigsten HTML-Tags im Überblick In dieser Tabelle zeige ich dir die wichtigsten HTML-Tags und ihre Bedeutung im Überblick: Tag-Paar <strong> <em>
<small>
Bedeutung Heading 1 – Überschrift 1 Überschrift 2 Überschrift 3 Überschrift 4 Überschrift 5 Überschrift 6 bold – fett strong – stark italics – kursiv emphatic – hervorgehoben langes Zitat
Wie sieht’s aus? fett, sehr groß
small – klein
Text wird verkleinert dargestellt
fett, groß fett, mittelgroß fett, normal fett, klein fett, sehr klein Text wird fett dargestellt Text wird ebenfalls fett Text wird kursiv dargestellt Text wird ebenfalls kursiv wird eingerückt dargestellt.
Wenn du eine Linie setzen möchtest, verwendest du das Tag . Dieses Tag braucht ausnahmsweise kein End-Tag. Außerdem gibt es den sogenannten break, einen Zeilenumbruch. Wenn du ein Wort auf eine neue Zeile setzen möchtest, setzt du davor einfach das Tag . Damit rutscht das Wort auf die neue Zeile, ohne dass gleich ein neuer Absatz beginnt. Auch benötigt kein End-Tag. An dieser Stelle gleich ein interessantes Detail: Die Schreibweise (für eine Linie) bzw. (für den break, Zeilenumbruch) ist die klassische Schreibweise. Du findest auf vielen Seiten auch die XHTML-Variante bzw. vor. Dabei bekommt das Tag nach einem Leerzeichen einen internen Ausschalt-Slash, so einen Schrägstrich. Das macht man deshalb, weil in der XHTML-Schreibweise jedes Tag ausgeschaltet werden muss. Und da ein - oder -Tag nun mal kein Ausschalt-Tag kennt, schaltet man es einfach intern ab. In der Praxis findest du beide Schreibweisen vor. Selbst PHP verwendet Elemente aus XHTML. (Wir aber bleiben bei der bewährten »klassischen« Schreibweise.) Genug gelabert, jetzt wollen wir unsere Homepage mit einem Bild etwas aufpolieren! 39
Kapitel
1
Deine coole Homepage mit HTML
Hier bin ich: Ein Bild einfügen Hast du irgendwo ein Foto von dir auf der Festplatte herumliegen? Vielleicht vom Scanner oder der Digicam? Hauptsache es liegt im Format GIF, JPG oder PNG vor. (Andere Formate sind für das Internet nicht geeignet.) Du hast momentan keine derartige Grafik? Dann nimm zum Üben einfach ein Bild von mir! Du findest die Datei buffi.png auf der CD im Ordner beispiele/kapitel01. Wichtig: Dein Bild sollte nicht zu hoch und breit sein. Es sollte also, wenn du es im Grafikprogramm aufrufst, nicht die ganze Breite und Höhe des Bildschirms ausfüllen. Die Abbildung von Buffi ist 445 Pixel breit und 310 Pixel hoch. (Pixel sind Bildpunkte, eine Maßeinheit auf dem Bildschirm.) Fügen wir das Bild nun ganz schnell in unsere Homepage ein! Und zwar unterhalb der schon vorbereiteten Überschrift 2.
40
>
Achte zuerst darauf, dass die Grafik im gleichen Ordner liegt wie deine HTML-Datei. Das ist zwar nicht unbedingt nötig, macht das Einfügen aber einfacher. Kopiere das Bild also in den Ordner html. Die Beispielgrafik für Buffi heißt buffi.png.
>
Sorge in PSPad dafür, dass der Mini-Editor mit der Dateiansicht sichtbar ist. Du weißt schon, per Toolfenster, zweites Register. Du schaltest das Toolfenster über das Menü ANSICHT ein bzw. aus.
>
An welcher Stelle möchtest du die Grafik einfügen? Schaffe hier eine Leerzeile, drücke also auf [Enter]. Und jetzt geht es los: Ziehe die Grafikdatei aus der Dateiliste direkt in das Dokument. Und zwar an die gewünschte Stelle:
Klicken und ziehen – so einfach fügst du eine Grafik ein.
Hier bin ich: Ein Bild einfügen Hurra, die Grafik ist da! Das entsprechende Tag wurde fix und fertig eingefügt, mit allem Drum und Dran. Im Beispiel sieht die lange Zeile so aus:
Das Attribut-Werte-Paar border="0" dient zum Unterdrücken einer eventuellen Umrandung. Hintergrund dieser »border-Geschichte«: Wenn eine Grafik zum Hyperlink gemacht wird, bekommt sie dadurch automatisch eine kräftige blaue Umrandung. Das ist nun einmal so bei Hyperlinks auf Grafiken. Um diese hässliche Umrandung zu unterdrücken, schreiben PSPad und andere Editoren zur Sicherheit das Attribut-Werte-Paar border="0".
Grafik nur innerhalb eines Blocks einfügen Wir sind noch nicht fertig mit der Grafik und mit den Regeln. Denn es gilt weiterhin: Eine Grafik sollte stets innerhalb eines Absatzes eingefügt werden. Oder innerhalb eines anderen sogenannten Block-Elements. (Tipp: Auch eine Überschrift wie oder ist ein BlockElement.) So verlangt das der Standard zu HTML 4. Und wir wollen im Buch schließlich genau nach Standard vorgehen! Okay, wenn’s denn so gewünscht wird, machen wir’s einfach. Wir packen die Grafik zusätzlich noch in ein Block-Element. Welches nehmen wir? Den Absatz! Setze also vor der Grafik das einleitende
-Tag. Schalte es hinter der Grafik mit
wieder ab.
Erst durch diese Erweiterung haben wir eine standardgerecht eingefügte Grafik!
Was bedeuten die Attribute von ? Schaue dir das eben eingefügte Tag für die Grafik doch etwas genauer an. Es handelt sich um das Tag . Zuerst fällt dir vielleicht auf, dass auch kein Endtag benötigt. Wieder eine Ausnahme. Doch was bedeuten die Attribute? 41
Kapitel
1
Deine coole Homepage mit HTML 0 Das Attribut src steht für source, Quelle. Als Wert gibst du den Grafiknamen in Gänsefüßchen an. (Sollte sich die Grafik in einem Unterordner befinden, musst du den Pfad ebenfalls notieren.) 0 Das Attribut alt sorgt nicht etwa dafür, dass die Grafik »alt« aussieht. Im Gegenteil! Dieses Attribut erzeugt einen sogenannten Alternativtext. Der ist wichtig für Suchmaschinen und für Leute, die nicht gut sehen können. (Sie lassen sich diesen alternativen Text vom Browser einfach vorlesen!) Nach dem Gleichheitszeichen tippst du ein beschreibendes Wort oder eine Wortgruppe. Ersetze also den Platzhaltertext von PSPad beispielsweise durch eine Wortgruppe wie Computerkinder-Hund Buffi. 0 Das Attribut title stelle ich dir in der nächsten Abbildung vor. Es erzeugt … nun … einen Titel für das Bild. Den Effekt siehst du, wenn du den Mauszeiger über die Abbildung führst. Auch hier könnte ruhig mehr Text stehen – aus Platzgründen lasse ich das im Beispiel jedoch sein.
0 Die Attribute width und height »kümmern« sich um Breite und Höhe der Grafik. Die Grafik von Buffi ist im Beispiel 445 Pixel breit und 310 Pixel hoch. Die Reihenfolge, in der man die Attribute angibt, ist dabei egal. Du kannst sie auch vertauschen.
42
Es gibt übrigens eine modernere Schreibweise für die drei Attribute border, height und width. Und zwar mit der Stil- und Formatiersprache CSS. Ersetze border="0" height="310" width="445" einfach durch: style="border: 0; height: 310px; width: 445px;". Du schreibst also nur noch das style-Attribut und setzt alle weiteren CSSAnweisungen in Gänsefüßchen. Mehr zu CSS folgt weiter hinten!
Meine Hobbys kurz aufgelistet Mit dem style-Attribut von CSS sieht das -Tag dann so aus:
Meine Hobbys kurz aufgelistet Noch nicht fertig! Schreibe auf, welchen Hobbys du frönst! Skateboardfahren? Inlineskaten? Lesen? Programmieren? Manga-Zeichnen? PokemonKarten sammeln? WoW spielen? Was auch immer: Für solche Dinge bieten sich in idealer Weise die Listen an.
Mit Aufzählungspunkten: Ungeordnete Liste Im ersten Vorschlag verwenden wir eine sogenannte unordered list, eine »ungeordnete Liste«. Das entsprechende Tag-Paar heißt
. Die einzelnen Listen-Einträge wiederum werden in eingekleidet. Dieses li steht dabei als Abkürzung für list item. Schluss mit dem Englischunterricht, ran an das Beispiel. Ich zeige dir den gesamten Rest des Dokuments. Die Liste beginnt unter der neu eingefügten H3 Ich habe folgende Hobbys. Ergänze also noch die Überschrift und lege dann mit deinen Hobbys los! ...
Hier zeige ich dir ein Bild von mir!
Ich habe folgende Hobbys:
Sterne betrachten
Inlineskaten
Harry Potter lesen
Homepages für Freunde erstellen
43
Kapitel
1
Deine coole Homepage mit HTML In einer solchen unordered list bekommt jeder Aufzählungspunkt einen kleinen Kreis vorangestellt. Sieht doch irgendwie knuffig aus, nicht wahr?
Skaten, Lesen, Homepage erstellen? Hier ist die Liste für deine Hobbys!
Eins, zwei, drei: Ordnung schaffen durch Nummerierung Du möchtest deine Hobbys lieber durchnummerieren? Auch dieser Wunsch lässt sich leicht erfüllen! Bringe Ordnung ins Chaos: Verwende eine ordered list. Ersetze einfach das Tag-Paar
durch . Wie von Geisterhand werden deine Einträge nun durchnummeriert.
Ich habe folgende Hobbys:
Sterne betrachten
Inlineskaten
Harry Potter lesen
Homepages für Freunde erstellen
44
Das Schönste: Du kannst nun nachträglich so viele Einträge hinzufügen, wie du möchtest. Die Nummerierung passt sich immer wieder an!
Coole Links zu coolen Plätzen
»Hobby by Number«: Eine durchnummerierte Liste.
Coole Links zu coolen Plätzen Was wäre das Web ohne die Hyperlinks? Ein Nichts! Es würde gar nicht existieren! Erst durch diese Kreuz- und Querverweise werden deine Seiten richtig lebendig. Linke zu den schönsten und interessantesten Plätzen im Web. Wirf deine »Anker« aus.
Nicht vergessen: Das Tag wird zum Schluss natürlich durch abgeschaltet. Eine Web-Adresse muss bei Hyperlinks stets ausgeschrieben werden. Die einfache Abkürzung nach dem Motto www.it-fachportal.de oder gar it-fachportal.de ist hier nicht erlaubt. Im Zweifelsfall wird der Link nicht funktionieren. 45
Kapitel
1
Deine coole Homepage mit HTML So sieht der Quelltext für das gesamte Hyperlink-Beispiel von Hund Buffi aus:
Auf eine Überschrift hat Buffi diesmal verzichtet. Der Abschnitt mit den Hyperlinks wurde in einen Absatz () eingehüllt. Doch was passiert innerhalb dieses Absatzes? Zur Abwechslung findest du diesmal das Tag-Paar <strong> vor. Praktisch als »Überschrifts-Ersatz«. Dadurch wird die entsprechende Passage fett hervorgehoben und stärkerer betont. Danach hat Hund Buffi einen Zeilenumbruch gesetzt, den schon besprochenen break . Solch ein Umbruch erzeugt eine neue Zeile. Dabei entsteht jedoch kein neuer Absatz! (Du erkennst es in der Vorschau: Der Abstand zwischen den Zeilen ist geringer!) Nun folgen die Hyperlinks nebeneinander, aus optischen Gründen nur durch einen Bindestrich voneinander getrennt.
Unbesuchte Hyperlinks sind per Voreinstellung blau, besuchte färben sich lila.
Parke doch einmal den Mauszeiger über einem Hyperlink. Schon erscheint das Verweis-Ziel in der Statuszeile, also in der unteren Zeile des Browsers. Übrigens: Du musst nicht immer auf eine externe Webseite verweisen. Setze Links vor allem innerhalb deines »Web-Projekts«. Verweise von einer Seite auf die andere. Du willst auf der Startseite auf eine Unterseite namens hobby.html verweisen? Diese liegt im gleichen Ordner wie die Startseite? Als Linkbeschreibung soll der Text Meine Interessen verwendet werden? Dann sieht der interne Links so aus: Meine Interessen
46
Meine drei Lieblingsfächer in einer Tabelle Wie wäre es mit ein paar Tipps und Tricks zu Hyperlinks?
>
Du möchtest, dass sich nach Klick auf den Link ein eigenes Fenster bzw. ein neuer Browsertab öffnet? Dann notiere ganz einfach zusätzlich das Attribut-Werte-Paar target="_blank" im -Tag: Mein Heimatverlag
>
Du möchtest, dass beim Darüberfahren mit dem Mauszeiger ein informativer Beschreibungstext auf dem Hyperlink erscheint? Dann ergänze das schon bekannte Attribut title (Beschreibungstitel). Gib als Wert ein beschreibendes Wort oder eine Wortgruppe an: Lernsoftware und mehr
>
Du möchtest die Farbe der Hyperlinks ändern? Die Unstreichung abschalten? Das alles gelingt mit Style Sheets. Blättere einfach ein Stück weiter nach hinten, dort verraten wir dir mehr zu diesem Thema.
Meine drei Lieblingsfächer in einer Tabelle Schreiben wir zur Abwechslung doch mal eine Tabelle. Warum? Weil es Spaß macht! Und weil Tabellen auf HTML-Seiten eine ganz wichtige Rolle spielen. Und weil du Tabellen kennenlernen solltest. Sind das genug Gründe? Dann los!
Grundaufbau der Tabellen Was musst du zu Tabellen wissen? Nicht viel! 0 Jede Tabelle wird vom Tag-Paar
eingerahmt. (Table ist das englische Wort für Tabelle!) 0 Eine Zeile steht innerhalb von
(table row heißt Tabellenzeile). 0 Eine einzelne Zelle (das Tabellenkästchen) wird zwischen
»gequetscht«. Mit td ist table data genannt, frei übersetzt »Zellinhalt«. 47
Kapitel
1
Deine coole Homepage mit HTML 0 Möchtest du eine Zelle besonders hervorheben, wählst du statt
einfach
für table head. Eine solcherart gestaltete Zelle wird fett hervorgehoben. Der Inhalt wird zentriert.
Das Beispiel Zuerst zeige ich dir das Beispiel. Eine Tabelle besteht aus Zeilen und Spalten. Diese werden durch die Tabellenkästchen (Zellen) gebildet.
Die Beispiel-Tabelle besteht aus vier Zeilen und zwei Spalten.
Das Beispiel sieht im Quelltext folgendermaßen aus:
Lieblingsfach
Warum?
Informatik
Weil ich der Beste bin!
Physik
Weil wir lernen, wie ein Motor funktioniert.
Zeichnen
Weil der Lehrer mit uns Manga-Comics zeichnet.
48
Schickes Layout mit Style Sheets
Die Erklärung Durchschaust du die Struktur? Zuerst setzen wir das einleitende Tag
und drücken schon ein paar Mal [Enter]. Damit schaffen wir etwas Luft. Nicht vergessen: Schalte das
-Einschalt-Tag gleich jetzt am Ende der Tabelle mit
wieder ab! Damit die Tabelle einen Rahmen erhält, arbeite ich gleichzeitig mit dem Attribut-Werte-Paar border="1". Das einleitende Tabellen-Tag sieht also so aus:
. (Wenn du den Rahmen vergrößern willst, erhöhst du einfach den Wert hinter border. Mit border="5" bekommst du beispielsweise einen 5 Pixel dicken Rand.) Danach definiere ich die erste von vier Zeilen. Ich schreibe
, lasse danach ein paar Zeilen frei und setze das abschließende
. Wenn du willst, kannst du alle vier Zeilen schon derart vorbereiten, hier zumindest zwei Zeilen:
...
...
Nun kümmern wir uns um die einzelnen »Kästchen« der Tabelle. Die erste Zeile bekommt zweimal
»spendiert«. Es soll schließlich der Tabellenkopf werden. In den übrigen Zeilen begnügen wir uns mit je zweimal
für den normalen »Zellinhalt«. Wie gesagt, was dann in der Zelle selber erscheinen soll, wird einfach zwischen
bzw.
notiert. So weit, so gut. Aber ich wusste gar nicht, dass Buffi noch zur Schule geht …
Schickes Layout mit Style Sheets Coole Seite? Von wegen! Bis jetzt sieht unser Projekt aus wie eine Kakerlake hinterm Küchenschrank – farblos und platt. Dagegen sollten wir etwas unternehmen, und zwar mit Style Sheets. Lege Schriftart, Schriftgröße und Farben fest! Verpasse den Hyperlinks einen »Mouseover-Effekt«. Du wirst staunen, mit wie wenig Aufwand man seine Seiten aufpeppen kann. 49
Kapitel
1
Deine coole Homepage mit HTML
Style Sheets sind eine ganz fabelhafte Geschichte. Du legst einmal fest, wie deine Homepage auszusehen hat. Das machst du am besten in einer extra Datei. Dadurch erstellst du eine Art Musterschablone. Dieses Gestaltungs-Muster kannst du nun beliebig oft für weitere HTML-Seiten verwenden. Das spart viel Arbeit! Wichtig: Style-Sheet-Dateien sind Textdateien mit der Endung .css.
Verweis auf CSS-Datei setzen Also, frisch ans Werk. Worauf wartest du noch? Die extra »Stil-Datei« soll im Beispiel phpkid.css heißen. Sie wird im gleichen Ordner entstehen wie unsere HTML-Datei. Doch zuerst setzen wir einen Verweis auf diese Datei. Wir binden sie also in unser HTML-Dokument index.html ein. Und zwar in den Kopfbereich, in den Head:
Klicke hinter diese Zeile und drücke [Enter]. Damit erzeugst du eine leere Zeile – dort notierst du gleich den Verweis zur Stildatei. Das gelingt mit dem Tag und seinen Attributen:
Insgesamt sieht der Anfang der HTML-Datei also so aus: 1
2 3 4 5
Homepage von Computerhund Buffi <meta http-equiv="content-type" content="text/html; charset=utf-8"> 6 7
Lass dich von der Syntax dieser Zeile 6 nicht zu sehr entmutigen. Wichtig ist das Attribut href. Hinter dem Gleichheitszeichen setzt du den Namen der CSS-Datei ein, umkleidet von Gänsefüßchen. 50
Schickes Layout mit Style Sheets
Du speicherst deine HTML-Datei, aktualisierst die Vorschau und – es passiert rein gar nichts? Na klar! Wir haben einen Link auf eine Datei erstellt, die es noch gar nicht gibt. Da wartet also ein Stück Arbeit auf uns.
CSS-Datei erstellen Eine CSS-Datei ist nichts weiter als eine Textdatei mit der Endung .css. Also, erstelle eine neue Textdatei.
>
Wähle in PSPad DATEI|NEU. Das Dialogfenster Neu erscheint, du solltest dich im Register Neue Datei aus Vorlage erstellen befinden. Wähle den Ordner CSS und doppelklicke auf Default.
>
PSPad fügt eine fast leere CSS-Datei ein und schaltet auf die CSSFarbhervorhebung um. Der Text /* CSS Document */ beweist, dass es sich um eine CSS-Datei handelt. Lösche diese Platzhalter-Zeile!
>
Ehe ich Style Sheets jetzt groß und breit erkläre, legen wir los! Tippe zuerst folgende drei Zeilen. (Die geschweiften Klammern erzeugst du mit gedrückter [AltGr]-Taste. Tippe dazu entweder die [7] bzw. [0].) body { font-family: Verdana, Arial, Helvetica, sans-serif; }
>
Speichere die Datei ab. Wähle als Dateinamen phpkid.css. Die Datei wird im Beispiel im gleichen Ordner abgelegt wie das HTMLDokument. Achte darauf!
Die Schreibweise für CSS-Style-Sheets gleicht der von Programmiersprachen wie JavaScript oder PHP. So findest du auch in CSS die berühmten geschweiften Klammern. Diese geschweiften Klammern bilden einen Block. Sie halten praktisch zusammen, was zusammen gehört. Auch in CSS wird (fast) jede Zeile durch ein Semikolon (;) abgeschlossen. Es ist so, wie du es in PHP noch kennenlernen wirst! Rufe das HTML-Dokument index.html doch einmal in der Browservorschau auf. Aktualisiere die Ansicht, z. B. durch Druck auf die Funktionstaste [F5]. Wahnsinn! Auch einen Schlag ändert sich die Schriftart im gesamten Dokument. Und das nur mit diesen simplen drei Zeilen. Wie geht das? Nun, das gesamte Dokument befindet sich zwischen den Tags . Mit diesem Tag kannst du praktisch alle Textpassagen erreichen,
51
Kapitel
1
Deine coole Homepage mit HTML ist sozusagen die »große Klammer«, die alles zusammenhält. Also body, okay. Doch wo sind die spitzen Klammern? Die werden in
CSS nicht mitgeschrieben! Du notierst also das »nackige Tag« ohne spitze Klammern. Wir schreiben einfach body und haben damit den sogenannten Selektor zu Papier gebracht. Wenn das kein Grund zum Feiern ist … Nun setzen wir nach einem Leerzeichen die öffnende geschweifte Klammer. Der Block beginnt. Mein Tipp: Drücke schon ruhig zweimal auf [Enter]. Setze gleich die schließende Klammer. (Denn hinterher vergisst man das oft, glaube mir!) Zwischen diesen Klammern notierst du nun die Formatieranweisungen. Im Beispiel handelt es sich um folgende Zeile: font-family: Verdana, Arial, Helvetica, sans-serif;
Damit legen wir die font-family fest, die Schriftfamilie – hier also Verdana. Am Ende der Zeile setzt du ein Semikolon. Wenn der Benutzer auf seinem Rechner kein Verdana hat? Dann wird die Schriftart verwendet, die als nächstes nach dem Komma folgt. Und wenn es auch hier heißt: Fehlanzeige? Dann probiert der Browser, ob er Helvetica findet. Sollte das nicht glücken, wählt der Browser irgendeine sachliche Schriftart. Dafür sorgt sans-serif am Schluss der Aufreihung. Das ganze Gebilde mit Selektor und geschweiften Klammern nennt sich nun Regel. Und tatsächlich haben wir damit eine fabelhafte kleine Regel erstellt, mit der wir die Schriftart für das gesamte Dokument steuern.
Einige Attribute und Werte von CSS Neugierig, welche Anweisungen es noch so gibt? Die folgende Tabelle zeigt dir einige wichtige Attribute und Werte von CSS. In der linken Spalte findest du jeweils das Beispiel. Rechts erkläre ich dir, was passiert. Beispiel font-family: Arial, Helvetica; font-size: 12pt; font-weight: bold; font-variant: small-caps; font-style: italic; line-height: 1.2; margin: 10px; text-decoration: none;
52
border-style: solid;
verantwortlich für Schriftart Arial bzw. Helvetica Schriftgröße 12 Punkt Zeichenformat fett KAPITÄLCHEN (DAS SIND KLEINE GROSSBUCHSTABEN) Schriftstil (z. B. kursiv) Zeilenabstand (z. B. 1,2-zeilig) Rand rundherum 10 Pixel Texteffekt (Unterstreichung) abschalten Rahmen rundherum ziehen
Schön bunt hier: Farben zuweisen
Mehrere Fliegen mit einer Klappe Nun kennst du schon einige CSS-Eigenschaften. Wunderbar. Kümmere dich doch einmal um die Schriftgröße! Angenommen, du möchtest in Absätzen (Selektor p), Tabellen (table) und Listeneinträgen (li) eine Schriftgröße von 10 Punkt einrichten. Dann schlage doch einmal drei Fliegen mit einer Klappe! Reihe die Selektoren vor der öffnenden geschweiften Klammer auf. Dann gilt die Regel für alle drei Tags zugleich! p, table, li { font-size : 10pt; }
Warum haben wir in dieser Regel keine Schriftart definiert? Nun, diese hatten wir doch schon in der »body-Regel« festgelegt. Schließlich gilt body für das gesamte Dokument, also auch für p, table und li. In dieser Regel müssen wir nur noch die Schriftgröße bestimmen. Und zwar zusätzlich.
Schön bunt hier: Farben zuweisen Natürlich kannst du in CSS nicht nur Texteigenschaften, Ränder und Rahmen festlegen. Arbeite doch einmal mit Farben! Für die Schriftfarbe nimmst du das Attribut color. Die Hintergrundfarbe wird dagegen durch background-color gesteuert. Farb-Beispiel color: blue; background-color: silver;
verantwortlich für Farbe blau Hintergrundfarbe hellgrau
Doch wie viele Farben kannst du verwenden? 16,7 Millionen! Und wie stellt man sie dar? Das geht zum einen mit dem sogenannten Hexadezimalwert. Das ist eine kryptische Zeichenfolge. Sie beginnt mit einer Raute, gefolgt von weiteren 3–6 Stellen. Diese beschreiben die Zusammensetzung aus den drei Grundfarben Rot, Grün und Blau. Ein Blau sieht so aus: #0000FF. Zum anderen kannst du diese RGB-Anteile auch auf andere Weise beschreiben. Notiere rgb() und trage innerhalb der Klammern die Anteile der drei Grundfarben ein. Und zwar auf einer Skala von 0 bis 255 – getrennt mit Komma. Ein Blau sieht dann so aus: rgb(0,0,255).
53
Kapitel
1
Deine coole Homepage mit HTML Du möchtest mit PSPad die gewünschte Farbe zuweisen? Wähle WERKZEUGE|FARBAUSWAHL bzw. die FARBAUSWAHL-Schaltfläche. Setze den Cursor dortin, wo der Farbwert stehen soll. Doppelklicke auf deine Wunschfarbe:
PSPad verwendet zum Einfügen der Farben die freundliche »RGB-Syntax«.
Neben den 16,7 Millionen unterschiedlichen Hexadezimal- bzw. RGBFarbwerten gibt es aber auch »freundlichere Farbnamen«. Zumindest für die 16 Grundfarben. Wenn du dich also auf diese 16 Grundfarben beschränken möchtest, wählst du einen der 16 englischen Farbnamen aus. Eine Gesamtübersicht über diese Grundfarben zeige ich dir in der Tabelle. Dabei ist es egal, ob du dich für den Farbnamen (linke Spalte), den Hexadezimalwert oder den RGB-Farbwert (rechte Spalte) entscheidest: Farbname black silver gray white maroon red purple fuchsia green lime olive yellow navy blue teal
Schön bunt hier: Farben zuweisen Buffi, gar nicht faul, hat seine Homepage inzwischen komplett mit Style Sheets aufgebürstet. So sieht seine neue »Layout-Page« aus.
Welche eine Verwandlung! CSS bringt Farbe ins Bild.
Die komplette CSS-Datei im Überblick Möchtest du die gesamte CSS-Datei sehen, die Hund Buffi zur Steuerung seiner Seite geschrieben hat? Bitte sehr. Damit du durch den Code durchsteigst, habe ich mit beschreibenden Kommentaren gearbeitet. Kommentare sind Passagen, die nur für den Autor der Datei interessant sind. Sie werden nicht ausgeführt, bleiben praktisch unsichtbar. In CSS verwendest du die gleichen Kommentarzeichen, die du später auch in PHP setzen wirst. Ein Kommentar wird mit /* eingeleitet und endet mit */. So kannst du der ersten Regel (also dem Gebilde in geschweiften Klammern) z. B. folgende Beschreibung voranstellen: /* Schriftart im gesamten Dokument */
Außerdem empfehle ich dir, mit Leerzeilen für mehr Übersicht zu sorgen. Was hier wie die reinste Platzverschwendung aussieht, wird uns später bei PHP sehr helfen! Aber nun »Manege frei« für den CSS-Code:
55
Kapitel
1
Deine coole Homepage mit HTML /* Schriftart im gesamten Dokument */ body { font-family: Verdana, Arial, Helvetica, sans-serif; } /* Absätze, DIVs, Tabellen, Listen, Formulare in 10 Punkt */ p, div, table, li, form { font-size: 10pt; } /* Hintergrundfarbe grau mit weißer Schrift */ h1 { background-color: gray; color: white; } /* Überschrift 2 und 3 blau färben */ h2, h3 { color: rgb(0,0,153); } /* fette Passagen rot einfärben */ b { color: red; } /* kursive Passagen blau färben */ i { color: rgb(0,0,153); } /* Link-Stile für Hover-Links a:link { color: rgb(0,0,153); } a:visited { color: gray; }
56
a:hover { text-decoration : none;
*/
So legst du die exakte Breite fest color: red; } a:active { color: black; }
Lies dir den Quelltext ganz in Ruhe durch. Die ersten beiden Regeln haben wir schon besprochen. Bei der zweiten Regel habe ich gleich die Tags div und form mit dazu geschrieben. So werden diese Elemente ebenfalls gestaltet. (Zu div und form gleich mehr!) Schon mit der dritten Regel für h1 erreichst du einen sehr interessanten »Rahmen-Effekt«. Die Schrift wird weiß eingefärbt. Doch der Hintergrund erhält die Farbe grau! Das sieht doch toll aus, oder? Wenn du genau hinschaust, stellst du fest, dass Buffi auch die Tags und aufpoliert hat. Fette Passagen werden zusätzlich rot, kursive dagegen blau eingefärbt. Du wunderst dich über den letzten Abschnitt in der CSS-Datei? Was verbirgt sich hinter Link-Stile für Hover-Links? Das sind Sonderfälle, damit erzeugst du den berühmten Hovereffekt beim Darüberfahren mit der Maus! Mit den vier »Sonder-Selektoren« a:link, a:visited, a:hover und a:active kannst du die vier Linkzustände ansprechen. Einmal den normalen Link, dann den besuchten Link, danach den Link während des Darüberfahrens mit der Maus (Hover-Effekt!) und den aktiven Link (während des Klickens). Du solltest die Links übrigens stets in dieser Reihenfolge notieren, damit es keine Anzeigeprobleme gibt.
So legst du die exakte Breite fest Zufrieden? Noch nicht ganz! Verändere doch einmal die Größe des Browserfensters. Ziehe das Fenster lang. Der ganze Text wandert mit. Die Breite des Textes richtet sich nach der Breite des Browserfensters.
57
Kapitel
1
Deine coole Homepage mit HTML Das ist doch der reinste Wanderzirkus! Zugegeben, auf manchen Seiten ist dieser Effekt beabsichtigt. Unser Hund wünscht jedoch eine ganz exakte Breite. Die Breite der Seite soll genau 600 Pixel betragen. Nicht mehr und nicht weniger.
Packe den Inhalt in einen »Div-Container« Dafür eignet sich ganz ausgezeichnet ein sogenannter Div-Container. Es handelt sich um das Tag-Paar . In dieses Tag-Pärchen darfst du ganze Textpassagen einwickeln. »Div« darf Überschriften, Absätze, Tabellen und Listen enthalten. Füge direkt unter dem -Einschalt-Tag zuerst eine leere Zeile ein. Setze dort hinein:
Schalte dieses »Div« kurz über wieder ab. Nun sieht es so aus: ...
Homepage von Buffi
... viele, viele Zeilen dazwischen ...
Breite festlegen über Inline-CSS Fehlt noch die Breite (width). Richtig, das könnten wir in der CSS-Datei festlegen. Zu umständlich! Es handelt sich schließlich nur um eine einzige Angabe. Wir lösen das Ganze deshalb kurz und schmerzlos mit Inline-CSS. Bei Inline-CSS werden die CSS-Anweisungen direkt im Tag notiert. Ich habe es dir in Zusammenhang mit text-align (Absatzausrichtung), border (Rahmen), width (Breite) und height (Höhe) schon gezeigt! Eine Inline-CSS-Passage beginnt mit dem Attribut style="...". Die CSS-Regeln werden nun innerhalb der Gänsefüßchen notiert. Inline-CSS ist dann ideal, wenn man kurze Anweisungen festlegen möchte, die sich nicht wiederholen sollen. 58
Eine Umfrage! Wie findest du meine Page? Gehe deshalb in das einschaltende
. Ergänze style="width: 600px;". Insgesamt sieht das Tag also so aus:
Exakte Breite durch die CSS-Regel width: 600px;
Eine Umfrage! Wie findest du meine Page? Du möchtest wissen, wie deine Seite bei den Besuchern ankommt? Erstelle eine Umfrage! Dazu nimmst du einfach eine neue Seite, die wir im Beispiel umfrage.html nennen. Speichere sie ebenfalls unter C:/phpkid/html.
>
Baue die Seite auf dem schon bekannten Grundgerüst auf. Füge ebenfalls den schon verwendeten CSS-Link zur Datei phpkid.css ein! Eine Umfrage mit Radioknöpfen – Der Besucher wählt eine Option aus.
Ein Formular mit Radioknöpfen Und hier zeige ich dir den kompletten Quelltext dieser Umfrage. Denke zuallererst an den Titel. Passe den Bereich zwischen an. Setze eine Überschrift in das Dokument.
59
Kapitel
1
Deine coole Homepage mit HTML Aus Platzgründen habe ich den HTML-Code im Gegensatz zur index.html nicht eingerückt. Es ist schließlich keine Pflicht. Und wenn du doch einrücken willst: Es gibt in PSPad eine clevere Automatik. Mehr dazu gleich …
Umfrage: Wie findest du meine Seite? <meta http-equiv="content-type" content="text/html; charset=utf-8">
Wie findest du meine Page?
Das eigentliche Formular beginnt mit dem auch wieder abzuschalten.) Im Formular selber arbeiten wir mit sogenannten Radiobuttons. Dieser Typ wurde tatsächlich von alten Röhrenradios abgeschaut. Drückt man einen Knopf rein, springt der andere heraus. Radiobuttons werden auch als Kontrollkästchen bezeichnet. Radiobuttons werden mit erzeugt. Gib allen zusammengehörigen Buttons den gleichen Namen. Dazu dient das Attribut name. Im Beispiel heißen alle Buttons ergebnis. Der value wiederum ist der Wert, den der Button beim Absenden »mitschickt«. Hier bekommt jeder Button einen eigenen Wert, z. B. 1, 2 und 3. Das dient zum späteren Wiedererkennen. Du als »Formularbesitzer« bekommst schließlich das Name-Werte-Paar zugeschickt, z. B. ergebnis="1". 60
Tipps und Tricks zu PSPad
Submit! Doch wo bleibt die Action? Jedes Formular benötigt zum Abschicken einen Submit-Button. Submit steht für Versenden, übermitteln. Dieser Button sieht im Beispiel so aus:
Der Wert hinter dem Attribut ist übrigens die Beschriftung. Du könntest hier auch »Los!« oder »Klicken auf eigene Gefahr« eintragen. Aber darauf will ich nicht hinaus. Klappe die Erste. Und Action! Wenn du auf den Submit-Button klickst, geht die »Action« los. Es passiert … nichts. Oder fast nichts. Kunststück. Schließlich passiert das, was wir im einleitenden -Tags und mit Kontrollkästchen ein Umfrageformular vorbereiten kannst und hast den SUBMITButton ausprobiert.
Ein paar Fragen … Und jetzt bist du an der Reihe. Beantworte zuerst ein paar Fragen und löse dann ein paar Aufgaben. Viel Spaß und viel Erfolg! 1. Zwischen welchen Tags wird der Kopfbereich des Dokuments notiert? 2. Wie heißt der Farbname für kastanienbraun? Wie lautet der dazugehörige hexadezimale Farbcode und wie die RGB-Syntax? 3. Wie sehen die Kommentarzeichen aus, die in CSS-Dateien verwendet werden? Die Antworten zu den Fragen stecken allesamt auf der CD zum Buch. Schaue im Ordner fragen nach!
… und ein paar Aufgaben 1. Schaue in die Seite index.html. Füge unter der Aufzählung deiner Hobbys eine Linie ein. Welches Tag verwendest du dafür? 2. Setze ganz oben auf die Seite index.html einen neuen Absatz, und zwar unterhalb von
. Füge dort einen Verweis auf die zweite Seite umfrage.html ein. Schreibe als Linktext: Zur Umfrage. Setze ganz oben auf der Umfrage-Seite (direkt unter ) ebenfalls einen Absatz ein. Hier soll einen Link zurück verweisen. Dieser soll heißen: Zur Startseite.
65
Kapitel
Deine coole Homepage mit HTML
1
Verlinke dein Projekt mit internen Querverweisen.
3. Prüfe deine Seiten auf Korrektheit. Surfe dazu zum »Prüfdienst« des W3C. (Dahinter stecken die Leute, die HTML erfunden haben.) Surfe zu http://validator.w3.org. Gehe ins Register Validate by File Upload. Klicke auf den Button DURCHSUCHEN. Suche die zu prüfende Datei heraus und klicke auf CHECK. Die Prüfung funktioniert nur richtig, wenn die Datei eine DokumenttypDeklaration besitzt. Du darfst diese erste Zeile mit . So sparen wir uns in Zukunft auch das Schreiben dieser Passage. Die Lösungen für die Aufgaben findest du, falls möglich, stets auf der CD zum Buch, und zwar unter dem Ordner loesungen. Schaue im Beispiel unter loesungen/kapitel01 nach! Und wundere dich nicht – ich habe den HTML-Quellcode mit Tidy automatisch eingerückt.
66
2 Installiere deinen eigenen Webserver! In diesem Kapitel wird es richtig spannend! Du installierst deinen eigenen Webserver und testest, ob alles funktioniert. Reiten wir gemeinsam »mit den Apachen durch die Prärie«! In diesem Kapitel lernst du also $ wie du deinen eigenen Webserver mit PHP und MySQL installierst $ wie du testest, ob alles funktioniert An alle, die jetzt Angst bekommen: Du kannst deine Eltern, Tanten und anderweitige potenzielle Geldgeber beruhigen. Der eigene Webserver ist kein schwerer Kasten, den du nun zusätzlich in deine Stube schieben musst. Es kostet nichts extra, dein eigener Rechner genügt. Alles, was du zusätzlich brauchst, liefere ich dir auf CD mit! Doch bevor es losgeht, lass mich etwas ausholen … Wir müssen da so einige Dinge klären!
67
Kapitel
2
Installiere deinen eigenen Webserver!
Warum eigentlich ein Webserver? Warum eigentlich ein Webserver? Und was ist das für ein Ding? Fragen über Fragen, die wir vorher unbedingt beantworten müssen.
Der Webserver ist ein Computer … Zum einen ist der Webserver ein Computer. Es ist der Rechner im Internet, auf dem deine Webseiten liegen. Dieser Webserver steht in einem großen Rechenzentrum. Er wird von deinem Dienstleister für dich bereitgehalten. (Und um ganz offen zu sein: In den meisten Fällen legt dein Dienstleister unzählige weitere Homepages auf diesem Server ab, um Platz zu sparen.)
Der exklusive Server für die eigene Homepage? Zu teuer! Muss nicht sein!
Kommen wir gleich auf die für dich wohl wichtigste »Kommunikation« mit dem Webserver zu sprechen, auf das Hochladen. Denn wenn du mit dem Erstellen deiner Homepage fertig bist, lädst du die fertigen Seiten auf den Webserver. Zum Hochladen deiner Seiten brauchst du ein sogenanntes FTPProgramm. Aber keine Sorge, das findest du ebenfalls in diesem Buch. Auch wie man eine Seite auf den Webserver lädt, erkläre ich dir ebenfalls, und zwar weiter hinten. Schaue einfach in den Anhang B! Der Webserver sorgt nun dafür, dass deine Homepage für alle sichtbar ist. Besucher können zu deiner Adresse surfen und sehen deine Seiten. So weit, so gut. Fazit: Ohne Webserver geht es nicht. Denn solange deine Seiten noch auf deinem eigenen Rechner daheim liegen, kann sie niemand außer dir sehen. (Oder außer deinen Freunden, denen du die Seite zeigst.) 68
Warum eigentlich ein Webserver?
… und der Webserver ist ein Programm! Zum anderen ist der Webserver aber auch eine Software, ein Programm. Dieses Programm sorgt dafür, dass die Seite weltweit abgerufen werden kann. Dieses Programm läuft nun – du ahnst es schon – auf dem Webserver. Versuche dir einmal vorzustellen, wie das mit dem Surfen funktioniert: Der Webserver-Rechner mit Webserver-Programm steht »irgendwo im Internet«, in irgendeinem Rechenzentrum. Dort liegt deine Homepage, wie eben geklärt. Doch was passiert, wenn ein »Surfer« deine Homepage betrachten möchte? Dann tippt sie oder er erst einmal die entsprechende Webadresse in den Browser ein, z. B. http://www.phpkid.de. Nach Druck auf [Enter] erhält der Webserver (also dieser Computer im Internet) eine Anforderung zum Abruf der Seite. Fachleute sprechen von einem sogenannten HTTP-Request. Der Webserver sucht deine Homepage »aus seinem Speicher heraus« und schickt sie zum Betrachter zurück. Der Betrachter an seinem heimischen PC sieht nun deine Homepage in seinem Browser und kann sie lesen. Dieser Betrachter wird übrigens als Client bezeichnet. Der Client schaut sich die Seiten auf dem Server an. Und schon haben wir die schönste Client-Server-Beziehung.
Warum unbedingt ein eigener Webserver? Das mit dem Webserver ist ganz schön und gut. Doch wozu brauchst du deinen eigenen Webserver? Reicht denn nicht dieses Teilchen beim Dienstleister im Internet? Leider nicht! Die Programmiersprache PHP ist eine Programmiersprache, die auf dem Webserver läuft. Ohne Webserver funktioniert sie nicht. In Zusammenhang mit PHP spricht man deshalb auch von »WebserverProgrammierung«. Daraus folgt: Wenn du PHP ausprobieren möchtest, bist du auf einen Webserver angewiesen. Eine derartige Programmiersprache wird Server-seitige Programmiersprache genannt. Wie gesagt: PHP läuft nur auf dem Server, auf dem Webserver. Der Browser allein kann mit PHP nichts anfangen. Wenn du versuchst, eine PHP-Seite direkt im Browser aufzurufen, wird das nicht zum gewünschten Ziel führen! 69
Kapitel
2
Installiere deinen eigenen Webserver! Da du PHP sicher auf deinem heimischen Rechner ausprobieren möchtest, musst du wohl oder übel einen eigenen Webserver installieren. Darum also brauchst du den eigenen Webserver.
Und warum geht das so problemlos bei JavaScript? Kennst du Raffael Voglers tolles, aber leider nicht mehr erhältliches Buch »JavaScript für Kids«? Oder den gleichnamigen Nachfolgetitel von Frank Biet? (JavaScript ist eine weitere Programmiersprache, mit der man Webseiten aufpeppen kann.) Oder hast du dich vielleicht schon anderweitig über JavaScript informiert und einiges ausprobiert? Dann wirst du an dieser Stelle möglicherweise die Stirn runzeln. Moment mal, wirst du protestierend einwerfen. Der Autor spinnt. Von wegen Webserver! Bei JavaScript ist dieser ganze WebserverZirkus doch auch nicht nötig. Du öffnest deine Seite direkt im Browser – es funktioniert. JavaScript wird ausgeführt. Du brauchst keinen Webserver. Warum? Nun, JavaScript läuft direkt im Browser! Fachleute sagen: JavaScript wird vom Client (Client = Browser) interpretiert. Im Klartext: JavaScript wird vom Browser des Betrachters ausgeführt. Der beste Beweis für diese Aussage: Schalte doch einmal JavaScript im Browser ab. Viele Seiten werden jetzt nicht mehr richtig funktionieren. Ganz im Gegensatz zu PHP ist JavaScript also eine Clientseitige Programmiersprache. Fassen wir zusammen: JavaScript wird vom Browser ausgeführt. (Und wenn du im Browser JavaScript abschaltest, geht gar nichts mehr). PHP dagegen wird nur vom Server ausgeführt. Der Browser bekommt stets eine HTML-Seite zugeschickt. Das hat einen großen Vorteil. Für PHP ist es egal, welchen Browser der Betrachter verwendet. PHP funktioniert immer! Das ist natürlich toll. Doch wo Licht ist, gibt es auch viel Schatten. Und da kommen wir schon zum ersten Haken!
70
Wie teuer ist die Homepage mit PHP/MySQL?
Wie teuer ist die Homepage mit PHP/MySQL? Wir sprachen eben darüber, dass an der Sache mit PHP ein Haken ist: PHP funktioniert nur dann, wenn dir dein Dienstleister einen Webserver mit PHP-Unterstützung bietet. Und spätestens an dieser Stelle fängt es an, richtig ärgerlich zu werden. Du führst deine Homepage bisher bei T-Online, AOL oder Freenet? Fehlanzeige! Diese Dienstleister sind ungeeignet. Aber auch preiswerte »WebVisitenkarten« bzw. »Starterangebote« z. B. von 1 und 1, Strato, Domainfactory usw. bieten oft kein PHP an. Auch hier kommst du also nicht weiter. Fazit: Du benötigst einen Dienstleister mit PHP- und MySQL-Unterstützung. Schauen wir uns deshalb einige dieser Dienstleister einmal an. Wir benötigen PHP 5-Unterstützung, um ganz genau zu sein. MySQL sollte mindestens in Version 4.1, besser in Version 5 oder höher vorliegen.
Kostenlos, aber nicht umsonst: MultiMania Gerade kein Geld übrig? Das macht nichts! Der Anbieter MultiMania bietet unter www.multimania.de eine kostenlose Homepage an. Das alleine ist nichts Besonderes, kostenlose Homepages kannst du an vielen Stellen im Netz bekommen. Interessant ist, dass MultiMania PHP und – täterätäää – auch MySQL-Unterstützung bietet. Sogar das Administrations-Tool phpMyAdmin zum Einrichten von Datenbanken ist schon vorinstalliert. Der Haken: Du musst dich mit Zwangswerbung auf deiner Seite abfinden. Auch an deine E-Mail-Adresse wird Werbung geschickt. Abgesehen davon sind die dort eingerichteten Versionen von MySQL und phpMyAdmin nicht aktuell. Auch die neuen MySQLi-Funktionen von PHP funktionieren zum Zeitpunkt des Schreibens noch nicht. Du kannst dann beim Datenbankteil (vorerst) leider nicht mitmachen. Doch zumindest für den Einstieg in PHP ist MultiMania gut geeignet! Immerhin kannst du zumindest PHP nach Herzenslust ausprobieren, ohne einen Cent zu bezahlen. MultiMania ist ein Angebot der Conversis Hosting GmbH. Früher gehörte der Dienst zu Lycos und hieß »Tripod«. 71
Kapitel
2
Installiere deinen eigenen Webserver!
Bei MultiMania registrieren Du hast dich für dieses Angebot entschieden? Trage deinen Usernamen und das Passwort ein. Das Passwort musst du aus Sicherheitsgründen zweimal angeben. Klicke auf LOS GEHTS!:
Bei der Anmeldung legst du Benutzernamen und Passwort fest.
Dann füllst du das entsprechende Formular aus. Der Mitgliedsname ist besonders wichtig. Dieser Name wird später zum letzten Teil der Adresse deiner Homepage. Du musst aber auch dein Geburtsdatum, dein Geschlecht und eine schon existierende E-Mail-Adresse angeben. Du hast das Anmelde-Formular ausgefüllt und abgeschickt? Dann bekommst du nun eine E-Mail. Erst mit dieser E-Mail wird die Anmeldung perfekt: Aktiviere den Hyperlink aus der E-Mail. Du landest auf einer »Bestätigungs-Seite«. Gib Mitgliedsnamen und Passwort ein. Geschafft! Du bist Mitglied bei MultiMania!
Login bei MultiMania Zum Einloggen gehst du zu http://www.multimania.de. Nun gibst du Benutzernamen und Passwort ein und klickst auf ANMELDEN. Schon bist du im Verwaltungsbereich. Wie bekommst du deine Homepage auf den MultiMania-Server? Mit FTP! Wie das funktioniert und welche Daten du dafür benötigst, zeige ich dir im Anhang B ganz genau! 72
Wie teuer ist die Homepage mit PHP/MySQL? Hat alles geklappt? Dann findest du deine Seite im Endeffekt möglicherweise unter dem Namen http://mitglied.lycos.de/mitgliedsname – mit Mitgliedsname ist hier natürlich der von dir selbst gewählte Benutzername gemeint. Auf jeden Fall zeigt dir MultiMania die Adresse der Seite gleich nach dem Einloggen an.
Kostenlos, aber nicht umsonst: Massive Werbung bei jedem Laden der Seite.
Für »ältere Kids«: Eigene WWW-Domain Nase voll von der MultiMania-Reklame? Du bist schon ein etwas »größeres Kid«? Oder die »Augenaufschlag-Papi-ist-der-Beste-Taktik« war erfolgreich? Dann lohnt es sich vielleicht, über eine eigene Domäne nachzudenken! Das ist eine Adresse, die z. B. nach dem Muster www.deinName.de aufgebaut wird. Die Vorteile sind groß: Deine Webseite ist unter einer kurzen, von dir selbst wählbaren Adresse zu finden. Gerade hier werben unzählige Dienstleister (sogenannte Webhoster) um deine Gunst. Viele dieser Firmen bieten natürlich auch »Hosting-Pakete« mit PHP-Unterstützung, in aller Regel auch gleich mit MySQL. Leider kostet die PHP/MySQL-Option bei einigen Anbietern ordentlich viel Knete. Nicht so bei der Firma Neue Medien Münnich. Hier gibt es eine Homepage mit eigener Domäne und PHP/MySQL-Unterstützung für recht Taschengeld-freundliche 4,95 Euro pro Monat. Dafür, dass dieser Dienstleister zu den besten gehört, ist das eine gute Leistung! Informiere dich auf der Seite www.all-inkl.com genauer über Preise und Leistungen! Ebenfalls überzeugt bin ich von der Schwarzkünster GbR unter www.schwarzkuenstler.info. Hier gibt es PHP-fähige Webpakete schon ab mageren 1,45 Euro pro Monat. Noch einen Tick günstiger ist die Hosting-Firma MW Internet mit dem Paket Zero Light. Hier gibt es PHP- und MySQL-Unterstützung schon ab 1,40 Euro im Monat. Und das alles ohne Werbung, dafür aber mit 250 Megabyte Speicherplatz: www.mw-internet.de. (Tipp für alle mitlesenden Eltern: Dieser Anbieter ist nicht nur sehr günstig, sondern vergibt auch Geschenkgutscheine! Und zwar in der Rubrik Sonstiges.) Und es geht sogar noch günstiger. Bei http://webnet-service.de bekommst du das günstigste PHP- und MySQL-fähige Paket ab 1,29 pro Monat. 73
Kapitel
2
Installiere deinen eigenen Webserver!
Neue Medien Münnich und Schwarzkünstler GbR haben einen großen Vorteil: Du kannst deren Angebot vorab kostenlos auf Herz und Nieren prüfen! Bei Neue Medien Münnich dauert dieser Test 7 Tage. Suche einfach nach der Option Jetzt gratis testen. Bei Schwarzkünstler GbR kannst du das Angebot bis zu 10 Tage testen. Suche die Rubrik Testen Sie uns! Mit diesem kostenlosen Testaccount erfährst du zum einen, wie so ein Anbieter tickt. Zum anderen bekommst du eine zeitlich befristete Testhomepage mit PHP und MySQL und damit kannst du schon alles machen. Arbeite das Buch durch und teste die Skripte auf deren Server! Im nächsten Bild siehst du die Begrüßungsseite von Neue Medien Münnich. Die Schaltfläche JETZT GRATIS TESTEN führt zum kostenlosen Testaccount:
All-inkl.com ist nicht nur einer der günstigsten, sondern auch besten Anbieter.
Ich habe mich bei den meisten der bisher genannten Dienstleister angemeldet und bin zufrieden. Hallo Eltern, Großeltern, Tanten, Onkels, Verwandte: Vielleicht wäre das ein tolles Weihnachts-, Oster-, Geburtstags-, Tauf-, Konfirmations- bzw. Jugendweihegeschenk? Die eigene Domain für die Tochter, für den Sohn? Du suchst den günstigsten und besten Anbieter? Du möchtest dich vorher über Preise und Leistungen informieren? Surfe zur Seite www.webhostlist.de und informiere dich. Hier ist besonders die Übersicht zu den Top Ten interessant. Du findest hier Geschwindigkeitstests und Erfahrungsberichte von anderen Nutzern. Außerdem führt der Autor auf www.phpkid.de/?billig_hosten eine Liste besonders preiswerter Anbieter, die er mithilfe seiner Leser zusammengetragen hat. 74
How! Im Reich des »Apachen«
Lasse dir beim Anmelden von einem Erwachsenen helfen. Denn gerade bei der Registrierung von Domänen-Namen müssen rechtliche Aspekte beachtet werden. Du darfst z. B. keinen geschützten Markennamen für deine Homepage verwenden. Nicht nur bei gewerblicher Nutzung (früh übt sich, hehe!) benötigst du außerdem ein ordentliches Impressum. Das ist ein Bereich, der deine Adresse, Telefonnummer, Steuernummer usw. enthält. Verstöße können dazu führen, dass du teure »Strafgebühren« entrichten musst. Viel mehr dazu, was erlaubt ist und was nicht, verrate ich dir auch in meinem Buch »Bloggen mit WordPress für Kids«.
How! Im Reich des »Apachen« Nun haben wir uns auf den vorangegangenen Seiten ausführlich über Webserver unterhalten. Es gibt den Webserver als Rechner und natürlich auch das Webserver-Programm. Das Webserver-Programm? Gibt es da nur ein Programm? Und was kostet diese Software? Interessante Fragen! Die gute Nachricht: Webserver-Programme gibt es viele. Zum einen teure wie den sogenannten Internet Information Server von Microsoft. Zum anderen auch kostenlose. Und – du wirst es nicht glauben – am beliebtesten ist der frei verfügbare Webserver namens Apache. How! Und weil der so gut ist und weil der weiter nichts kostet, wird er auf den meisten Webservern im Internet eingesetzt. Es handelt sich dabei um sogenannte Open Source Software. Die Nutzung ist kostenlos. Das Projekt wird von vielen Leuten weiterentwickelt. Es gibt Versionen des »Apachen« für Unix/Linux (das Betriebssystem im Web) und natürlich auch für Windows. Im Klartext: Du kannst dir dieses tolle Programm gemütlich auf deinem heimischen Windows-Rechner installieren.
Ganz einfach: Webserver selbst installiert! Genau das machen wir. Wir installieren uns den Apache-Webserver auf unserem heimischen Rechner. Damit schaffen wir uns eine tolle Testumgebung. Ideal auch als Trostpflaster, wenn du noch keine Möglichkeit hast, deine Seiten im Internet zu veröffentlichen. 75
Kapitel
2
Installiere deinen eigenen Webserver!
Nach der herkömmlichen Methode musst du zuerst den ApacheWebserver einzeln installieren. Dann installierst du PHP, zum Schluss noch MySQL und phpMyAdmin. Nach jedem Schritt nimmst du unzählige schwierige Konfigurations-Einstellungen in irgendwelchen Textdateien vor. Wenn man sich da nur ein einziges Mal verschreibt, geht gar nichts mehr! Arghh. Da bekommt man schon am Anfang die ganz große Krise! Unser Buch bleibt krisenfrei! Wir sind pfiffig und nutzen eine spezielle »Installations-Software«. Ich meine das Installationspaket XAMPP von den Apachefriends. Hinter den Apachefriends stecken Kai Oswald Seidler, Carsten Wiedmann und Kay Vogelgesang – die Entwickler dieses tollen Installationspakets. Frisch ans Werk! Installiere deinen eigenen Webserver auf der lokalen Festplatte. Nebenbei werden außerdem gleich PHP, MySQL und das geniale Tool phpMyAdmin eingerichtet. Das Beste: Alle diese »Kostbarkeiten« liegen für dich auf der CD bereit, und zwar unter programme/xampp. Unser Dank geht an Kai, Carsten und Kay, die sich freuen, dass wir ihr XAMPP mit auf unsere CD legen! Die XAMPP-Homepage – übrigens mit einem Hilfe-Forum auch bei Installationsproblemen – findest du unter http://www.apachefriends.org. Kleiner Tipp für Mac-Nutzer: Auch für dich gibt es eine praktische Alternative: MAMP. Du kannst dir das Paket unter www.mamp.info herunterladen, für die Buch-CD war es etwas zu groß. (Sonst hätten die Videos nicht mehr gepasst.) Die Installation von MAMP geht zwar anders vor sich als die von XAMPP. (Sie wird auf www.mamp.info bei Dokumentation erklärt.) Vom Prinzip her arbeitet MAMP jedoch genau wie XAMPP.
So installierst du XAMPP Und so einfach gelingt die Installation unter Windows. Es funktioniert bei allen Windows-Versionen ab Windows 2000 bis Windows 7. Und zwar sowohl auf der lokalen Festplatte als auch transportabel auf USB-Stick. (Du kannst dir die Schrittfolge auch zeigen lassen. Das entsprechende Video für dieses Kapitel 2 findest du auf der CD im Ordner videos.)
> 76
Zuerst achte darauf, dass kein Programm auf deinem Rechner aktiv ist. Das könnte die Installation stören. Gehe nun in den entsprechenden Ordner für XAMPP auf der CD, und zwar in programme/xampp.
Ganz einfach: Webserver selbst installiert!
Der Doppelklick startet die Installation.
>
Doppelklicke auf die Datei xampp-win32-1.7.3.exe. (Falls du die neuste Version von XAMPP aus dem Internet geladen hast, lautet der Dateiname vielleicht schon xampp-win32-1.7.4.exe.) Es handelt sich um ein selbstauspackendes RAR-Archiv. Die Installation wird automatisch gestartet. Unter Windows Vista und 7 musst du vorher in aller Regel noch eine Sicherheitswarnung bestätigen.
>
Das Fenster XAMPP for Windows erscheint. Schaue zum Feld Destination Folder. Steht bei dir auch C:\ in diesem Feld? Super! Hier sollte auf jeden Fall der Laufwerksbuchstabe hin – wobei das Laufwerk auch ein USB-Stick oder eine externe Festplatte sein darf!
Der Installationspfad (Destination Folder) sollte im Beispiel C:\ lauten.
>
Klicke auf INSTALL und gedulde dich – die Dateien werden entpackt! Das kann eine ganze Weile dauern. Im Ergebnis entsteht unter C: bzw. dem von dir gewählten Laufwerk ein Extraordner namens xampp. (Davon kannst du dich gleich nach erfolgreicher Installation überzeugen.)
77
Kapitel
2
Installiere deinen eigenen Webserver!
>
Nun erscheinen nacheinander merkwürdige schwarze Setup-Bildschirme! Dort musst du jeweils den aktiven Buchstaben (y wie yes bzw. n wie no) mit [Enter] bestätigen bzw. ggf. wunschgemäß anpassen, damit der Einrichtungsprozess abgeschlossen werden kann.
Shortcuts (Verknüpfungen) auf dem Desktop und im Startmenü sind eine feine Sache. Das »y« für »yes« ist voreingestellt. Bestätige mit [Enter]!
>
Drücke jetzt immer wieder auf [Enter], um die Fragen zu bestätigen.
An einer Stelle wirst du gefragt: Should I make a portable XAMPP without drive letters? Wenn du XAMPP nur auf der lokalen Festplatte installierst, könntest du das »n« für no eigentlich belassen. Soll XAMPP jedoch als portable (tragbare) Version auf einem USB-Stick oder einer tragbaren Festplatte eingerichtet werden, darfst du keine drive letters (Laufwerksbuchstaben) zulassen. Aber auch auf der lokalen Festplatte entscheide ich mich dagegen. So kann ich XAMPP immer schnell mal »mitnehmen«. Einfach den XAMPP-Ordner nachträglich auf den USB-Stick kopieren und direkt am Computer von Freunden nutzen! Ist doch super, oder? Folge meiner Empfehlung und tippe an dieser Stelle vorher auf alle Fälle ein »y« für yes. Drücke erst dann auf [Enter].
>
78
Es geht weiter mit dem [Enter], [Enter] um die nächsten beiden Fenster zu bestätigen. Am Schluss landest du bei dieser Auswahl:
Ganz einfach: Webserver selbst installiert!
>
Tippe ruhig erst einmal ein x für exit. Durch Druck auf [Enter] verlässt du das Setup-Skript und kannst dich in Ruhe umsehen.
Apropos installiert: XAMPP hinterlässt dabei keinerlei Spuren. Keine Einträge in irgendwelchen Registrierdatenbanken, kein nichts! Wenn du XAMPP löschen möchtest, löschst du einfach den kompletten Ordner xampp! (Oder du rufst die Datei uninstall_xampp.bat aus dem xampp-Ordner auf.)
So startest du XAMPP Du möchtest XAMPP starten? Und damit den Apache Webserver, PHP, MySQL und phpMyAdmin? Kein Problem! Wozu gibt es denn das neue Verknüpfungssymbol auf dem Desktop? Doppelklicke einfach auf das Symbol XAMPP Control Panel bzw. rufe diesen Eintrag über das Startmenü auf. Das geniale XAMPP Control Panel startet. Damit »zündest« du nun den Apache-Webserver und den MySQL-Datenbankserver. Dafür benötigst du nur die beiden oberen START-Schaltflächen. Klicke zuerst auf den obersten START-Knopf, den rechts neben Apache. Warte ein paar Sekunden. Wähle danach den START-Knopf darunter, den rechts neben MySQL.
Starte den Apache-Webserver (oberstes Modul) und MySQL (zweites Modul von oben) jeweils durch Klick auf die daneben angeordnete START-Schaltfläche. Der Text Running erscheint und die START-Schaltfläche verwandelt sich in eine STOP-Schaltfläche.
Nach Klick auf die jeweilige START-Schaltfläche meldet sich gegebenenfalls ein warnendes Fenster deiner Firewall. Das geht in Ordnung, Windows passt schließlich auf. Erlaube je nach Firewall den Zugriff bzw. Einsatz des Webservers und von MySQL in deinem lokalen Netz.
79
Kapitel
2
Installiere deinen eigenen Webserver!
Nanu, es gibt Probleme mit XAMPP? Achte darauf, dass kein konkurrierendes Webserver-Programm aktiv ist. Unter Windows 2000 bzw. XP Professional könnte das der Internet Information Server sein. Den darfst du nicht aktivieren, da dieser den Apache-Webserver behindern würde. Auch das »Telefonierprogramm« Skype (www.skype.com) musst du ggf. herunterfahren, da es sich oft nicht mit XAMPP bzw. dem lokalen Apache-Webserver verträgt. Es kann auch sein, dass eine lokale Firewall oder ein im Hintergrund arbeitender Virenscanner dafür sorgt, dass XAMPP nicht richtig läuft. Auch die aktuellen Browser präsentieren ggf. alle möglichen Sicherheitsabfragen und Warnungen, ehe sie dich an XAMPP heranlassen. Im Zweifelsfalle gilt: Versuch macht klug! Trenne dich während der Arbeit mit XAMPP unbedingt vom Internet – aus Sicherheitsgründen! Schalte erst dann die Firewall aus bzw. überwinde die Sicherheitsmechanismen deines Browsers.
So beendest du XAMPP Du möchtest deine PHP-MySQL-XAMPP-Sitzung beenden? Dann musst du beide Module durch Klick auf STOP wieder herunterfahren. Schalte erst MySQL ab und warte einige Sekunden. Stoppe danach den Apache-Webserver. Der grüne Text Running muss an beiden Stellen verschwunden sein. Auch wenn du das Fenster des XAMPP Control Panel schließt – das Steuerpult bleibt aktiv! Es nistet sich ganz rechts unten im Systembereich ein. Du findest es neben der Uhrzeit. Ein Doppelklick auf dieses Symbol zaubert das Steuerpult hervor.
Du möchtest nun auch das XAMPP-Steuerpult beenden? Klicke im XAMPP Control Panel auf die Schaltfläche EXIT. Du findest sie als unterste Schaltfläche in der rechten »Reihe«. Erst jetzt ist XAMPP wirklich inaktiv.
80
Nur noch etwas Handarbeit … und fertig!
Wo liegen die Dateien von XAMPP? XAMPP hat nun alles installiert, Webserver, PHP, MySQL, phpMyAdmin usw. Fantastisch. Doch wo liegen die ganzen »Module«? XAMPP legt den Apache-Webserver, PHP, MySQL, phpMyAdmin usw. in Unterordnern unter C:\xampp ab. 0 Den Apache-Webserver findest du unter C:\xampp\apache 0 Die PHP-Dateien liegen unter C:\xampp\php 0 MySQL findest du z. B. unter C:\xampp\mysql Auch andere Module wie Perl, Mercury Mail Server und der FileZilla-FTPServer werden installiert. Diese Komponenten benötigen wir jedoch nicht, du kannst sie ignorieren. Was für uns wichtig ist: Für deine eigenen Daten hat XAMPP den Ordner htdocs eingerichtet. Du findest dieses Verzeichnis unter C:\xampp\htdocs. Merke dir diesen Ordner gut! Noch einmal langsam und zum Mitschreiben: Alles, was du jetzt PHP-mäßig anstellen wirst, legst du ab unter C:\xampp\htdocs!
Nur noch etwas Handarbeit … und fertig! Hat alles perfekt funktioniert? Probiere es aus! Teste, ob dein lokaler Webserver funktioniert. Die Startseite für deinen lokalen Webserver findest du stets unter der Adresse http://127.0.0.1. Tippe diese Adresse einfach in deinen Browser ein. Falls dir diese Nummer zu kryptisch ist, kannst du dir auch die Adresse http://localhost merken. Last but not least gibt es noch eine dritte Methode. Kennst du den Namen deines PCs? Meiner heißt z. B. Monarch. Dann tippe ich http://monarch und drücke [Enter]. Auch das geht also, es führen tatsächlich drei Wege zum gleichen Ziel!
81
Kapitel
2
Installiere deinen eigenen Webserver! Wir einigen uns am besten auf http://localhost! Tippe diese Adresse ein und drücke [Enter]. Je nach Version von XAMPP siehst du – nach Klick auf den Link Deutsch – diese oder eine ähnliche Seite:
XAMPP begrüßt dich mit einer Begrüßungs-Seite.
Dahinter verbirgt sich aber nichts weiter als eine Status- und Demoseite, die die Macher von XAMPP für dich vorinstalliert haben. Du wunderst dich, warum in diesem Ordner schon so viel drin steckt? Das sind vor allem Demo- und Beispielprogramme. Du kannst diese Dateien und Ordner bedenkenlos löschen. Du traust dich nicht, das alles zu löschen? Dann habe ich einen anderen Tipp: Benenne den Ordner htdocs um in htdocs_alt. Erstelle nun unterhalb von xampp einen neuen, leeren Ordner namens htdocs. Auch das funktioniert! (Wenn du dich nicht beim Ordnernamen verschrieben hast!) Nach dem Druck auf [Enter] will sich dein PC stets ins Internet »einwählen«? Versuche eine Option wie »Offline bleiben«. Wähle z. B. den Befehl DATEI|OFFLINEBETRIEB. Probiere es dann erneut.
82
Testen: phpinfo() auf localhost
Testen: phpinfo() auf localhost Wunderbar, jetzt hast du deinen eigenen Webserver. Teste doch einmal, ob alles funktioniert. Zuerst prüfen wir, ob unsere eigenen HTML-Seiten angezeigt werden.
Zuerst eine HTML-Seite … Erinnerst du dich an deinen Ordner html, den du unter C:\phpkid eingerichtet hattest? Ich meine unser kleines Projekt aus Kapitel 1. Das kommt uns wie gerufen, denn hier gibt es eine Datei index.html. Das ganze Projekt binden wir einfach zur Probe in unseren Webserver ein!
>
Kopiere diesen Ordner html komplett nach C:\xampp\htdocs. Der neue Pfad muss also lauten C:\xampp\htdocs\html!
>
Rufe diese Seite nun auf. Dazu tippst du http://localhost/html. Wenn alles klappt, wird die im ersten Kapitel erstellte Seite index.html aufgerufen! Es klappt: Aufgerufen wird die index.html aus dem Ordner html.
Aber auch hier sind die Vorteile eines Webservers noch nicht ersichtlich. Es macht keinen großen Unterschied, ob du die Datei direkt von PSPad bzw. dem Windows Explorer aus startest, oder über den Webserver »abrufst«.
Die »Magie« der index.html Du könntest diese Datei index.html auch direkt durch Doppelklick starten. Da es eine reine HTML-Seite ist, macht das keinen Unterschied – zumindest vom Erscheinungsbild her. Bemerkst du etwas? Wenn du sie über http://localhost/html öffnest, dauert das ein wenig länger. 83
Kapitel
2
Installiere deinen eigenen Webserver! Schließlich muss der Webserver die Anfrage (HTTP-Request) erst bearbeiten und die passende Seite zurück zum Browser schicken. Apropos http://localhost/html! Gezeigt wird die index.html, obwohl du diesen Namen überhaupt nicht getippt hattest? Der Engländer würde jetzt sagen How come, was ist los? Nun, eine index.html wird immer dann angezeigt, wenn du den entsprechenden Ordnernamen eintippst. Wenn keine index.html vorhanden ist, reicht oft auch eine index.htm oder sogar eine index.php als Startdatei. Das ist ziemlich praktisch. So musst du nicht erst umständlich http://localhost/html/index.html tippen, da http://localhost/html genügt!
… und nun ein PHP-Test Und nun folgt ein kleiner PHP-Test! Dafür schreibst du deine erste PHPDatei. Diese nennen wir info.php und legen sie in den Ordner C:\xampp\htdocs. Richtig, diesmal direkt in den Stammordner deines »lokalen Webs«. Wie geht das?
> > >
Starte PSPad. Wähle nun im Menü DATEI den Befehl NEU. Bleibe im voreingestellten Register Leere Datei erstellen und doppelklicke auf PHP. Eine Datei wird erzeugt, wirklich leer ist sie allerdings nicht. Du findest hier schon die PHP-Tags vor. Klicke in die leere Zeile zwischen
>
Notiere folgenden Befehl: phpinfo();
>
84
Vergiss nicht, die Datei zu speichern. Zur Erinnerung: Wir wollten sie info.php nennen (Endung .php!).
Testen: phpinfo() auf localhost
Achte unbedingt darauf, die Datei in XAMPP zu speichern. Und zwar im Ordner xampp, Unterordner htdocs. Denn nur wenn sie in htdocs (oder einem Unterordner von htdocs) liegt, wird PHP ausgeführt.
>
Rufe die Seite nun folgendermaßen auf. Tippe in den Browser: http://localhost/info.php
und bestätige mit [Enter]. Wenn alles geklappt hat, siehst du solch ein oder ein ähnliches Bild: Es funktioniert: PHP ist auf deinem System korrekt installiert.
Das ist zum einen der Beweis, dass PHP funktioniert. Zum anderen gibt dir die Funktion umfangreiche Auskünfte. Welche PHP-Version ist auf deinem System installiert? Wir arbeiten mit PHP 5.3.1. Welches Betriebssystem wird verwendet? Welche Einstellungen wurden vorgenommen? Für den Kenner ist diese Anzeige eine wahre Fundgrube. Für uns Grund, einen Indianer-Freudentanz aufzuführen!
85
Kapitel
2
Installiere deinen eigenen Webserver!
Du versuchst, die info.php direkt aufzurufen? Das wird misslingen. Entweder du siehst den Quelltext. Oder Windows beschwert sich, weil es mit diesem Dateityp nichts anfangen kann. Spätestens an diesem Beispiel merkst du, wie wichtig der Webserver ist. Erst der Webserver sorgt dafür, dass die PHP-Anweisung – hier die Funktion phpinfo() – ausgeführt wird. Wichtig zu wissen: Der PHP-Befehl wird ausgeführt, aber nicht angezeigt. Der Browser erhält reinen HTML-Code zugeschickt. Wenn du’s nicht glaubst, mache den Test: Tippe noch einmal die Adresse http://localhost/info.php. Wähle nun im Browser je nach Version den Befehl SEITE|QUELLCODE ANZEIGEN, ANSICHT|QUELLTEXT bzw. SEITENQUELLTEXT ANZEIGEN. Du wirst keine einzige Zeile PHP finden! Was du siehst, ist der HTML-Quellcode, der durch die phpinfo() entstanden ist!
Noch ein Test: Funktioniert phpMyAdmin? Hattest du auf der ursprünglichen XAMPP-Begrüßungsseite den Punkt TOOLS entdeckt? Dort steckt auch phpMyAdmin, unser Datenbankverwaltungsprogramm. Wir brauchen es zwar erst später – trotzdem solltest du jetzt schon testen, ob der Zugriff funktioniert! Ich empfehle dir, dieses Tool nicht über den Link, sondern stets direkt aufzurufen. Dazu tippst du in die Adresse-Zeile des Browsers: http://localhost/phpmyadmin Normalerweise startet phpMyAdmin ohne Kommentar. Bei dir erscheint eine Dialogbox zur Eingabe von Benutzernamen und Passwort? Dann tippst du als Benutzernamen einfach root, das Passwort-Feld jedoch lässt du frei. Das sind übrigens die gleichen Daten, die du später auch für MySQL verwenden wirst: root und nichts.
Schlussbemerkung Viel Theorie, ich weiß. Aber das war wichtig. Außerdem weißt du jetzt, wo du Platz für deine PHP-Homepage bekommst. Und du bist stolzer Besitzer eines eigenen lokalen Webservers. Und das ist doch schon allerhand!
86
XAMPP gibt es übrigens auch für Mac und für Linux. Dort ist die Vorgehensweise leider etwas anders. Lies dir die entsprechenden Anleitungen auf www.apachefriends.de durch. Du bist Macianer und kommst mit XAMPP nicht zurecht? Dann solltest du das schon erwähnte MAMP ausprobieren. Dieses Tool bekommst du unter www.mamp.info.
Zusammenfassung
Zusammenfassung 0 Du weißt jetzt, wozu ein Webserver dient. Hier liegen die Seiten. Der Betrachter kann sie über Eintippen der entsprechenden Webadresse anfordern. Diese Anforderung heißt »HTTP-Request«. 0 Du kennst einige Dienstleister mit PHP/MySQL-Unterstützung. Du kennst z. B. MultiMania (vormals Tripod bei Lycos), einen werbefinanzierten Anbieter einer kostenlosen PHP/MySQL-Homepage. 0 Du weißt, wie das beste Webserver-Programm heißt – Apache Webserver. Es ist ein frei verfügbares Programm. 0 Wir haben den Apachen selber auf unserem Rechner eingerichtet. Dabei half uns ein Installations-Tool namens XAMPP. Angenehmer Nebeneffekt: Jetzt laufen auch PHP und MySQL ganz automatisch auf deinem heimischen Rechner. 0 Du weißt, wie du dein eigenes Web aufrufst. Tippe http://localhost in die Adresse-Zeile des Browser. Drücke [Enter]. 0 Du hast am Beispiel der Funktion phpinfo() herausgefunden, dass eine PHP-Datei nur beim Aufruf über den Webserver richtig angezeigt wird. Grund: PHP wird vom Webserver ausgeführt. Der Browser bekommt jedoch reinen HTML-Code zugeschickt.
Ein paar Fragen … 1. Kannst du bei Anbietern wie T-Online oder AOL deine Homepage mit PHP/MySQL installieren? 2. Wie heißt das Programm, welches dir den Apache-Webserver, PHP, MySQL und noch viel mehr auf deinem heimischen Computer einrichtet? 3. Unter welchem Pfad legst du deine PHP-Dateien ab, wenn du den Apache-Webserver mit XAMPP installierst hast? 4. Welche Endung hat eine PHP-Datei? 5. Wozu brauchst du einen eigenen Webserver?
87
Kapitel
2
Installiere deinen eigenen Webserver!
… und eine Aufgabe Diese Aufgabe wendet sich an Windows-Nutzer, die mit PSPad arbeiten. Und damit es nicht so schwer wird, beginne ich mit einem Trick. Du möchtest noch schneller ein HTML-Grundgerüst in PSPad einfügen? Klicke auf den Pfeil rechts neben der NEU-Schaltfläche (Sie heißt eigentlich NEUE DATEI ERSTELLEN) und wähle HTML. Oder wähle DATEI|NEU und bleibe im Register Leere Datei erstellen. Doppelklicke auf HTML. Auch jetzt wird ein HTML-Dokument im Standard 4.01 Transitional eingefügt – sogar mit verkürzter DTD. (Allerdings ohne lang="de" und utf-8.) Und nun kommt endlich deine Aufgabe: Finde heraus, welche Vorlage sich dahinter verbirgt. Passe diese Vorlage an deine Wünsche an. Sorge also dafür, dass unser perfektes HTML-Grundgerüst von Seite 32 eingebunden wird. Meinetwegen mit verkürzter DTD und gerne auch ohne Einrückung der Zeilen. (Damit die Einrückung von PHP besser zur Geltung kommt.) Aber bitte dafür wieder mit CSS-Link von Seite 50.
88
3 Hallo echo – »Hallo Welt« Die mühevollen Vorarbeiten sind geschafft! Der Webserver läuft. Höchste Zeit, mit dem Programmieren richtig loszulegen. In diesem Kapitel lernst du: $ wie du mit PHP Daten ausgibst $ wie du mit Variablen arbeitest, den »variablen Platzhaltern« $ wie du Zeilenumbrüche setzt $ wie du Sonderzeichen »maskierst« $ wie du Fehler erkennst und vermeidest
89
Kapitel
3
Hallo echo – »Hallo Welt«
Daten ausgeben mit echo Gleich zu Anfang stelle ich die wichtigste Sprachanweisung von PHP vor – echo. Und ich verspreche dir, es ist eine Anweisung »mit Nachhall«. Doch vorher klären wir, wie PHP-Dokumente überhaupt aufgebaut sind und wo du die PHP-Anweisungen notierst.
Wie sind PHP-Dokumente aufgebaut? Die PHP-Notation ist unkompliziert. Was musst du wissen? Nicht viel! PHP-Dokumente sind eigentlich nichts weiter als HTML-Dokumente. Sie besitzen die Endung .php. Sie enthalten zusätzlich Abschnitte mit PHPCode. Diese PHP-Abschnitte notierst du ganz einfach irgendwo innerhalb des HTML-Quelltexts. Wo, ist im Prinzip fast egal. Hauptsache du machst deutlich, dass es sich um einen PHP-Abschnitt handelt.
Wie kennzeichne ich meinen PHP-Code? Ganz einfach. Zu Beginn des PHP-Teils notierst du Folgendes:
Am Schluss des PHP-Abschnitts schreibst du dagegen: ?>
Das war’s schon. Das ist die Form, die ich dir empfehle. Du könntest aber auch schreiben:
und ?>
wobei du dann die Kurzform gewählt hättest. (Ich zeige es dir deshalb, damit du dich nicht wunderst, wenn dir diese Schreibweise bei anderen Skripten begegnet.) Wir bleiben bei der Langform, da sie zu 100% dem Standard entspricht. Warum ist die Kennzeichnung des PHP-Abschnitts eigentlich so wichtig? 90
Daten ausgeben mit echo
Erst durch diese Kennzeichnung »weiß« der Webserver, dass es sich um PHP-Abschnitte handelt. Denn diese Abschnitte werden nicht einfach so an den Browser geschickt. Sie werden vorher interpretiert, ausgeführt. Vergiss nicht: Der Benutzer bekommt nur eine HTML-Seite mit HTMLAnweisungen »zugeschickt«. Den PHP-Code bekommt er nie zu Gesicht!
»Hallo Welt« – dein erstes Skript Unter Programmierern ist es eine hübsche Tradition, die »Welt« am Anfang mit einem kräftigen »Hallo« zu begrüßen. Schreibe ein Skript, welches den Text »Hallo Welt« ausgibt. Das Dokument soll hallo.php heißen und in unserem htdocs-Ordner unter C:\xampp abgelegt werden.
>
Erzeuge mit deinem bevorzugten Code-Editor (PSPad, Aptana Studio usw.) eine neue, leere HTML-Datei. In PSPad wählst du DATEI|NEU, gehst ins Register Neue Datei aus Vorlage erstellen und doppelklickst auf die Vorlage HTML 4.01 Transitional. (Falls du die Aufgabe von Seite 88 gelöst hast, gibt es auch einen schnelleren Weg.)
>
Nun erscheint das schon bekannte Grundgerüst einer HTML-Datei. Bereite zwischen einen PHP-Bereich vor. Kleide die PHP-Tags außerdem durch ein. Damit sorgst du dafür, dass der Text innerhalb des obligatorischen HTML-Blockelements notiert wird. Der Bereich innerhalb von sieht dann so aus:
>
Notiere zwischen den PHP-Tags jetzt folgende PHP-Zeile: echo "Hallo Welt!";
>
Nicht vergessen: Speichere dein Dokument. Wähle den Namen hallo.php. Denke an den korrekten Speicherpfad: xampp/htdocs!
PSPad bietet dir beim Speichern den Dateityp HTML Document an. Doch wir brauchen PHP. Stelle daher im Listenfeld bei Dateityp vorher Alle Dateien (*.*) ein. Notiere dann den Dateinamen im Dateiname-Feld. 91
Kapitel
3
Hallo echo – »Hallo Welt«
Die Sprachanweisung echo sorgt dafür, dass die entsprechenden Daten ausgegeben werden. Die auszugebenden Daten notierst du innerhalb von Gänsefüßchen. Die Zeile wird am Ende durch ein Semikolon abgeschlossen.
Quelltext für die hallo.php So sieht das gesamte Beispiel aus. Ich habe den Titel in der vierten Zeile angepasst und außerdem eine beschreibende Überschrift eingefügt. Aber Hallo – der eigentliche PHP-Teil ist nur ganz kurz: Hallo-Welt-Skript <meta http-equiv="content-type" content="text/html; charset=utf-8">
Hallo-Welt-Skript
Du möchtest auch mit einer externen CSS-Datei arbeiten? Damit die sechste Zeile im Quelltext Sinn macht? Dann vergiss nicht, dass du die Datei phpkid.css ebenfalls in den Ordner htdocs kopieren musst. Sonst werden deine »Stile« nicht angezeigt!
Teste dein Dokument mit dem Webserver Sicher bist du neugierig, ob alles funktioniert. Rufe dein Dokument im Webserver auf. Da du es direkt im Wurzelordner htdocs gespeichert hast, ist das ganz einfach. Tippe http://localhost/hallo.php und drücke auf [Enter]. Wenn alles geklappt hat, müsstest du folgendes Bild sehen: 92
Daten ausgeben mit echo
Der PHP-Code wird interpretiert: Der Browser gibt den Hallo Welt-Text aus.
Hat’s funktioniert? Herzlichen Glückwunsch! Huch, bei dir gibt es eine Fehlermeldung? Oder der Text wird nicht angezeigt? Beachte, dass die Anzeige nur funktioniert, wenn du die Seite über den Webserver startest. Das direkte Aufrufen mit Doppelklick führt dazu, dass der PHP-Abschnitt nicht interpretiert wird. Kunststück, wenn du den Webserver umgehst? Weitere Fehlermöglichkeiten bespreche ich ein paar Seiten weiter hinten im Abschnitt Fehlermeldung. Also, cool bleiben!
PSPad: Raffinierte Farbhervorhebung Mal was anderes: Ist dir eigentlich die interessante farbliche Darstellung in PSPad aufgefallen? Sowohl die HTML- als auch die PHP-Befehle werden durch unterschiedliche Farben optisch gut hervorgehoben. Dafür sorgt der HTML multihighlighter – eine raffinierte Farbhervorhebungsautomatik.
Der HTML Multihighlighter ist automatisch aktiv. Du erkennst es an der entsprechenden Anzeige in der Statuszeile.
Stelle zur Probe einmal einen anderen Highlighter ein. Dazu klickst du einfach auf den Text HTML multihighlighter aus der Statuszeile. Nun erscheint
93
Kapitel
3
Hallo echo – »Hallo Welt« ein Dialogfenster und zeigt dir eine Auswahl vieler anderer Farbhervorhebungs-Module. Probiere doch einmal die Einstellung »HTML«. So wird nur der HTML-Code farblich hervorgehoben. Du kannst den Fokus aber auch ausschließlich auf PHP legen. Du musst den Highlighter aber normalerweise nicht von Hand wählen. PSPad erkennt den Dateityp automatisch anhand der Endung einer Datei. Rufe doch einmal die phpkid.css auf und prüfe, welcher Highlighter gewählt ist. Richtig: Cascading Style Sheets.
Variablen: Mein rechter, rechter Platz ist leer Die Welt haben wir schon begrüßt. Wunderbar! Richten wir unser Augenmerk deshalb auf die nächste Umgebung: Auf Katja, Leon, Peer, Manja und auf wen auch immer. Schmettere einem dieser lieben Menschen ebenfalls einen freundlichen Gruß entgegen. Bleiben wir im Beispiel einfach bei Katja. Begrüße sie mit PHP! Erstelle ein neues PHP-Dokument. Nenne es katja.php und lege es wieder in den Ordner htdocs. Als Titel und Überschrift schlage ich Persönliche Begrüßung mit Variablen vor. Doch was sind Variablen?
Was sind Variablen? Variablen sind Platzhalter! Es sind Speicherstellen im Hauptspeicher des Rechners. Stell dir eine Variable einfach als Behältnis vor. Es ist ein Behältnis, welches dir für die Dauer der Programmausführung zur Verfügung steht. Was du hineinpackst, bleibt dir überlassen. Du kannst den Inhalt der Variablen beliebig ändern und erweitern. Auch den Namen des »Behälters« selbst kannst du frei wählen. Na ja, fast frei zumindest.
94
Die Namen von Variablen beginnen immer mit einem Dollarzeichen. Verwende keine Umlaute, Leer- oder Sonderzeichen! So wäre $eimer ein erlaubter Variablenname, nicht aber $meine schüssel. Der Unterstrich (_) ist jedoch gestattet. Er dient oft als Ersatz für das verbotene Leerzeichen. So wäre $dein_name eine wunderbare Variable. Selbst kurze Variablen wie $i oder $k kannst du verwenden. Weiterhin gilt: Groß- und Kleinschreibung werden unterschieden. So sind $vorname und $Vorname zwei unterschiedliche Variablen. (Damit solche Probleme gar nicht erst auftreten, rate ich zu genereller Kleinschreibung!)
Variablen: Mein rechter, rechter Platz ist leer
Beachte zusätzlich: Einige in PHP reservierte Wörter dürfen nicht als Variablenname verwendet werden. Das sind Wörter wie while, if, switch, for usw. usf. Außerdem ganz wichtig: Beginne Variablennamen nie mit einer Zahl. Nicht funktionieren wird ein Name wie $68name. (In der Variablen selbst sind jedoch Ziffern gestattet.)
Der Platzhalter $vorname Für unser »Katja-Beispiel« habe ich mir die Variable $vorname ausgedacht. Dieser muss ich nur noch einen Wert zuweisen. Im Beispiel soll es der Name Katja sein. Wie mache ich das? So: $vorname = "Katja";
Die Variable selbst steht links. Danach folgt ein sogenannter Zuweisungsoperator. Dann notiere ich den eigentlichen Wert des »VariablenPlatzhalters«. Und dieser befindet sich rechts, getreu dem Motto »Mein rechter, rechter Platz ist leer«. Warum notiere ich den Namen Katja in Gänsefüßchen? Weil es sich um Text handelt. In diesem Zusammenhang spricht man von einem sogenannten String. Strings werden stets im Gänsefüßchen notiert. Bei Zahlen dagegen brauchst du keine Gänsefüßchen zu setzen. Klar? Der gesamte Quelltext des PHP-Bereichs sieht so aus.
Denke an das Semikolon am Zeilenende. Jede Zeile wird in PHP in der Regel durch ein Semikolon abgeschlossen!
Hallo Katja! So sieht mein Beispiel aus.
95
Kapitel
3
Hallo echo – »Hallo Welt« Das Beispiel findest du auf der CD im Ordner kapitel03. Schaue in die Datei katja1.php.
Wie funktioniert das Skript? Ganz einfach! In der ersten Zeile taucht die Variable $vorname das erste Mal auf. Du weist ihr gleich den Wert Katja zu. Doch warum steht Katja in Gänsefüßchen? Bei Katja handelt es sich um Text. Und Text entspricht dem sogenannten Datentyp String. Das muss durch Gänsefüßchen verdeutlicht werden, denn Strings müssen stets in Gänsefüßchen stehen. Neben dem Datentyp String kennt PHP noch den Datentyp Integer. Dieser Datentyp steht für eine normale Ganzzahl wie 5 oder 9834. Als weiteren Datentyp gibt es in PHP den Datentyp Float (Kommazahl). Später lernst du den Typ Boolean für Wahrheitswerte wie true oder false kennen. Wie du siehst, sind es alles in allem nur wenige Datentypen. Da PHP die Datentypen automatisch erkennt, musst du dich darum nicht weiter kümmern. (Der Fachmann sagt: Die Variablen sind nicht typisiert.) In Zeile 1 hast du die Variable also initialisiert, wie der Profi sagen würde. Nicht vergessen: Die Zeile wird dann durch ein Semikolon abgeschlossen. Noch einmal im Klartext: Wir haben uns unseren eigenen »Behälter« namens $vorname eingerichtet und dort den Text Katja hineingetan. Nun zur zweiten Zeile. Hier sorgt die echo-Anweisung nun dafür, dass etwas ausgegeben wird. Das »Ausgabegut« steht übrigens wieder in Gänsefüßchen. Auch hier handelt es sich um Text. Richtig erkannt: Es wird ein String ausgegeben! Nach dem Wort Hallo und einem Leerzeichen hat unsere Variable $vorname ihren großen Auftritt. Nun wird der Wert ausgegeben, der in der Variablen gespeichert ist. Dieser lautet Katja. Fazit: Im Browser erscheint der Text Hallo Katja!
Ausgabe verschönern mit HTML-Tags Die Ausgabe gefällt dir noch nicht? Verschönere sie einfach! Du kannst im Zusammenhang mit echo ganz problemlos HTML-Tags einsetzen. Die »Version 2« des Katja-Beispiels sieht folgendermaßen aus: 96
Wie Pech und Schwefel: Strings verketten $vorname!"; ?>
Wie du siehst, kannst du ganz problemlos HTML-Tags in deinen AusgabeString einfügen. Hier habe ich zusätzlich mit dem Tag-Paar für bold (fett) gearbeitet. Passe dein Beispiel dementsprechend an. Speichere und aktualisiere die Ansicht im Browser. Dazu drückst du die Funktionstaste [F5]. Das geht natürlich nur, wenn du die Seite http://localhost/katja.php noch aufgerufen hast.
Der Beweis: Ansicht im Browser und im HTMLQuelltext.
Wie du in der Abbildung siehst, werden die Tags korrekt ausgegeben. Zum Vergleich habe ich den Quelltext der »Webseite« aufgerufen. Das solltest du ruhig ebenfalls einmal probieren. Wähle dazu im Menü ANSICHT den Befehl QUELLTEXT. Vergewissere dich! Im Quelltext der »Webseite« ist tatsächlich kein PHPCode mehr enthalten. Denn schließlich sorgt der Webserver dafür, dass PHP interpretiert, ausgeführt wird. Und der Webserver schickt halt den HTML-Code Hallo Katja! an den Browser. Das Beispiel findest du auch auf der CD, und zwar wieder im Ordner kapitel03. Der Dateiname dieser Version lautet katja2.php.
Wie Pech und Schwefel: Strings verketten PHP ist einfach! Unter dem Motto »Freiheit für Kettenhunde« reden wir nun über die »Hundeleine« in PHP. Ich meine den Verkettungsoperator Punkt. Doch eigentlich brauchen wir über diesen Punkt gar nicht so viele Worte zu
97
Kapitel
3
Hallo echo – »Hallo Welt« verlieren. Der große Vorteil: Strings und Variablen müssen nicht verkettet werden. Zumindest gilt das in den meisten Fällen. Doch was ist mit Verketten überhaupt gemeint? Unter Verketten versteht man das Verbinden von zwei oder mehr Zeichenketten. Dazu wird normalerweise ein sogenannter Verkettungsoperator verwendet. Als Verkettungsoperator dient in PHP der Punkt. Schaue dir doch noch einmal unser Beispiel von eben an: $vorname!"; ?>
Du setzt die Variable einfach so mir nichts dir nichts in die Zeichenkette hinein. Das spart viel Schreibarbeit und scheint für uns ganz selbstverständlich zu sein. Ist es auch, denn diese raffinierte Technik ist eine Spezialität von PHP. Bei herkömmlichen Programmiersprachen gilt jedoch: Eine Variable darf grundsätzlich nicht so einfach innerhalb von Gänsefüßchen notiert werden. Sie muss stets ohne Gänsefüßchen stehen. Das können wir mit PHP »nachspielen«. Schau dir zum Vergleich dieses vereinfachte Beispiel an. Hier geben wir nur den Wert aus der Variablen aus:
Die Variable selber wurde dank der Gänsefüßchen schon in der ersten Zeile als Zeichenkette »gekennzeichnet«. Es ist also völlig überflüssig, in der zweiten Zeile noch Gänsefüßchen aufzuschreiben.
Strings und Variablen verketten? Meist unnötig! Eine Variable wird normalerweise nicht in Gänsefüßchen gesetzt. Der Rest jedoch muss als Zeichenkette gekennzeichnet werden. Um Variable und umgebende Zeichenketten zu verbinden, bedient man sich in »herkömmlichen« Programmiersprachen der Technik des Verkettens. 98
Wie Pech und Schwefel: Strings verketten Warum? In diesen Sprachen darf die Variable nicht einfach Teil des Strings sein. Sie muss mit dem String verkettet werden. Was in anderen Programmiersprachen das einzig Wahre ist, geht natürlich auch in PHP. Du kannst das Beispiel von oben also auch in dieser »Verkettungs-Variante« aufschreiben. Hier als die »Version 3« des »Katja-Beispiels«: " . $vorname . "!"; ?>
Interessant ist die zweite Zeile. Das Ergebnis entspricht der Version 2. Nur die Schreibweise ist komplizierter geworden. Die Variable wird zu ihrer linken und rechten je mit dem umgebenden String verkettet. Die Ausgabe jedoch ändert sich nicht, es erscheint weiterhin der Text Hallo Katja! im Browser. Wie schon erwähnt: In PHP ist das umständliche Verketten von Strings mit Variablen in den meisten Fällen nicht nötig. Die Variable verträgt es, mit in das »Gänsefüßchen-Boot« genommen zu werden. Wir haben uns in diesem Beispiel also zu viel Arbeit gemacht. Dieses »Zuviel an Arbeit« findest du zum Vergleichen unter dem Namen katja3.php auf der Buch-CD.
Strings verketten – manchmal geht’s nicht ohne! Warum habe ich dir diese umständliche Variante hier schon gezeigt? Nun, in manchen Fällen kommst du um das Verketten nicht drum herum! Zum Beispiel bei Funktionen. Oder bei den sogenannten Feldvariablen, den Arrays. Einverstanden, die Arrays kennst du noch nicht. Das verschieben wir also auf später. Doch mit einer Funktion können wir uns an dieser Stelle schon beschäftigen. Nix verstehen? Nehmen wir ein Beispiel! Angenommen, du möchtest den markigen Satz: Hallo Katja, willkommen in 2010! ausgeben. Weiterhin wünschst du, dass das Jahr automatisch erzeugt wird. (Wenn du das Buch in 2011 oder 2012 liest, soll natürlich auch 2011 bzw. 2012 ausgegeben werden.) Wie geht das? Mit einer Funktion! Du nimmst einfach eine entsprechende Funktion mit dem passenden Argument.
99
Kapitel
3
Hallo echo – »Hallo Welt«
Zum Ausgeben der aktuellen Jahreszahl dient die Funktion date("Y") oder auch date('Y'). Um genauer zu sein: Es ist eine Funktion mit Argument. Die Funktion selbst lautet dabei date(). Das Argument ist hierbei "Y". Und nun noch ein paar Worte zu den Gänsefüßchen: Ob du die doppelten oder die einfachen Gänsefüßchen wählst, ist eigentlich egal. Da du aber Gänsefüßchen nicht einfach ineinander verschachteln darfst, musst du in manchen Fällen die Variante mit den einfachen Gänsefüßchen wählen. Entscheide also von Fall zu Fall.
Die Jahreszahl wird durch die Funktion date("Y") erzeugt.
Schreibe die entsprechende Zeile also folgendermaßen: echo "Hallo $vorname, willkommen in " . date("Y") . "!";
Hier haben wir mit Hilfe der Verkettung dafür gesorgt, dass die Funktion »funktioniert«. Das Jahr wird korrekt berechnet. (Vergleiche, wenn du magst, mit dem Vorbild-Beispiel katja4.php auf der CD.) Achte beim Verketten unbedingt darauf, dass Leerzeichen mit berücksichtigt werden müssen. So musst du im Beispiel nach dem Wort in unbedingt ein Leerzeichen setzen, bevor du das schließende doppelte Gänsefüßchen setzt. Da das Ausrufungszeichen jedoch direkt hinter der Jahreszahl notiert werden soll, ist dort kein Leerzeichen nötig. Würdest du auf die Verkettung verzichten, wäre das Ergebnis grausam. Bei der Variante mit doppelten Gänsefüßchen date("Y") würde es Fehlermeldungen hageln. Warum? Weil du versucht hast, Gänsefüßchen ineinander zu verschachteln. Das solltest du dir also nicht antun. Aber auch eine Veränderung von date("Y") in date('Y') führt nicht zum gewünschten Ergebnis. Zugegeben, das Gänsefüßchen-Problem haben wir damit auf raffinierte Art gelöst. Folgender Quellcode 100
echo "Hallo $vorname, willkommen in date('Y')!";
Kleine Zeilenumbruchkunde führt jedoch zu dieser Anzeige:
Die Funktion wird nicht ausgeführt, sondern im Klartext angezeigt.
Was ist passiert? Statt die Funktion auszuführen, zeigt sie der Webserver im Klartext an. Kunststück, die Funktion wurde als String behandelt, als einfache Zeichenfolge. Und das ist natürlich Quatsch mit Soße, denn so kann sie nicht funktionieren.
Kleine Zeilenumbruchkunde Kennst du den »Breakdance«? Oder das berühmt-berüchtigte englische »Breakfast«? Alles hat irgendwie mit »Brechen« zu tun. Beim Breakdance bricht man sich womöglich die Knochen, beim englischen »Breakfast« … nein, lassen wir das jetzt.
Mit einen HTML-Zeilenumbruch erzeugen Ich wollte eigentlich auf den Break hinaus, auf den Umbruch. Ich zeige dir, wie du problemlos einen Zeilenumbruch ( ) in dein Dokument zauberst. Dafür erweitern wir einfach mal unser Katja-Beispiel. Ich greife dafür auf eine frühere Fassung zurück, auf unsere Version 2: Hier noch einmal der PHP-Teil: $vorname!"; ?>
Und jetzt ergänzen wir eine zweite echo-Zeile! Damit die neue Zeile auch wirklich auf die »neue Zeile« rutscht, füge ich zusätzlich einen HTMLUmbruch ein. Dafür sorgt das Zeichen .
101
Kapitel
3
Hallo echo – »Hallo Welt«
$vorname! "; echo "Super, dass du mal vorbeischaust."; ?>
Im Browser sieht das Ganze so aus, zusätzlich habe ich über den Befehl SEITE|QUELLTEXT ANZEIGEN (Internet Explorer) bzw. ANSICHT|SEITENQUELLTEXT ANZEIGEN (Firefox) gleich den HTML-Quelltext aufgerufen.
Im Quelltext siehst du zwar das Tag , aber keinen Zeilenumbruch.
Bisher haben wir nur einen Umbruch im Browser erzeugt. Im Hintergrund findet jedoch kein Zeilenumbruch statt. Dieses Beispiel kannst du unter dem Namen katja-br.php von der CD abrufen.
Umbruch im Editor: Der Befehl \n wie new line Wie wäre es zusätzlich noch mit einem Umbruch im Editor? Zugegeben, bei zwei Zeilen ist das vielleicht nicht so wichtig. Doch wenn du häufiger mit echo arbeitest, entsteht irgendwann eine »Endlos-Zeile« im Editor. Wenn du hinter den Kulissen einen Zeilenumbruch wünschst, verwendest du den PHP-Befehl new line. Das entsprechende Zeichen heißt: \n Vor dem n wird lediglich ein Backslash notiert, ein rückwärtsgelehnter Schrägstrich. Das n selbst steht als Abkürzung für new line. Und so sieht das renovierte Beispiel aus, ich habe gleich zweimal mit \n gearbeitet:
102
$vorname! \n"; echo "Super, dass du mal vorbeischaust.\n"; ?>
Maskenball: Das Escape-Zeichen »\« Beim Aufruf im Browser wirst du keinen Unterschied zur vorherigen Variante feststellen. Nur der Blick in den Quelltext offenbart den kleinen, aber feinen Unterschied:
Mit \n erzeugst du die Zeilenumbrüche auch im Quelltext.
Vergleiche mit der Datei katja-nl.php von der CD.
Maskenball: Das Escape-Zeichen »\« Mit dem Backslash hat es eine besondere Bewandtnis. Eben habe ich dir diesen »schiefen Kollegen« im Zusammenhang mit dem »Zeilenumbruch« vorgestellt. Mit \n wird eine neue Zeile im Editor erzeugt, du erinnerst dich. In diesem Fall wird unser »Strich-Kumpel« also zu einem Steuerbefehl für die Anzeige des Quelltextes.
Die wichtigsten Umbruch-Steuerbefehle Es gibt übrigens noch mehr solcher interessanten Steuerbefehle. Die wichtigsten davon stelle ich dir in dieser Tabelle vor: \n erzeugt neue Zeile
Gut, damit haben wir die eine Bedeutung geklärt. Doch hast du schon einmal darüber nachgedacht, was das komische Zeichen »\« wohl sonst noch bedeuten mag?
103
Kapitel
3
Hallo echo – »Hallo Welt«
Backslash als »Escape-Zeichen« Dieser Backslash (\) wird auch als »Escape-Zeichen« bezeichnet. Denn normalerweise dient er zum Maskieren bestimmter Sonderzeichen, die du sonst nicht so einfach ausgeben darfst. So darfst du z. B. Gänsefüßchen nicht einfach »im Klartext« in dein Skript hineinschreiben. Gänsefüßchen signalisieren schließlich, dass ein String beginnt bzw. endet. Doch wenn du unbedingt die Gänsefüßchen benötigst? Vielleicht, weil du eine Passage in Anführungszeichen setzen willst? Die eine Möglichkeit lautet: Ersetze die Gänsefüßchen durch einfache Gedankenstriche. Die andere Lösung: »Maskiere die Gänsefüßchen« durch das EscapeZeichen. \"$vorname\"! \n"; ?>
Das Ergebnis im Browser sieht dann so aus:
Nach dem »Escapen« werden auch Gänsefüßchen korrekt angezeigt.
Vergleiche mit der Datei escape.php auf der Buch-CD. Du musst auch das Dollar-Zeichen ($) oder den Backslash (\) maskieren, falls du diese Zeichen per echo als HTML ausgeben willst. Denn auch diese Zeichen haben normalerweise eine Sonderbedeutung. 104
Keinen Durchblick? Kommentare setzen!
Keinen Durchblick? Kommentare setzen! Steigst du noch durch deinen Quelltext durch? Klar doch! Bei zwei oder drei Zeilen ist das alles noch kein Problem! Doch wie sieht das bei umfangreichen Projekten aus? Weißt du nach Wochen immer noch genau, was die geniale Zeile 87 macht? Und wozu die schließende geschweifte Klammer in Zeile 145 dient? Der Mensch vergisst … (und auch Buffi-Hunde haben nicht gerade das beste Gedächtnis.) Gewöhne dir deshalb frühzeitig an, mit Kommentaren zu arbeiten! Das sind Bereiche, die nur von dir gesehen werden, aber auf den Programmablauf keinen Einfluss haben. Kommentare helfen dir, den PHP-Quellcode zu erklären.
Einzeilige Kommentare Willst du schnell mal einen einzeiligen Kommentar setzen, verwendest du den Doppelslash //: // Das ist ein einzeiliger Kommentar
Du kannst diesen Kommentar auch direkt an das Ende einer Zeile setzen, z. B. folgendermaßen: $vorname = "Katja"; // Variable $vorname initialisieren
Kommentare über mehrere Zeilen ziehen Wenn du dagegen »ganze Romane« schreiben möchtest, bietet dir PHP auch dafür eine Möglichkeit. Fasse deine mehrzeiligen Kommentare zwischen den Zeichen /* und */ zusammen: /* Das ist ein Kommentar, der sich im Beispiel gleich über mehrere Zeilen erstreckt und Platz im Buch verschwendet */
105
Kapitel
3
Hallo echo – »Hallo Welt«
Also ich habe es mir inzwischen angewöhnt, ausgiebig mit Kommentaren zu arbeiten. Ich kann dir diese Vorgehensweise nur empfehlen. Ein anderer Trick besteht darin, dein Skript einfach durch Leerzeilen zu gliedern. Tippe ruhig auf [Enter], um vor und nach einer wichtigen Zeile eine Leerzeile zu erzeugen. Das erhöht die Übersicht enorm. Der Programmablauf wird dadurch jedoch nicht gestört.
Fehlermeldung? Cool bleiben! Es ist zum Auswachsen! Du tippst deinen Code und lädst das Dokument in den Webserver? Eine Fehlermeldung taucht auf. Du korrigierst, lädst erneut – der Fehler bleibt. Ach ja, das Speichern. Du hattest vergessen, vor dem Aktualisieren zu speichern. Neu laden und – was sehen deine vom Bildschirmflimmern überanstrengten Äuglein jetzt? Eine neue Fehlermeldung! Es ist manchmal fast zum Auswachsen und es gibt Momente, da würden Hund Buffi und Buchautor Hanke den PC mitsamt Monitor am liebsten gemeinsam aus dem Fenster werfen. Doch halt! Cool bleiben, lautet die Devise. Hier ein paar Tipps, wie du Fehler vermeiden kannst.
Semikolon ; am Zeilenende vergessen? Vergiss nicht, dass eine Programmier-Zeile am Ende mit einem Semikolon abgeschlossen werden muss. Das vergessene Semikolon ist einer der häufigsten Fehler. Praktisch alle Zeilen müssen mit einem Semikolon abgeschlossen werden. (Nur in Ausnahmefällen lässt du das Semikolon weg. Aber darauf kommen wir noch zu sprechen!)
Grausam: Schon ein vergessenes Semikolon führt zu einer Fehlermeldung.
Schau dir die Abbildung an. Das Gemeine an der Geschichte: Die Fehlermeldung bezieht sich nicht etwa auf die Zeile, in der das Semikolon fehlt. Es wird die nächste Zeile (hier Zeile 14) moniert. Klar, denn da du das Semikolon vergessen hast, weiß der »PHP-Interpreter« nicht, dass die Zeile schon zu Ende war. 106
Fehlermeldung? Cool bleiben!
Variablen korrekt benannt? Ein anderer typischer Fehler schleicht sich immer wieder bei den Variablen ein. Hast du dem Variablennamen auch wirklich ein Dollarzeichen vorangestellt? Verschreiber bei den Variablennamen gehören ebenfalls zu den häufigen Fehlern.
Wenn ich Dollarzeichen sage, meine ich auch Dollarzeichen. Mir passiert es gelegentlich, dass ich eine Variable statt $vorname als §vorname schreibe. Was ich hier im guten Glauben richtig gemacht zu haben glaubte, ist natürlich ein Fehler. Hast du die Groß- und Kleinschreibung bei Variablen beachtet? Wenn du die Variable mit $Vorname initialisierst und versuchst, mit $vorname darauf zuzugreifen, kann das einfach nicht gelingen. Variablen dürfen außerdem nicht mit einer Zahl beginnen, eine Bezeichnung $68vorname würde ebenfalls zu einer Fehlermeldung führen.
Gänsefüßchen richtig gesetzt? Ein anderer typischer Fehler ist das Vergessen eines Gänsefüßchens. Wenn du statt $vorname = "Katja";
einfach schreibst $vorname = "Katja;
gibt es auf jeden Fall Probleme. Jedes »einschaltende« Gänsefüßchen benötigt auch ein »Ausschalt-Pendant«.
Falsche Klammersetzung? Apropos Ein- und Ausschalten. Im Verlauf des Buches wirst du mit »Klammer-Blöcken« arbeiten. Nutze die schon von CSS bekannten geschweiften Klammern { }, um mehrere Zeilen zu einem Block zusammen zu fassen. Bei den sogenannten Fallunterscheidungen oder den Schleifen zeige ich dir dieses Prinzip später noch ganz genau. Soviel schon vorweg: Auch das versehentliche Vergessen einer öffnenden oder schließenden Klammer führt natürlich zu Fehlermeldungen.
107
Kapitel
3
Hallo echo – »Hallo Welt« Probleme gibt es vor allem dann, wenn du mehrere »Klammern-Blöcke« ineinander verschachteln musst, und nicht mehr durchblickst, wo welche Klammer nun geschlossen werden soll. Auch hier schon an dieser Stelle mein Tipp: Kommentare setzen! Notiere, wo du welche Klammer öffnest und wieder schließt. Bei dir wird der PHP-Code überhaupt nicht ausgeführt? Nur der HTMLTeil der Seite erscheint? Hast du denn die Seite über den Webserver aufgerufen? Also z. B. über http://localhost/katja.php? Das einfache Doppelklicken auf den Eintrag funktioniert nicht. Vergiss nicht, dass PHP erst durch den »Webserver gezogen werden muss«: Bei PHP handelt es sich schließlich um Server-Programmierung!
Schlussbemerkung Was für ein Kapitel! Du kannst nun programmieren. Na gut, ein wenig zumindest schon. Du kennst Variablen, weißt, wie du Text ausgibst und kämpfst (hoffentlich erfolgreich) mit einer Vielzahl von Fehlern.
Zusammenfassung 0 Du weißt, dass PHP-Dokumente HTML-Dokumente mit der Endung .php sind. Du weißt, dass PHP-Bereiche von umschlossen werden. 0 Du kennst die Sprachanweisung echo zur Ausgabe von Daten. Setze den auszugebenden String in Gänsefüßchen, schließe die Zeile durch ein Semikolon ab: echo "Hallo Welt!"; 0 Du kennst das Konzept der Variablen, der »variablen Platzhalter«. Du möchtest eine Variable initialisieren? Notiere die Variable links, den Wert rechts. Setze dazwischen das Gleichheitszeichen, hier Zuweisungsoperator genannt: $vorname = "Katja"; (Die Leerzeichen vor und nach dem Istgleichzeichen haben lediglich eine optische Funktion.) 0 Du weißt, dass du bei der Ausgabe mit echo selbst mit HMTL-Tags arbeiten kannst. Notiere Strings und Variablen einfach innerhalb eines Gänsefüßchen-Paars. Du benötigst keinen Verkettungsoperator, wenn du mehrere Elemente zu einem String zusammensetzen möchtest. Eine Zeile wie echo "Hallo $vorname!"; ist für PHP kein Problem. 108
Ein paar Fragen … 0 In wenigen Fällen musst du doch den Verkettungsoperator Punkt verwenden, beispielsweise bei der Rückgabe von Werten aus Funktionen. Du hast den Verkettungsoperator im Zusammenhang mit der Funktion date() kennengelernt. 0 Du kennst den Steuerbefehl \n, mit dem man einen Zeilenumbruch auch im Editorfenster erzeugt. Du weißt, dass man mit \ sonst nicht darstellbare Sonderzeichen wie " oder $ maskieren (escapen) kann: Schreibe z. B. \" bzw. \$ 0 Du kennst meine Empfehlung zum Setzen von Kommentaren. Einzeilige Kommentare notierst du hinter //, mehrzeilige Kommentare kleidest du in die Zeichen /* und */ ein. 0 Wir haben besprochen, woher viele Fehler herrühren. Vergiss keinesfalls das Semikolon am Zeilenende oder das schließende Gänsefüßchen. Achte stets auf die korrekte Schreibweise der Variablen.
Ein paar Fragen … 1. Wie nennt man das Gleichheitszeichen zwischen Namen und Wert einer Variablen? 2. Nenne drei Datentypen für Variablen in PHP! 3. Mit welchem Steuerbefehl erzeugst du eine neue Zeile im Editor?
… und ein paar Aufgaben 1. Schreibe ein PHP-Dokument, welches den Satz »PHP macht Spaß!« ausgibt. Nenne es fun.php. 2. Wie heißt dein bester Kumpel? Speichere ihren/seinen vollständigen Namen in zwei Variablen. Nenne die erste Variable $vorname, die zweite $nachname. Gib den Namen mit PHP aus, indem du diese beiden Zeichenketten gemeinsam ausgibst. Speichere das Dokument unter dem Namen kumpel.php. 3. Füge in die Datei kumpel.php einen Kommentar ein, der dir jede Zeile erklärt.
109
4 Spaß mit Datum und Uhrzeit Time is money, Zeit ist Geld! So lautet das »gnadenlose Motto« vieler Erwachsener. Ich habe mir für dieses Kapitel einen ungleich besseren Wahlspruch ausgedacht. Er lautet: Time is fun, Zeit macht Spaß. In diesem Sinne stürzen wir uns nun ins Abenteuer Zeit. In diesem Kapitel lernst du: $ wie du mit den entsprechenden Funktionen Zeit und Datum ausgibst $ wie du mit if-else-Kontrollstrukturen eine tageszeitabhängige Begrüßung programmierst $ wie du mit sogenannten Feldvariablen (Arrays) die Wochentage ausgibst $ wie du mit Arrays in der Kurzform umgehst $ wie du Monatsnamen in sogenannten assoziativen Arrays speicherst
111
Kapitel
4
Spaß mit Datum und Uhrzeit
Immer up to date Bist du up to date? Ich bin es nicht! Wenn mich einer nach dem Datum fragt, zucke ich meist mit der Schulter. Wozu gibt es denn Computer? Fragen wir doch einmal den Webserver, welches Datum wir gerade haben! Bei den nun zu besprechenden Funktionen wird stets Datum und Uhrzeit des Webservers zurückgegeben. Du arbeitest am heimischen PC? Dann sind Datum und Uhrzeit natürlich identisch mit den Angaben deines PCs. Auch bei den zu Beginn besprochenen Dienstleistern sollte es keine Probleme geben. Wenn deine Seiten jedoch auf einem amerikanischen Webserver liegen, handelt es sich bei der Serverzeit natürlich um die amerikanische Zeit!
Das Datum ermitteln Du möchtest Datum und Uhrzeit ermitteln? Dann brauchst du die Funktion date()! Erinnerst du dich? Wir hatten uns diese Funktion im vorigen Kapitel kurz angeschaut, allerdings nur im Zusammenhang mit dem Jahr. Der Code zum Ermitteln des aktuellen Jahrs lautet: date("Y"). Als Ergebnis bekommst du eine vierstellige Jahresanzeige wie 2008. Doch das Jahr alleine reicht mir nicht aus. Selbst der schusselige Buchautor kennt in der Regel den richtigen Jahrgang! Wo bleiben die Monate, die Tage? Die holen wir uns schnell dazu! Füge der Funktion einfach weitere »Schalter« hinzu. Angenommen, du möchtest das Datum im Format 1.8.08 ausgeben. Also den Tag und den Monat ohne führende Null und das Jahr mit zwei Stellen. Dann schreibst du z. B. echo date("j.n.y");
Wichtig sind die Buchstaben j, n und y. Die Punkte dienen lediglich zum »Gestalten«. Ran an die Praxis, probiere das doch gleich einmal aus! Erstelle eine neue PHP-Datei, ich schlage den Namen datum1.php vor. Wir wollen das aktuelle Datum mit der eben besprochenen Funktion ausgeben. Ich zeige dir auf der nächsten Seite, was ich zwischen den Tags notiert habe:
112
Immer up to date
Das aktuelle Datum ausgeben
Diese Funktion verrät dir stets das aktuelle Datum.
Die Schalter zur Ermittlung des Datums In der folgenden Tabelle habe ich dir alle Schalter zur Ermittlung des Datums aufgeschrieben. Bitte bekomme keinen Schreck, denn hinterher probieren wir das Ganze an weiteren Beispielen aus! Schalter j d n m S y Y D l (kleines »L«) M F w z t
Erklärung Monatstag ohne führende Null Monatstag mit führender Null Monatszahl ohne führende Null Monatszahl mit führender Null englisches Aufzählungszeichen (st, rd, th) Jahreszahl mit zwei Stellen Jahreszahl mit vier Stellen Wochentag, Kurzschreibweise Wochentag, Langschreibweise Monatsname, Kurzschreibweise Monatsname, Langschreibweise Wochentag als Zahl (0=Sonntag) Tag des Jahres als Zahl Anzahl der Monatstage
Beispiel 1 bis 31 01 bis 31 1 bis 12 01 bis 12 1st 3rd 5th 10 2010 Mon Monday Jan January 0 bis 6 0 bis 365 28 bis 31
Weitere Praxisbeispiele Schauen wir uns ein paar Praxisbeispiele an! Du möchtest nur den Wochentag in der Langform ausgeben? Dann genügt folgende Zeile. echo date("l");
113
Kapitel
4
Spaß mit Datum und Uhrzeit Solle es das Datum in voller Pracht sein? Wochentag und Monat jeweils mit führender 0, also nach dem Muster 01.05.? Und das Jahr in vierstelliger Schreibweise? Dann notierst du einfach: echo date("d.m.Y");
Du wünschst z. B. folgende englische Schreibweise: 3rd of July 2010? Dann versuche Folgendes – es funktioniert aber nicht unter allen PHP-Versionen: echo date("jS of F Y");
Wie du siehst, kannst du die Ausgabe des Datums sogar gestalten. Arbeite innerhalb von date() mit Leerzeichen und in Grenzen selbst mit anderen Zeichen wie hier mit dem Punkt! Setze diese Zeichen einfach an der gewünschten Stelle innerhalb von date("") ein, wie bei diesem Beispiel: date("d.m.Y")! Die Punkte dienen hier lediglich als kosmetisches Beiwerk. Nicht alle Zeichen lassen sich jedoch verwenden, deshalb würde ich mich auf Leerstellen und den Punkt beschränken. Im Zweifelsfalle lautet die Devise: Probieren geht über Studieren. Du möchtest angeben, wie viele Tage der aktuelle Monat hat? Du willst den aktuellen Monat dabei ausschreiben (auf Englisch). Dann notierst du beispielsweise folgenden Code (auf einer Zeile): echo "Der " . date("F") . " hat " . date("t") . " Tage.";
Beachte, dass du hierbei wieder mit einer Verkettung arbeiten musst. Ansonsten wird die Funktion nicht aktiviert.
Mit den entsprechenden Schaltern gelingt dir die gewünschte Schreibweise im Nu.
114
Schau dir zum Vergleichen meine Beispieldatei an. Du findest sie im Ordner kapitel04 unter dem Namen datum2.php.
Wer hat an der Uhr gedreht?
Wer hat an der Uhr gedreht? Niemand, hoffe ich! Zumal die Zeitanzeige in PHP sowieso digital erfolgt. Das Drehen an irgendwelchen Zeigern ist schon aus diesem Grund gar nicht möglich. Wie zeigt man die Uhrzeit an? Auch hier hilft uns die Funktion date() aus der Patsche. Und wieder brauchen wir – du ahnst es sicher längst – ganz bestimmte Schalterchen für diesen Zweck. Die wichtigsten Schalter lauten H (Stunden im 24-Stunden-Format), i (Minuten mit führender Null von 00 bis 59) und s (Sekunden von 00 bis 59). Wenn du die Stunden, Minuten und Sekunden anzeigen möchtest, schreibst du: echo date("H:i:s");
Wie du siehst, arbeite ich auch hier mit Formatierzeichen. Diesmal verwende ich den für die Uhrzeit typischen Doppelpunkt (:).
Alle Uhrzeitschalter im Blick In der folgenden Tabelle habe ich dir alle Schalter zur Ausgabe der Uhrzeit aufgeschrieben. Tröstlich – es sind im Gegensatz zum Datum viel weniger: Schalter a A h H i s
Erklärung am oder pm AM oder PM Stunde im 12-h-Format Stunde im 24-h-Format Minuten von 00 bis 59 Sekunden von 00 bis 59
Beispiel am AM 1 bis 12 1 bis 24 04 12
Die Zeit vergeht … ein kleines Beispiel Zum Ausprobieren schlage ich ein kleines Beispieldokument vor. Nenne es uhrzeit.php. Ich zeige dir lediglich den Teil zwischen den Tags , der Rest ist ganz normales HTML.
Beim Aufruf dieser Seite war es genau ...
115
Kapitel
Spaß mit Datum und Uhrzeit
4 Für die genaue Uhrzeit musst du ständig auf den Reload-Button klicken.
Ist PHP dafür gedacht, um ständig die ganz aktuelle Uhrzeit auszugeben? Und zwar sekundengenau? Die Antwort lautet: Nein! Denn dann müsste das Skript im Sekundentakt immer wieder aufgerufen werden. Die Seite müsste also sechzigmal pro Minute vom Server abgerufen und an den Browser geschickt werden. Das ist nicht Sinn der Sache, denn dann wäre der »Arbeitsaufwand« (die »Last«) für den Server zu groß. Für solche Aufgaben bietet sich dagegen die Skriptsprache JavaScript an. Diese läuft schließlich direkt im Browser.
Pause muss sein: Die if-elseEntscheidungsstruktur Wenn, ja wenn das Wörtchen wenn nicht wär’ … Dann wär’ das Leben nur halb so schwer. Stoßen deine Eltern, Tanten oder Bekannten auch manchmal solche hilflosen Drohungen aus wie: »Wenn du nicht gleich dein Zimmer aufräumst, gibt es kein Fernsehen« oder »Wenn du nicht sofort deine Hausaufgaben machst, darfst du nicht runter auf die Straße«? Egal ob »unerfreuliche Gegenwart« oder »düstere Vergangenheit«. In diesem Buch sehen wir alles von der optimistisch-heiteren Seite! Glaube es oder nicht: Mit diesen »Beweisen erzieherischer Intoleranz« haben dir deine Erzeuger ganz unbewusst wertvollen Anschauungsunterricht zur Informatik erteilt. Es geht um die Entscheidungsstrukturen.
Die Entscheidungsstruktur if-else Nehmen wir doch einmal das »Fernseh-Beispiel«. Formulieren wir es streng logisch: »Wenn du dein Zimmer aufräumst, gibt es Fernsehen, sonst gibt es kein Fernsehen«. 116
Pause muss sein: Die if-else-Entscheidungsstruktur Die dazugehörige Schreibweise in der Programmiersprache PHP sieht folgendermaßen aus – die Betonung liegt hierbei auf wenn und sonst: Wenn (Zimmeraufräumen) { Fernsehen; } sonst { kein Fernsehen; }
Zugegeben, in der Programmiererei »spricht man« Englisch. Aus wenn wird if und aus sonst else. Und da man beim Programmieren schlecht mit »Fernsehen« und »kein Fernsehen« arbeiten kann, fassen wir es allgemeiner. Nennen wir die beiden Fälle Fall A und Fall B. Dann sieht unser Grundgerüst folgendermaßen aus: if (Bedingung) { Fall A; } else { Fall B; }
Mit anderen Worten: Es wird eine Bedingung geprüft. Wenn diese Bedingung wahr ist, tritt Fall A in Kraft. Sonst – also wenn die Bedingung nicht wahr ist – führt das Programm Fall B aus. Übrigens kann der sogenannte else-Zweig auch weggelassen werden. Dann sieht die if-Konstruktion vom Schema her so aus: if (Bedingung) { Fall A; }
Es genügt also, ganz einfach die Bedingung zu prüfen. Von der Logik her macht das Sinn. Auch beim »Fernseh-Beispiel« weiß Tochter oder Sohn ganz genau was ihr oder ihm blüht, wenn er das Zimmer nicht aufräumt.
Geschweifte Klammern: Wichtiges Know-how Sicher fällt dir schon an diesem Beispiel ein interessantes »Detail« ins Auge. Zusammengehörende Ausdrücke wie bei diesen if-Strukturen werden in PHP in der Regel durch ein Paar geschweifter Klammern zusammengehalten { }. Dadurch fasst du diese Ausdrücke zu einem sogenannten Block 117
Kapitel
4
Spaß mit Datum und Uhrzeit zusammen. Dabei gilt: Die Zeile mit der Klammer wird ausnahmsweise nicht mit einem Semikolon abgeschlossen. if (Bedingung) {
Ich empfehle dir sehr die von mir verwendete Schreibweise: Schau dir das Beispiel an. Die öffnende geschweifte Klammer setzt du direkt nach einem Leerzeichen an das Ende der Zeile. So wirst du auch besser daran erinnert, an dieser Stelle kein Semikolon zu setzen. Der schließenden geschweiften Klammer spendierst du dagegen eine eigene Zeile. Auch hier ist kein Semikolon erlaubt: }
Ich habe noch einen ganz heißen Tipp für dich: Immer wenn ich eine öffnende geschweifte Klammer schreibe, setze ich sofort das Gegenstück. Egal, wie viele Codezeilen ich später noch dazwischen schreiben muss. Warum? So habe ich immerhin schon einmal den Block geschlossen. Denn das Vergessen einer schließenden Klammer ist eine häufige Fehlerursache! Mit meinem Trick ersparst du dir oft stundenlanges Suchen. Hier noch einmal in Kurzform: Wenn du eine öffnende Klammer schreibst, drückst du ein paar Mal auf [Enter] und notierst danach die schließende Klammer. Sicher hast du es längst bemerkt: Passagen innerhalb von geschweiften Klammern werden eingerückt. Dabei tippst du vor den einzurückenden Zeilen 2–4 Leerzeichen. Mehr zu den Einrückregeln erfährst du in einer PDF-Datei auf der Buch-CD unter dokumente/code_einrueckung und ganz ausführlich auch im Nachfolgeband »PHP und MySQL Praxisbuch für Kids« im Kapitel 2.
Wir machen … Mittagspause Grau ist alle Theorie (und zwar selbst bei Farbfernsehen). Deshalb machen wir gemeinsam eine Pause – eine Mittagspause! Und damit es auch alle Besucher deiner Website merken, teilst du es ihnen einfach mit.
118
Das folgende Beispiel soll zwischen 12:00 Uhr und 13:00 Uhr (genauer zwischen 12:00 Uhr und 12:59 Uhr und 59 Sekunden) den Text anzeigen: »Wir machen Mittagspause«. Ansonsten soll der Text »Willkommen auf unserer Seite« erscheinen. Wie geht das? Ganz einfach! Du brauchst lediglich die Funktion date() mit dem Schalter H. Schließlich verrät dir date("H") ganz genau, »was die Stunde geschlagen hat«.
Pause muss sein: Die if-else-Entscheidungsstruktur Hier mein Musterbeispiel, welches ich pause.php nenne. Ich zeige dir den wichtigsten Teil der Datei:
Pause zwischen 12:00 und 13:00 Uhr!
Zwischen Zwölf und Eins macht jeder seins … Mittagspause!
Du kannst gerne mit dem Musterbeispiel von der Buch-CD vergleichen. Schaue in den Ordner kapitel04.
So funktioniert das Beispiel Jetzt schauen wir uns die Funktionsweise dieses Beispiels einmal genauer an. Zuerst schreibst du das Schlüsselwort if und tippst ein Leerzeichen. In den runden Klammern wird nun die Bedingung auf ihren Wahrheitswert überprüft. Die Funktion date("H") ist dir vertraut, doch was hat das doppelte Gleichheitszeichen an dieser Stelle verloren? Das doppelte Gleichheitszeichen (==) ist der sogenannte Vergleichsoperator. Aus dem Mathematikunterricht kennst du das einfache Istgleich. Das gibt es in PHP auch, wie ich dir im vorigen Kapitel bewiesen habe. Das einfache Istgleich (=) ist jedoch nur der Zuweisungsoperator. Mit $vorname = "Katja"; hast du der Variablen $vorname z. B. den String Katja zugewiesen. Damit es nicht zu Verwechslungen kommt, hat man als Vergleichsoperator in PHP deshalb das doppelte Istgleich (==) gewählt. Achtung aufgepasst! Verwechsle die beiden Operatoren deshalb auf keinen Fall, du musst zum Vergleichen unbedingt das doppelte Istgleich (==) verwenden! 119
Kapitel
4
Spaß mit Datum und Uhrzeit Der Vergleich liest sich also so: Wenn es wahr ist, dass die Uhrzeit der Zahl 12 entspricht, dann wird die nächste Zeile ausgeführt. Diese Zeile macht nichts weiter, als den Text »Wir machen Mittagspause« auszugeben. Tipp: Falls es bei dir zufällig nicht gerade 12 Uhr ist, kannst du diesen Wert probeweise verändern. (Oder du stellst einfach mal die Uhr deines PCs um.) Wenn dieser Vergleich jedoch nicht wahr ist? Dann wird der else-Zweig ausgeführt. Und dieser gibt lediglich den Satz »Willkommen auf unserer Seite!« aus. Eigentlich ganz einfach, oder? Beachte unbedingt die korrekte Klammersetzung. Wir haben es in diesem Beispiel mit zwei Blöcken zu tun. Zum einen mit dem if-Block, zum anderen mit dem else-Block. Wie wichtig die richtige Klammersetzung ist, kannst du durch ein Experiment feststellen. Entferne doch zur Probe einmal die Klammer hinter else. Bei mir ist das in Zeile 15. Nach dem erneuten Aufruf der Seite im Browser bekommst du eine Fehlermeldung. Diese weist jedoch auf Zeile 17 hin. Klar, denn PHP wusste ja nicht, dass du in Zeile 15 einen Block öffnen wolltest. Das Programm meckert deshalb die schließende Klammer in Zeile 17 an! Falls es bei dir öfter zu solchen Problemen kommt, empfehle ich dir noch einmal die »heißen Hundetipps« von den Vorseiten: Setze zur öffnenden geschweiften Klammer stets sofort das schließende Pendant! Übrigens: Gute Editoren wie PSPad, Notepad++ oder Aptana Studio heben die dazugehörige schließende Klammer farblich hervor, sobald du die öffnende markierst! Achte einmal darauf!
Vergleichsoperatoren im Überblick Kompliziert? Eigentlich nicht! Mit dem doppelten Istgleich testet man auf Gleichheit. Das ist jedoch noch nicht alles. Höchste Zeit, dass ich dir nun auch die anderen Vergleichsoperatoren zeige. Operator == != > < >= <=
Bedeutung Gleich Ungleich Größer als Kleiner als Größer gleich Kleiner gleich
Diese sechs Operatoren sind relativ einfach zu verstehen. Den Gleichheitsoperator hast du schon kennengelernt, das doppelte Istgleich. 120
Pause muss sein: Die if-else-Entscheidungsstruktur Du kannst jedoch auch prüfen, ob zwei Elemente ungleich sind. So ist 12 ungleich 13. Du kannst auch testen, ob das erste Element größer oder kleiner als das zweite ist. Die 13 ist z. B. größer als die 12. Oder du prüfst, ob gilt: Das erste Element ist größer gleich bzw. kleiner gleich dem zweiten Element. Die 12 ist größer gleich 12. Damit ergeben sich sehr interessante Einsatzmöglichkeiten. Zum Beispiel für eine etwas längere Mittagspause? Apropos Mittagspause. Angenommen, du machst zwischen 11:00 und 13:00 Uhr eine »Brotzeit«. Wie baust du diesen Tatbestand in den Vergleich ein? Nichts leichter als das! Schreibe einfach zwei Vergleiche und verknüpfe diese miteinander. Beide Teilausdrücke müssen wahr sein. Moment mal, verknüpfen? Wie geht das denn? Da kommen uns die nächsten Operatoren doch wie gerufen!
Na logo! Logische Operatoren zum Verknüpfen Zum Verknüpfen von Vergleichen benötigst du die sogenannten logischen Operatoren. Hier stehen dir die folgenden zwei Operatoren zur Verfügung: Operator Bedeutung && bzw. and Logisches Und, alle Teilausdrücke müssen wahr sein || bzw. or Logisches Oder, mindestens ein Teilausdruck muss wahr sein
Wundere dich nicht, dass es zwei Schreibweisen gibt. Ich zeige dir beide, damit du auch mit der jeweils anderen Schreibweise vertraut bist. Ich jedoch bevorzuge für das logische Und das doppelte kaufmännische Und (&&). Beim logischen Oder empfehle ich dir die zwei senkrechten Striche, die »Pipe-Zeichen« (||). Wie erzeugst du die Pipe-Zeichen? Kein Problem! Halte die Taste [AltGr] gedrückt. Tippe dann die zweite Taste von links in der zweiten Reihe von unten. Die mit den spitzen Klammern, die Taste [<]!
Lange Mittagspause per Und-Verknüpfung Doch jetzt probieren wir diese Operatoren ganz schnell einmal aus! Es ging schließlich um unsere »lange Mittagspause«. Hier das Skript, welches ich und.php getauft habe.
Pause zwischen 11:00 und 13:00 Uhr!
121
Kapitel
4
Spaß mit Datum und Uhrzeit if (date("H") >= 11 && date("H") < 13) { echo "Wir machen Mittagspause."; } else { echo "Willkommen auf unserer Seite!"; } ?>
Interessant ist vor allem die vierte Zeile. Hier habe ich zwei Bedingungen mit dem Und-Operator (&&) miteinander verknüpft. Nur wenn beide Teilausdrücke wahr sind, wird der Satz »Wir machen Mittagspause« ausgegeben. Beide Teilausdrücke? Richtig! Es muss zum einen wahr sein, dass die Stunde größer oder gleich 11 ist. Damit wären zuerst einmal 11, 12, 13 usw. zugelassen. Der nächste Teilausdruck beschränkt den Bereich jedoch auf alle Werte unter 13. Hier wird verlangt, dass die Stunde kleiner 13 ist. Mit anderen Worten: Nur wenn die Stundenzahl zwischen 11 und 13 liegt, ist die Bedingung wahr. Um noch genauer zu sein: Die Zeitspanne muss zwischen 11:00 Uhr und 12:59 Uhr liegen, da die 13 selber nicht erreicht werden darf. Probiere es aus!
Wo gibt’s denn so was? Zwei Pausen am Tag! Fehlt zum Schluss noch die Oder-Verknüpfung. Diese sorgt schließlich dafür, dass mindestens ein Teilausdruck wahr sein muss. Was kompliziert erscheint, wird mit dem nächsten Beispiel sicher ganz einfach! Nehmen wir unser »Mittagspausen-Beispiel«. Wie wäre es mit zwei Mittagspausen? Die eine recht früh von 11:00 bis 11:59 Uhr. Die andere dagegen von 14:00 bis 14:59 Uhr, praktisch als Siesta. Da hilft folgende Vergleichs-Konstruktion. if (date("H") == 11 || date("H") == 14) { echo "Wir machen Mittagspause."; }
Dank des Oder-Operators zeigt die Seite den »Mittagspausen-Satz« nun in den oben genannten zwei »Zeitfenstern« an. Zum einen, wenn es zwischen 11:00 und 11:59 Uhr ist; zum anderen aber auch dann, wenn der Zeiger zwischen 14:00 und 14:59 »pendelt«. Vergleiche mit der Datei oder.php, wo ich diese Änderung eingebaut habe. 122
Der Tag vergeht: Zwischentöne mit elseif
Der Tag vergeht: Zwischentöne mit elseif Eltern haben ja manchmal Phantasie. Sie versuchen, Tochter oder Sohn durch unterschiedliche »Vergütungsmodelle« zu motivieren. Nehmen wir zum Beispiel das Taschengeld. Wenn du sofort das Zimmer aufräumst, wird das mit 3 Euro Taschengeld honoriert. Räumst du das Zimmer dagegen später auf, gibt es immerhin noch 2 Euro. Wenn du das Zimmeraufräumen jedoch vergisst, gibt es überhaupt kein Taschengeld. Auch mit diesem Modell haben uns unsere Erzeuger wieder eine wunderbare Informatik-Lektion erteilt! Um das Beispiel darzustellen, müssen wir unsere if-else-Konstruktion um einen weiteren Zweig ergänzen.
Einbau eines elseif-Zweigs Und schon sind wir beim sogenannten elseif-Zweig angelangt. Der elseif-Zweig ist immer dann interessant, wenn man mehrere konkrete Fälle voneinander unterschieden möchte. Das »Taschengeld-Beispiel« lässt sich folgendermaßen symbolisieren: if (Zimmeraufräumen sofort) { 3 Euro Taschengeld; } elseif (Zimmeraufräumen später) { 2 Euro Taschengeld; } else { kein Taschengeld; }
Ziemlich praktisch und raffiniert, findest du nicht? Dabei können sogar noch mehr elseif-Zweige eingebaut werden. Der nächste elseif-Zweig wird nur ausgeführt, wenn die Prüfung im übergeordneten Zweig nicht wahr war. Also wenn das if oder elseif nicht zum Erfolg geführt hat. Auch hier gilt: Der else-Zweig ganz am Schluss kann wieder weggelassen werden.
123
Kapitel
4
Spaß mit Datum und Uhrzeit
Tageszeitabhängige Begrüßung Wie wäre es mit einem sinnvollen Beispiel? Schreibe doch einmal ein Skript, welches die Besucher je nach Uhrzeit mit einem anderen Spruch begrüßt. Von 0:00 Uhr bis 10:59 Uhr soll die Begrüßung lauten: »Guten Morgen!«. Von 11:00 Uhr bis 14:59 Uhr dagegen »Mahlzeit!«. Bis 16:59 Uhr schlage ich »Willkommen zur Kaffeezeit!« vor. Ansonsten (also wenn keiner der obigen Fälle zutrifft), soll das Skript »Guten Abend« einblenden. Das ist ein Fall für elseif, und zwar gleich in doppelter Verpackung. Schau dir mein Beispiel an, ich zeige dir wieder den wichtigen Teil zwischen . Ich habe das Dokument willkommen.php genannt.
Mahlzeit! Mit elseif wird die Entscheidungsstruktur erweitert.
Auch hier noch ein interessantes Syntax-Detail: Wenn du mit else oder elseif arbeitest, notierst du dieses Schlüsselwort und die dazugehörige öffnende geschweifte Klammer am besten in der gleichen Zeile wie die schließende geschweifte Klammer des vorhergehenden Blocks. Das spart Platz und erhöht die Übersicht. 124
Feldvariablen: Wochentage aufschreiben
Feldvariablen: Wochentage aufschreiben Zurück zur Funktion date(), zurück zu den Wochentagen. Blättere ruhig ein paar Seiten zurück und schaue dir die Tabelle an. Wenn du den Wochentag als Namen ermitteln möchtest, verwendest du den Schalter l: date("l")
Die ganze Sache hat einen Haken: Der Wochentag wird in Englisch ausgegeben, in der Schreibweise Sunday, Monday, Tuesday usw. Für pfiffige englischkundige Schüler und Fachbuchautoren ist das kein Problem. Doch ob Otto Normalsurfer immer die englischen Wochentage kennt? Es wäre doch schön, wenn man die Wochentage auf Deutsch anzeigen könnte!
Wochentage auf Deutsch ausgeben Richtig! Man könnte für jeden Wochentag eine eigene Variable verwenden! Dann könnte man eine if-else-Kontrollstruktur schreiben, die aus Monday Montag, aus Tuesday Dienstag usw. macht. Es geht aber auch anders! Warum eine Variable für jeden Tag? Eine Variable für alle Tage ist viel besser! Eine sogenannte Feldvariable, ein Array! Wenn man mehr als einen Wert in einer Variablen speichern möchte, kommen die sogenannten Feldvariablen ins Spiel. Eine Feldvariable bildet ein »Feld« zusammengehöriger Elemente. Stelle es dir vor wie eine Fußballmannschaft oder wie die Schulklasse. Die Feldvariable ist der 1. FC Pokalsieg oder die Klasse 8c. Die einzelnen »Elemente« sind die Spieler bzw. Schüler der Klasse.
Feldvariablen werden Array genannt Feldvariablen werden auch als Arrays bezeichnet, als Werteliste. Das Wort Array betonst du auf der letzten Silbe. Das »A« am Anfang wird kurz gesprochen. Die Syntax wiederum sieht folgendermaßen aus: $Variablenname[Index-Wert]
125
Kapitel
4
Spaß mit Datum und Uhrzeit Im Klartext: Zuerst notierst du den Variablennamen wie gewohnt. Dann setzt du ohne Leerzeichen ein paar eckige Klammern. Doch wie unterscheidet man die einzelnen Elemente voneinander? Wie macht man kenntlich, dass es sich um Fußballspieler 1 oder Schüler 5 handelt? Das leistet der sogenannte Index-Wert. Dieser wird in eckigen Klammern notiert. Der Index-Wert ist eine Art Zähler zur Durchnummerierung! Er wird auch als key (Schlüssel) bezeichnet. Ganz wichtig: Der erste Wert in einem Array trägt per Voreinstellung die Schlüssel-Nummer 0. Der erste Index-Wert lautet also 0 und nicht 1. Weil das so wichtig ist, wiederhole ich es noch einmal: In einem Array beginnt die Zählung bei 0. Der 8. Spieler der Fußballmannschaft würde also den Index-Wert 7 tragen! Fassen wir zusammen: Arrays, die Wertelisten, bestehen aus mehreren Werten. Diese werden von PHP intern durchnummeriert. Der entsprechende Zähler nennt sich Index-Wert oder auch Schlüssel (key). Der key (Zähler) beginnt in der Voreinstellung stets bei 0.
Die Tage als Array Zurück zu unseren Wochentagen! Schau dir die Sache am Beispiel an! Die Variable selbst nennen wir $tag. Die einzelnen Wochentage werden durchnummeriert. Wir fangen beim Sonntag an. Der Sonntag bekommt die 0 (bei 0 beginnen!) und wird so notiert: $tag[0]. Der Montag sieht so aus $tag[1] usw. usf. Liste einfach alle Tage auf und weise die entsprechenden Werte zu. Als Test gibst du den Donnerstag mit der Sprachanweisung echo aus. Ich habe mein Dokument wochentage.php genannt. Ich zeige dir hier den PHP-Teil.
126
Feldvariablen: Wochentage aufschreiben Beachte, dass ich hier mit einem Kommentar arbeite (Zeichen //), um das Skript direkt im Quellcode erläutern zu können.
Da Sonntag Tag 0 ist, muss der Donnerstag Tag 4 sein.
Welcher Tag ist heute? Das bisherige Skript reißt dich sicher nicht gerade zu Begeisterungsstürmen hin. Mich auch nicht! Um lediglich das Wort Donnerstag auszugeben, hätten wir uns den Stress mit dem Array auch ersparen können. Viel interessanter ist der heutige Wochentag, als der Tag, an dem du das Buch liest. Wie ermittelst du mit PHP den Wochentag? Ganz einfach: Dafür sorgt die Funktion date() im Zusammenspiel mit dem Schalter w: date("w"). Das Schöne an date("w") ist, dass am Sonntag 0 und am Samstag 6 zurückgegeben wird. Was für ein Zufall, denn das passt ganz hervorragend für unsere Zwecke. Schließlich beginnt die Zählung bei Arrays ja auch bei 0! Mit dem folgenden Skript kannst du den aktuellen Wochentag auf Deutsch dynamisch im Dokument ausgeben. Vergleiche einfach mit der Datei heute.php aus dem Ordner kapitel04.
Das Prinzip ist einfach! Ich ermittle die »tagnummer« mit Hilfe der Funktion date("w") und speichere sie in der gleichnamigen Variablen. Diese Zahl übergebe ich der Feldvariablen $tag[] in den eckigen Klammern. Heraus kommt … der aktuelle Wochentag.
127
Kapitel
4
Spaß mit Datum und Uhrzeit
Arrays die Zweite: Es geht auch kürzer! Bei der bisherigen Array-Schreibweise handelt es sich um die sogenannte Langform. Da Programmierer faul sind, mögen sie besonders die alternativen Kurzformen. Die sieht für das Wochentage-Array folgendermaßen aus:
Nach dem Schlüsselwort array folgt die Werteliste. Diese notierst du in runden Klammern. Jeder Wert wird vom nächsten durch ein Komma getrennt. Da es sich um Strings handelt, notierst du die Tage selbstverständlich in Gänsefüßchen. Beachte, dass es sich trotz des Umbruchs im Buch um eine Zeile handelt! Wenn du aus Platzgründen ebenfalls einen Umbruch einbauen möchtest, dann nur nach einem Komma. Zerreiße keinesfalls Text, der innerhalb von Gänsefüßchen notiert wurde. Das Komma hat eine besondere Bedeutung. Alle Werte werden durch Komma voneinander getrennt. Die Zuweisung der keys (Index-Werte) erfolgt dabei automatisch hintereinander. Du musst sie nicht extra notieren. Das Beispiel findest du unter dem Namen heutekurz.php.
Array-Elemente zählen Wie viele Tage hat die Woche? Wie viele Schüler befinden sich in deiner Klasse? Zähle die Array-Elemente doch einfach einmal durch! Stelle es fest mit der Funktion count(). Und wie geht das nun mit count()? Die Funktion funktioniert ganz einfach: In runden Klammern übergibst du Namen des Arrays. Und zwar ohne irgendwelche eckigen Klammern. Schließlich beziehst du dich nicht auf ein einziges Element. Das gesamte Array wird »ausgewertet«. 128
Assoziativ: Monatsnamen als Array \n"; $elementzahl = count($tag); echo "Die Woche hat $elementzahl Tage.\n"; ?>
Du findest das Beispiel zum Vergleich unter dem Namen count.php.
Die Funktion count() zählt die Elemente eines Arrays.
Keine Bange, die Funktion count() zählt korrekt. Du musst dir also keine Sorgen machen, dass der Index-Wert 0 irgendeinen Einfluss hat. Wenn die Fußballmannschaft ein Array darstellen würde, bekäme der elfte Spieler zwar den Index-Wert 10. Trotzdem würde beim Zählen mit count() natürlich korrekt die 11 ermittelt.
Assoziativ: Monatsnamen als Array Das mit den Arrays ist eine ganz feine Sache. Gewiss. Doch nicht immer sind diese Index-Nummern der Weisheit letzter Schluss. Nehmen wir als Beispiel ein paar europäische Städte. Diese sollen in einem Array namens $hauptstadt festgehalten werden. Nach der »klassischen« Index-Variante sieht das folgendermaßen aus: $hauptstadt[0] $hauptstadt[1] $hauptstadt[2] $hauptstadt[3]
= = = =
"Berlin"; "Wien"; "Warschau"; "Paris";
Doch unter $hauptstadt[1] kannst du dir sicher nicht viel vorstellen. Du musst dir halt merken, dass sich dahinter Wien verbirgt. Je mehr Hauptstädte das Array enthält, desto komplizierter wird die ganze Geschichte.
129
Kapitel
4
Spaß mit Datum und Uhrzeit Logisch, denn unter nackten Zahlen kann sich ein Normalsterblicher – von ein paar Mathematik-Genies abgesehen – wenig vorstellen. Anders ausgedrückt: Mit bloßen Zahlen kann man wenig verbinden, wenig assoziieren. Viel praktischer ist es, wenn man diese Index-Nummern einfach durch eigene Werte ersetzt. Durch Werte, mit denen man etwas assoziieren kann. Was liegt bei Hauptstädten näher, als die im Web gebräuchliche Länderkennung zu verwenden? In unserer »assoziativen Variante« sieht das Array folgendermaßen aus: $hauptstadt["DE"] $hauptstadt["AT"] $hauptstadt["PL"] $hauptstadt["FR"]
= = = =
"Berlin"; "Wien"; "Warschau"; "Paris";
In assoziativen Arrays wird als key statt der Index-Nummer ein ganz eigenes Schema erzeugt. Dieses darfst du dir (fast) frei ausdenken. Es kann sich bei diesen »Ersatz-Schlüsseln« um Strings aber auch um Zahlen handeln. Der key in assoziativen Arrays wird – von Ausnahmen abgesehen – innerhalb von Gänsefüßchen notiert.
Einen einzelnen Index-Wert ausgeben Du möchtest einen einzelnen Index-Wert ausgeben? Kein Problem! Das Prinzip ist genau das gleiche wie bei den »klassischen Arrays« mit Zahlen als Index-Wert. Als zusätzlichen Test kannst du gleich noch die Elemente im Array durchzählen. Auch hier arbeitet count() wie gewohnt. Hier zeige ich dir den wichtigsten Teil meiner PHP-Datei hauptstadt.php.
\n"; echo "Elemente im Array: " . count($hauptstadt); ?>
130
… und wieder die Kurzform
Bei assoziativen Arrays kannst du dir den Schlüssel frei ausdenken.
Die Wirkungsweise ist klar? In der ersten echo-Zeile ist eigentlich nur die Ausgabe von $hauptstadt["PL"] interessant. Damit daraus aber eine ganze Wortgruppe wird, verknüpfe ich den String Polen: mit $hauptstadt["PL"]. Am Schluss sorgt ein Zeilenumbruch dafür, dass die nächste Zeile auch auf einer neuen Zeile steht. Und das Zeichen \n kümmert sich darum, dass auch im Quelltext ein Zeilenumbruch erfolgt. In der nächsten Zeile zähle ich die Elemente des Arrays durch.
… und wieder die Kurzform Übrigens gibt es auch bei den assoziativen Arrays eine Lang- und eine Kurzform. Auch bei dieser Kurzform arbeitet man mit runden Klammern. Davor notierst du wieder das Schlüsselwort array. Zusätzlich kommt jedoch das Zeichen »Daraus folgt« zum Einsatz. Das sieht so aus: =>. Zum Vergleich zeige ich dir hier die Kurzform des obigen Beispiels:
Die lange »Array-Zeile« liest sich wie folgt: Key DE daraus folgt Berlin, Key AT daraus folgt Wien usw. usf. Vergleich mit der Datei hauptkurz.php.
131
Kapitel
4
Spaß mit Datum und Uhrzeit
Den Monat ausgeben Zurück zu unserem Datums-Beispiel. Wir wollen diesmal den aktuellen Monat komplett auf Deutsch ausgeben. Damit es übersichtlich bleibt, setze ich ein assoziatives Array in der Langform ein: Als Schlüssel verwende ich die ausgeschriebenen englischen Monatsnamen. Warum? Weil die Funktion date("F") schließlich die Monatsnamen ausgeschrieben ermittelt. Dann brauche ich diesen englischen Monatsnamen nur noch in der Variablen $monatsname zu speichern. Diesen nutze ich als Key. Und schon habe ich den deutschen Monatsnamen. Hier das entsprechende Skript:
\n"; echo "Das Jahr hat " . count($monat). " Monate."; ?>
Die Monatsnamen werden durch ein assoziatives Array übersetzt.
132
Vergleiche mit der Datei monatsnamen.php im Ordner kapitel04.
Schlussbemerkung
Schlussbemerkung Nicht schlecht, Herr Specht: Du hast dich ein gutes Stück qualifiziert auf dem Weg zum »richtigen Programmierer«: Schließlich zählen die Entscheidungsstrukturen und die Arrays zu den wichtigsten Programmiergrundlagen. Und das »Spielen« mit Datum und Uhrzeit hat hoffentlich ein wenig darüber hinweggetröstet, dass der Stoff nicht immer ganz einfach ist.
Zusammenfassung 0 Du weißt, dass du mit der Funktion date() das Datum ermitteln kannst. Mit den richtigen »Schaltern« und mit Formatierzeichen wie Punkt oder Leerzeichen gelingt fast jede gewünschte Ausgabe. Für Tag und Monat ohne führende Null und das Jahr mit zwei Stellen schreibst du z. B. echo date("j.n.y"); 0 Auch die Uhrzeit kann mit der Funktion date() ganz einfach ermittelt werden. Wenn du die Stunden, Minuten und Sekunden anzeigen möchtest, schreibst du z. B.: echo date("H:i:s"); 0 Du hast die if-else-Entscheidungsstruktur kennengelernt. Es wird eine Bedingung auf Wahrheit geprüft. Wenn diese Bedingung wahr ist, tritt Fall A in Kraft. Sonst – also wenn die Bedingung nicht wahr ist – führt das Programm Fall B aus: if (Bedingung) { Fall A; } else { Fall B; }
0 Du kennst die wichtigsten Vergleichsoperatoren wie das Istgleich (==), die Zeichen Größer als (>), Kleiner als (<) und Größer gleich (>=) und Kleiner gleich (<=). 0 Du kennst die logischen Operatoren Und (&&) bzw. Oder (||), mit denen du mehrere Vergleiche miteinander verknüpfen kannst. Beim logischen Und müssen alle Teilausdrücke wahr sein. Beim logischen Oder muss dagegen mindestens ein Teilausdruck wahr sein.
133
Kapitel
4
Spaß mit Datum und Uhrzeit 0 Du kennst den elseif-Zweig, mit dem mehrere Bedingungen hintereinander geprüft werden können. Der nächste elseif-Zweig wird nur ausgeführt, wenn die Prüfung im übergeordneten Zweig nicht wahr war. 0 Du hast dich mit dem Konzept der Feldvariablen vertraut gemacht, der sogenannten Arrays. Eine Feldvariable bildet ein »Feld« zusammengehöriger Elemente. Indizierte Arrays besitzen als Schlüssel einen Zähler, der normalerweise bei Null anfängt zu zählen. So wird das erste Element des Arrays $tag so definiert: $tag[0]; 0 Du weißt, dass es neben den indizierten Arrays auch die sogenannten assoziativen Arrays gibt. Dabei wird der Nummern-Schlüssel durch eine selbst wählbare Zeichenfolge ersetzt. Nimm Zeichenfolgen, mit denen du etwas assoziieren kannst. So wäre $hauptstadt["DE"] = "Berlin"; eine gute Möglichkeit, die Hauptstadt von Deutschland zu speichern. 0 Du weißt, dass es bei Arrays eine Lang- und eine Kurzform gibt. Bei der Kurzform werden die einzelnen Array-Elemente in runden Klammern zusammengefasst. Vorangestellt wird das Schlüsselwort array. Bei assoziativen Arrays musst du zusätzlich mit dem Zuweisungsoperator => (Daraus folgt) arbeiten. 0 Du kennst die Funktion count(), mit der sich die Elemente eines Arrays zählen lassen.
Ein paar Fragen … 1. Mit welcher Funktion kannst du Datum und Uhrzeit darstellen? Nenne nur die Funktion ohne Schalter oder Formatierzeichen. 2. Was bedeutet if-else und wofür brauchst du diese Schlüsselworte? 3. Welches Zeichen verwendet man, wenn man zwei Elemente auf Gleichheit testen will? 4. Wie sieht der Vergleichsoperator aus, der auf Ungleichheit prüft? 5. Mit welcher Zahl beginnt die Zählung bei indizierten Arrays? 6. Mit welcher Funktion kannst du die Elemente eines Arrays zählen?
134
… und ein paar Aufgaben
… und ein paar Aufgaben 1. Schreibe ein PHP-Dokument, welches einen Satz nach diesem Muster ausgibt: »Heute ist Tag 5 des 3. Monats in 2009«. Dabei sollen natürlich der aktuelle Tag, der aktuelle Monat und das aktuelle Jahr eingesetzt werden. Speichere das Dokument unter dem Namen heuteist.php. 2. Spaß muss sein. Erzeuge eine Seite, die den Surfer an allen Werktagen normal begrüßt. Nur am Sonntag soll der Text ausgegeben werden: »Am Sonntag ist das Internet leider geschlossen«. Nenne das Dokument sunday.php. (Tipp: Nutze die Entscheidungsstruktur für diesen Zweck.) 3. Erstelle ein Dokument, welches das Datum in folgender freundlicher Schreibweise ausgibt: »Heute ist Mittwoch, der 11. Februar 2011«. (Gemeint ist das zum Zeitpunkt des Lesens aktuelle Datum!) Im Klartext: Sowohl der Wochentag als auch der Monatsname sollen in der deutschen Schreibweise ausgegeben werden. Der Dateiname soll tagmonat.php heißen.
135
5 Seiten mit Passwort schützen Webseiten so sicher wie die Bank von England? Solange es Hacker gibt, wird das wohl immer ein Traum bleiben. Doch etwas Sicherheit ist möglich: Erzeuge einen Passwortschutz, der zumindest von »Normalsterblichen« schwer zu knacken sein wird. Sorge dafür, dass bestimmte Informationen nur nach Eingabe eines Passwortes angezeigt werden. Schließlich stehen die Passwörter selber im PHP-Code, werden also dem Betrachter nicht angezeigt. Beste Gelegenheit, gleich ein paar weitere wichtige PHP-Techniken zu trainieren. Deshalb lernst du in diesem Kapitel: $ wie du Daten aus einem Formular mit post bzw. get verschickst $ wie du Daten aus Formularfeldern ausliest und verarbeitest $ wie du Bedingungen nicht nur mit if-else, sondern auch mit der sogenannten switch-Anweisung überprüfen kannst $ wie du Variablen auf Vorhandensein testest und Fehler vermeidest $ wie du externe Dateien mit include einbindest
137
Kapitel
5
Seiten mit Passwort schützen
Formular für das Passwort Auf los geht’s los! Erstelle eine Datei mit einem Passwortschutz. Wer das Passwort kennt, sieht die geheimen Inhalte. Wer nicht, hat einfach Pech gehabt. Doch wie fragen wir das Passwort ab? Ganz einfach, mit einem Formular! Für das nächste Kapitel empfehle ich gute HTML-Formularkenntnisse. Falls du hier noch Lücken hast, schlage einfach noch einmal im 1. Kapitel nach. Immerhin haben wir dort schon eine erste Formularseite erstellt.
Schreibe ein Formular Ich zeige dir Schritt für Schritt, wie das Beispiel aufgebaut wird. Mache einfach mit. Das Beispiel nennst du passwort.php. Hier siehst du die erste Version dieser Datei, ich präsentiere dir diesmal das komplette Dokument. Kennen Sie das Passwort? <meta http-equiv="content-type" content= "text/html; charset=utf-8">
Wie lautet das Passwort?
Zum Überprüfen: Du findest mein Beispiel in einem Unterordner namens version1.
138
Senden mit Methode: post oder get?
Die Seite erzeugt ein Formular mit einem Eingabefeld. Mehr nicht!
Zur Erinnerung: Das Formular wird durch geschlossen. Das Formular selber besteht aus folgenden Zeilen:
Schau dir die zweite Formularzeile an, denn hier entsteht das Texteingabefeld. Dafür sorgt die Anweisung . Ganz wichtig ist für unsere Zwecke der Name des Feldes. Dafür habe ich mir die Bezeichnung pass ausgedacht. (So kurz wie möglich!) Die Zuweisung erfolgt durch das Attribut-Werte-Paar name="pass". Das Formular selber wird durch Klick auf den Submit-Button abgeschickt. Damit hier die Aufschrift Senden prangt, verwende ich das Attribut-WertePaar value="Senden". Tja, und wenn du nun auf den Button SENDEN klickst? Dann passiert erst einmal überhaupt nichts! Oder passiert doch etwas?
Senden mit Methode: post oder get? Das, was mit einem Formular geschieht, wird direkt im einleitenden und über dem abschließenden noch Folgendes. " . $_POST["pass"] . "\n"; ?>
Die -Tags dienen einfach nur dazu, einen Block zu bilden. Du hättest sie auch weglassen können. Wenn du sie verwendest, musst du in diesem Fall wieder mit dem Verkettungsoperator Punkt (.) arbeiten.
Tatsache! Nach Klick auf Senden wird das Passwort angezeigt.
Damit ist der Beweis erbracht: Der Zugriff auf den in das Formularfeld pass eingegebenen Wert funktioniert! Zum Vergleich: Diese zweite Version des Dokuments findest du im Unterordner version2.
142
Du ärgerst dich, dass du assoziative Array-Variablen auf umständliche Art und Weise mit dem String verketten musst? Gewöhnliche Variablen dagegen nicht? Dann verrate ich dir einen Geheimtrick: Du musst den key bei assoziativen Variablen nicht unbedingt in Gänsefüßchen schreiben. Statt $_POST["pass"] kannst du unter bestimmten Bedingungen auch mit $_POST[pass] auf das Passwort zugreifen. Und zwar immer dann, wenn diese Variable selber zu einem Abschnitt gehört, der in Gänsefüßchen eingekleidet wurde.
Testen mit if-else
Dann kannst du das Passwort also statt auf diese Weise echo "
" . $_POST["pass"] . "
\n";
auch folgendermaßen ohne Verkettung ausgeben: echo "
$_POST[pass]
\n";
Das ist aber nur deshalb gestattet, weil die gesamte echo-Anweisung innerhalb von Gänsefüßchen notiert wurde. Außerhalb von Gänsefüßchen solltest du diese Schreibweise nicht verwenden!
Testen mit if-else Frisch ans Werk, nun kommt die Passwortabfrage. Wer das Passwort kennt, gelangt an die Inhalte heran. Wer nicht, wird über seine Unkenntnis informiert. Als Musterpasswort schlage ich die Zeichenfolge a?iX379 vor. Die Version 3 der Passwort-Abfrage arbeitet mit if-else. Damit sind wir zwar noch nicht am Ziel aller Wünsche angelangt, aber immerhin schon ein Stück weiter. Ich zeige dir diesmal den gesamten Teil zwischen :
Wie lautet das Passwort?
Geschützter Bereich
Hier stehen die geheimen Inhalte ...
Leider kennen Sie das Passwort nicht!
143
Kapitel
5
Seiten mit Passwort schützen Die für uns interessante Zeile steckt in: if ($_POST["pass"] == "a?iX379") {
Hier wird getestet, ob der aus dem Feld pass ausgelesene Inhalt mit der Zeichenfolge a?iX379 übereinstimmt. Nur dann zeigt das Skript den Bereich mit den geschützten Inhalten an. Ich arbeite dabei mit einer if-else-Entscheidungsstruktur. Im if-Bereich teste ich auf Übereinstimmung. Wenn dieser Ausdruck wahr ist, wird der »geschützte Bereich« angezeigt. Falls nicht, greift der else-Zweig. Es erscheint der Satz »Leider kennen Sie das Passwort nicht«! Ist dir etwas aufgefallen? In diesem Beispiel habe ich PHP- und HTMLAbschnitte miteinander vermischt. Die HTML-Abschnitte stehen zwar außerhalb der PHP-Bereiche. Zumindest scheinbar. Trotzdem befinden sie sich innerhalb eines »PHP-Klammer-Blockes« ({ }): Dafür arbeite ich einfach mit mehreren PHP-Abschnitten, die die HTML-Bereiche jeweils »umklammern«. Je nach Bedarf schalte ich den PHP-Bereich dafür ab und wieder ein. Wie du siehst, kannst du HTML-Abschnitte also ganz problemlos in PHP einbinden. Hauptsache, du markierst korrekt, wo ein PHPAbschnitt beginnt und wo er wieder aufhört. Hauptsache, du vergisst nicht eine der hier notwendigen geschweiften Klammern!
Schönheitsfehler? Variablentest mit isset()! Fällt dir an der dritten Version des Beispiels etwas auf? Richtig, es funktioniert! Herzlichen Glückwunsch. Nur wer das Passwort kennt, wird an die geschützten Inhalte herangelassen. Doch der Satz »Leider kennen Sie das Passwort nicht« wird auch dann eingeblendet, wenn die Seite zum allerersten Mal aufgerufen wird. Soviel Häme ist ungesund. Du musst dem Besucher ja nicht gleich am Anfang auf die Nase binden, dass du ihr oder ihm die Passwortkenntnis nicht zutraust.
144
Schönheitsfehler? Variablentest mit isset()!
Gleich beim Aufrufen der Seite wird dem Besucher Unkenntnis unterstellt.
Und tatsächlich befindet sich an dieser Stelle ein Schönheitsfehler. Der Satz sollte erst dann eingeblendet werden, nachdem der Formularinhalt abgeschickt wurde. Und nicht gleich am Anfang! Wie schaffst du das?
Prüfen, ob die Variable überhaupt vorhanden ist Du prüfst einfach, ob die Variable überhaupt definiert und damit vorhanden ist. Denn wenn das Formular noch nicht abgeschickt wurde, kann eine Variable namens $_POST["pass"] noch nicht existieren! Oder? Das Array $_POST wird schließlich erst nach dem Abschicken des Formularinhalts erzeugt. Nutze die Funktion isset(). Die Funktion isset() prüft, ob eine Variable überhaupt gesetzt ist. Erst dann gibt sie den Wert wahr (true) zurück. Bei Nichtvorhandensein wird als Testergebnis jedoch false zurückgegeben. Die Syntax dieser Funktion sieht folgendermaßen aus: isset($Variable). Du übergibst die zu testende Variable einfach in runden Klammern. Baue das Skript um, verbessere es: Aus dem else-Zweig machst du einfach ein elseif! Und hier testest du nun, ob die Passwort-Variable gesetzt ist. Verändere also folgende Zeile: else {
in elseif (isset($_POST["pass"])) {
und schon hast du das Problem (vorerst) gelöst. 145
Kapitel
5
Seiten mit Passwort schützen Die Wirkungsweise ist noch nicht ganz klar? Die Zeile liest sich wie folgt: Prüfe, ob die Variable $_POST["pass"] »gesetzt« ist. Wenn ja, gibt die Funktion isset() den Wert true zurück. Und if bzw. elseif testet schließlich auf Wahrheit. In diesem Fall (also nur bei gesetzter Variable) wird der Text »Leider kennen Sie das Passwort nicht« ausgegeben. Da die Variable beim ersten Aufruf der Seite jedoch noch nicht gesetzt ist, passiert gar nichts. Falls du vergleichen willst, schaust du dir das Beispiel im Ordner version4 an! Aufgepasst mit den vielen Klammern in der elseif-Zeile! Das Vergessen solch einer Klammer führt unweigerlich zu einer Fehlermeldung. Wo kommen die ganzen Klammern her? Die Bedingung für elseif wird in runden Klammern getestet. Die notierst du zuerst. Dann setzt du dort den isset()-Test hinein, der schließlich auch ein paar runde Klammern benötigt. Zum Schluss platzierst du innerhalb dieser runden Klammern die Variable, in unserem Fall $_POST["pass"]. Nach einem Leerzeichen folgt dann noch die geschweifte Klammer, die schließlich unseren Block einleitet. Mit dieser »vierten Version« der Passwortabfrage hast du ein wichtiges »Etappenziel« erreicht. Und da das Passwort im PHP-Bereich steht, wird es für Außenstehende auch nicht angezeigt.
Das Skript noch etwas sicherer machen In diesem Skript steckt ein kleines Problem. Es handelt sich um einen unsichtbaren Hinweis (Notice), den ich für dich hier sichtbar gemacht habe:
Das Skript produziert intern einen (normalerweise unsichtbaren) Hinweis.
Der Hinweis bezieht sich auf Zeile 15 und besagt, dass der Index pass nicht definiert wäre. Schau dir Zeile 15 noch einmal genau an: 146
if ($_POST["pass"] == "a?iX379") {
Mehr Möglichkeiten mit switch Und tatsächlich steht dort $_POST mit dem Index pass. Fakt ist: Der Hinweis erscheint nur beim allerersten Aufruf der Seite. Wenn der Nutzer also noch keinen Formularinhalt eingetragen und abgeschickt hat. Das ist logisch: Wenn noch kein Formularinhalt abgeschickt wurde, kann es auch keine Variable $_POST mit dem Index pass geben. Derartige Notices (Hinweise) sind zwar keine Fehler, sie gelten aber als schlechter Programmierstil und lassen sich vermeiden. Undefinierte Indizes oder undefinierte Variablen geben Hackern gewisse Chancen, in das Skript einzudringen und Variablenwerte zu manipulieren. (Auch wenn die Chancen in diesem Fall sicher recht klein sind.) Die Lösung ist in diesem Fall ganz einfach. Füge auch in das einleitende if von Zeile 15 die eben besprochene isset()-Variablenprüfung ein – und zwar zusätzlich als erster von zwei Teilausdrücken. Verknüpfe beide Teilausdrücke mit dem &&-Operator. if (isset($_POST["pass"]) && $_POST["pass"] == "a?iX379") {
Nun
wird
auch
hier
zuerst
das
Vorhandensein
der
Variablen
$_POST["pass"] überprüft. Erst bei einem Erfolg findet der zweite Test statt. Vergleiche mit dem Beispiel aus dem Ordner version5.
Wie du diese normalerweise unsichtbaren Hinweise einblendest, verrate ich dir übrigens im Nachfolgeband »PHP und MySQL Praxisbuch für Kids«.
Mehr Möglichkeiten mit switch Ich bin nie zufrieden! Ein einziges lumpiges Passwort abfragen? Das kann doch jeder! Als nächste Stufe schwebt mir eine Seite vor, die mehrere Passwörter entgegennimmt. Je nach Passwort soll der Betrachter andere Informationen angezeigt bekommen. Das ist sozusagen die »Hohe Schule der Passwortkunst«. Folgende Passwörter sollen möglich sein: 0 a?iX379 0 a?iX380 0 a?iX381 »Richtig«, denkst du dir vielleicht: Da arbeite ich mit if und mehreren elseif-Bereichen. Stimmt. Gute Idee. Der Ansatz ist vom Prinzip her völlig korrekt! Doch gerade für solche Fälle gibt es eine Alternative zur ständigen »Elseifferei«. Schau dir die switch-Fallunterscheidung an.
147
Kapitel
5
Seiten mit Passwort schützen
Die switch-Fallunterscheidung Du möchtest auf verschiedene Eingaben unterschiedlich reagieren? Dann bietet sich die switch-Fallunterscheidung an. Hier schlägst du gleich mehrere Fliegen mit einer Klappe. Die Syntax lautet: switch(Variable) { case Wert1: Anweisung; break; case Wert2: Anweisung; break; case Wert3: Anweisung; break; ... default: Anweisung; }
Sieht kompliziert aus? Es ist einfacher, als du vielleicht denkst: Die switch-Fallunterscheidung untersucht, ob eine Variable mit den aufgelisteten Werten übereinstimmt. Deshalb schreibst du in der ersten Zeile switch(Variable) {
Dabei ist das Wort Variable der Platzhalter für die zu prüfende Variable. (Für unsere Zwecke setzen wir an dieser Stelle nachher natürlich wieder $_POST["pass"] ein.) Beachte die öffnende geschweifte Klammer ({) am Schluss der Zeile, da switch() wieder einen Block benötigt. Die Übereinstimmung selber wird nun mit dem Schlüsselwort case getestet. Hinter dem Leerzeichen notierst du den Wert, mit dem die Variable evtl. übereinstimmen könnte. case Wert1: Wert1 ist hier natürlich der Platzhalter für die entsprechende Zahl bzw. Zeichenfolge. In unserem Fall würdest du als ersten Wert notieren a?iX379.
148
Beachte, dass am Ende der case-Zeile ein Doppelpunkt gesetzt werden muss. Gibt es eine Übereinstimmung? Dann wird die betreffende Anweisung nach dem Doppelpunkt ausgeführt. Die Programmabarbeitung muss
Mehr Möglichkeiten mit switch durch das Schlüsselwort break beendet werden. Das Wort break steht hier für Abbruch. Falls es keine Übereinstimmung gibt, wird in der nächsten case-Zeile weitergeprüft. Sollte in keiner der case-Zeilen eine Übereinstimmung erzielt worden sein, wird die unter default: stehende Anweisung ausgeführt. Soweit die Theorie. Nun zur Praxis!
Wir »switchen« los: Das praktische Beispiel Das praktische Beispiel nenne ich zur Unterscheidung switch.php. Achte also auf diesen neuen Dateinamen. Und hier die genaue Schrittfolge zur Erstellung des Quelltexts.
>
Zuerst übernimmst du das Formular aus dem allerersten PasswortBeispiel. Der einzige Unterschied: Beachte den bei action einzutragenden Wert. Da das neue Projekt unter dem Namen switch.php gesichert wird, musst du hier auch switch.php notieren!
>
Hier drucke ich ganz schnell zur Veranschaulichung noch einmal den gesamten HTML-Quellcode ab, der vorerst zwischen stehen muss. Die Überschrift kannst du natürlich frei wählen:
Drei Passworte abfragen
>
Ich zeige dir nun die Vorgehensweise, mit der ich meine Skripte erstelle. Und zwar beginne ich dabei stets »außen« und arbeite mich »nach innen« vor. Also, mach mit: Unter dem Formular fügst du zuerst einen PHP-Bereich ein. Dazwischen lässt du genug Platz zum Ergänzen der noch folgenden Codezeilen.
>
Nun notierst du innerhalb des PHP-Bereichs zuerst eine ifAnweisung, mit der du auf das Vorhandensein der Variable $_POST["pass"] testest. Nun sieht der gesamte PHP-Bereich folgendermaßen aus:
149
Kapitel
5
Seiten mit Passwort schützen
Was habe ich hier gemacht? Ich spanne die if-Abfrage praktisch um das gesamte Skript herum. Und zwar als eine Art Klammer. Im Klartext: Die in diesem untergeordneten Block enthaltenen Zeilen sollen nur dann ausgeführt werden, wenn die Variable gesetzt ist. Das schützt uns zum einen vor unsichtbaren Hinweisen. Zum anderen macht unsere noch folgende switch-Fallunterscheidung tatsächlich nur bei gesetzter Variable Sinn! Diese »alles umspannenden if-Abfragen« sind übrigens eine häufige Programmiertechnik. In den meisten Fällen wird dabei wie hier auf den else-Zweig verzichtet, da dieser nicht benötigt wird.
>
Das Prinzip ist klar? Gut! Innerhalb des if-Blocks notiere ich nun die switch()-Fallunterscheidung.
>
So sieht der gesamte PHP-Bereich aus. Die von mir hervorgehobenen ersten zwei und letzten zwei Zeilen sind die, die du eben aufgeschrieben hast. Der Rest ist neu hinzugekommen, er erzeugt die switch()Fallunterscheidung.
Passwort-Bereich 1"; break; case "a?iX380": echo "
Passwort-Bereich 2
"; break; case "a?iX381": echo "
Passwort-Bereich 3
"; break; default: echo "
Leider kennen Sie das Passwort nicht!
"; } } ?>
150
Inhalt mit include einbinden Zur Information: Aus Gründen der Übersichtlichkeit habe ich hier auf das Einbinden von HTML-Bereichen verzichtet. Eine Zeile wie echo "
Passwort-Bereich 3
";
steht als Platzhalter für den entsprechenden Passwortbereich.
Drei Passwörter stehen zur Auswahl.
Und, schon ausprobiert? Sehr gut! Wie du siehst, kannst du auch mit switch() eine Passwortabfrage erzeugen.
Inhalt mit include einbinden Apropos Platzhalter für den entsprechenden Passwortbereich. Wäre es nicht schöner, die betreffende Seite extern ablegen zu können? Damit du die »geheimen Infos« viel einfacher bearbeiten kannst? Wie gut, dass es include() gibt! Mit der Funktion include() kannst du externe Dateien einbinden und auswerten. Notiere in runden Klammern einfach den Dateinamen und evtl. den Pfad zur jeweiligen Datei, und zwar von Gänsefüßchen umhüllt. Wichtig zu wissen: Durch den Einsatz von include() wird die PHPNotation automatisch abgeschaltet. Die einzubindende Datei wird als normale HTML- bzw. Textdatei betrachtet. Um die Datei info1.html einzubinden, schreibst du z. B. include("info1.html").
>
Erstelle nun eine Datei für jeden Passwort-Bereich. Als Endung entscheidest du dich für die Endung .html. Die erste Datei nennst du im Beispiel info1.html.
Bereich für Passwort 1
Hier stehen die Infos für die Besitzer des 1. Passworts.
151
Kapitel
5
Seiten mit Passwort schützen
>
Erzeuge nach diesem Muster die zwei weiteren externen Dateien namens info2.html und info3.html. Achte darauf, dass du diese Dateien im Beispiel in den gleichen Ordner legst, in dem die switch.php liegt.
Und nun baust du die switch.php um. Der derart umgestaltete switch()-Block sieht folgendermaßen aus: switch($_POST["pass"]) { case "a?iX379": include("info1.html"); break; case "a?iX380": include("info2.html"); break; case "a?iX381": include("info3.html"); break; default: echo "
Leider kennen Sie das Passwort nicht!
"; }
Probiere es aus, es funktioniert. (Das Vergleichs-Beispiel auf CD heißt hier switch2.php.) Der Vorteil liegt auf der Hand: Es ist für dich nun viel einfacher, den Inhalt der Passwort-Bereiche zu bearbeiten und anzupassen. Merkst du etwas? Du kennst jetzt zwar die switch()-Fallunterscheidung an einem praktischen Beispiel. Doch mit dem Thema Sicherheit hat die bisherige Vorgehensweise nicht das geringste zu. Der Besucher braucht nur (durch Raten) den direkten Link zur Datei info1.html, info2.html bzw. info3.html zu kennen. Schon gelangt sie oder er an deine ach so geheimen Daten heran! Mehr Tipps zur Sicherheit folgen deshalb im nächsten Abschnitt.
Mehr Sicherheit: Endungs- und Ordnertricks Zurück zum Thema Sicherheit. So flexibel und angenehm die »includeMethode« zu sein scheint. Hier zeigen sich offenbar die Grenzen. Trotzdem 152
Mehr Sicherheit: Endungs- und Ordnertricks habe ich ein paar Ideen, wie du mehr Sicherheit erreichen kannst. Schau dir einfach meine Ideen an und mache dir deine eigenen Gedanken: 0 Verwende Dateinamen, die sich nicht so leicht raten lassen. Wie wäre es mit d_75uzRxei.html? 0 Verwende eine andere Dateiendung als .html. Der Funktion include() ist die Endung egal. Du kannst deine Dateien auch .txt, .inc oder sogar .exe nennen. 0 Es geht noch wilder: Verwende z. B. die Endung .gif, .zip oder .mid. Bei all diesen Endungen zeigen die meisten Browser die Datei nicht im Klartext an, da sie keine HTML-Datei erwarten. Gif-Grafiken werden als Bild erkannt. Dateien mit .zip am Ende will der Browser herunterladen, da er hier ein sogenanntes gepacktes ZIP-Archiv vermutet. Noch pfiffiger ist vielleicht die Endung .mid. Die meisten Browser bestehen darauf, eine derartige Datei abzuspielen, da sie an der Endung eine MidiKlangdatei zu erkennen glauben. 0 Nutze einen (oder mehrere) Unterordner für deine Dateien. Wie wäre es mit content007? Dass der Besucher zum einen den richtigen Ordnernamen für den Unterordner errät und zum anderen den korrekten Dateinamen, ist schon mehr als unwahrscheinlich.
Verstecke die Dateien im Unterordner und verpasse ihnen eine falsche Dateiendung.
Ich habe mich im ersten Beispiel für eine Kombination aus der letzten und der vorletzten Idee entschieden. Der Funktion include() ist die Dateiendung der einzubindenden Datei schließlich herzlich egal. Also benenne ich meine Textdateien einfach um.
153
Kapitel
5
Seiten mit Passwort schützen Vergleiche mit meiner Beispieldatei include.php. Die einzelnen Textdateien habe ich mit der Endung .mid versehen und in einem Unterordner namens content007 abgelegt. Tipp: Das Umbenennen einer Datei gelingt im Windows-Explorer. Rechtsklicke auf die Datei, wähle den Befehl UMBENENNEN. Lege die neue Endung fest. Schon wieder wirst du nur mit einem Teil der Wahrheit abgespeist. Ich fürchte, dass an dieser Stelle wohl wieder etwas handfestes HundeKnow-how gefragt ist! Es gibt eine weit sicherere Lösung, als dir der Buchautor glauben machen möchte. Zugegeben, nicht bei allen Dienstleistern klappt es. Jedoch bei vielen kostenpflichtigen Anbietern wie z. B. bei www.all-inkl.com. Wie lautet der Trick? Lege die zu schützenden Dateien zuerst in einem separaten Unterordner ab, wie hier schon gezeigt. Diesen Unterordner schützt du nun mit dem Konfigurationstool deines Dienstleisters! (Dahinter verbirgt sich eine als htaccess bezeichnete Technik.) Ein Beispiel? Gut! Ich habe für dich einen Ordner namens safe eingerichtet. Dort liegt eine derartige .htaccess-Datei. Sie schützt diesen Ordner vor dem Zugriff von außen. Im safe-Ordner kannst du also ohne Reue HTML-Dateien wie info1.html, info2.html oder info3.html ablegen – sie sind von außen nicht sichtbar. Vergleiche mit meiner Lösung include2.php. Probiere aus, ob es auch bei deinem Hoster funktioniert. Und noch einen Trick habe ich herausgefunden. Du kannst die zu schützenden Dateien auch in einen anderen sicheren Ordner legen. Ich meine einen Ordner, der beim Dienstleister »von Hause aus« geschützt ist. So ist bei www.all-inkl.com der Ordner cgi-bin von außen nicht erreichbar – und das ganz ohne schützende .htaccess-Datei. Er ist für Skripte vorbehalten. Wenn du jedoch hier Dateien ablegst und diese per include() einbindest, werden die Dateien auch aus diesem Ordner herausgeholt.
Schlussbemerkung In diesem Kapitel hast du nicht nur viel zum Thema Passwortschutz gelernt. Du hast bei dieser Gelegenheit auch erfahren, wie Formulare abgeschickt und ausgewertet werden. Mit der switch()-Fallunterscheidung kennst du eine weitere wichtige Methode, Eingaben auf Übereinstimmung zu überprüfen. Außerdem weißt du nun, wie du externe Dateien per include() einbinden kannst. 154
Zusammenfassung
Zusammenfassung 0 Du weißt, wie Formulare ausgewertet werden. Notiere im Das Ergebnis lautet $c\n"; ?>
Der PHP-Teil besteht lediglich aus zwei Zeilen, die sich sofort erschließen. Mit $_POST['a'] ermittelst du den Wert aus Feld a, mit $_POST['b'] dagegen die Zahl aus Feld b. Die Differenz wird berechnet, in der Variablen $c gespeichert und in der zweiten PHP-Zeile ausgegeben.
160
Einnahmen minus Ausgaben: Taschengeldrechner
Du möchtest Bruchzahlen notieren, z. B. 12,5? Dann beachte, dass Dezimalbrüche in PHP (und in anderen Programmiersprachen) nicht mit dem Komma getrennt werden. Im angelsächsischen Raum wird dafür der Punkt verwendet, denn die Amis oder Engländer kennen unsere Bedeutung für das Komma nicht: Schreibe Kommazahlen also stets mit Punkt statt Komma! Für 12,5 musst du also notieren: 12.5!
Dezimalbruch auf Angelsächsisch: Trenne mit Punkt statt mit Komma!
Ist es dir schon aufgefallen? In diesem Kapitel verwendet der Autor die Schreibweise $_POST['a'] und nicht $_POST["a"]. Warum die einfachen statt der doppelten Gänsefüßchen? Gibt es da einen Unterschied? Nein, den gibt es nicht. Es ist in unserem Fall völlig egal, ob du die einfachen oder die doppelten Gänsefüßchen verwendest. Das Thema spielt erst dann eine Rolle, wenn du Gänsefüßchen ineinander verschachtelst. Denn gleichrangige Gänsefüßchenpaare dürfen nicht ineinander verschachtelt werden. Nimm die Schreibweise, die dir am besten behagt. In der Praxis wirst du mal diese, mal jene Schreibweise vorfinden und der Autor dieses Buches will dich wahrscheinlich nur an diese Praxis gewöhnen.
Kein Ergebnis anzeigen beim ersten Aufruf So simpel können wir das Skript nicht stehen lassen. Denn selbst beim ersten Aufruf der Seite erscheint nun der Text Das Ergebnis lautet 0. Wozu haben wir im vorigen Kapitel lang und breit die if-Abfrage besprochen? Prüfe, ob die beiden Variablen gesetzt sind. Beim ersten Aufruf der Seite wird das noch nicht der Fall sein. Der Inhalt der Formularfelder wird schließlich erst dann verschickt, wenn du auf die Schaltfläche BERECHNEN klickst. Verbinde diese Abfrage durch den &&-Operator (AND). Erst wenn beide Bedingungen wahr sind, soll das Ergebnis eingeblendet werden. 161
Kapitel
6
Etwas Mathe: Taschen(geld)rechner Hier siehst du den PHP-Teil mit dieser zusätzlichen if-Klammer: Das Ergebnis lautet $c\n"; } ?>
Besser testen: Die Funktion empty() Zeit, dass ich mich mal wieder melde, dein Hund Buffi! Offenbar teilt dir der Autor nur die »halbe Wahrheit« mit und speist dich mit der Funktion isset() ab. Was passiert, wenn du nichts in die Felder einträgst und trotzdem auf die Schaltfläche BERECHNEN klickst? Das Skript berechnet das Ergebnis 0. Warum? Leer gelassene Felder werden als Leerstring interpretiert, was in diesem Fall gleichbedeutend ist mit der Ziffer Null. Nimm statt isset() doch einfach die Funktion empty()! Mit empty() erreichst du fast das Gegenteil von isset(). Zur Wiederholung: Die Funktion isset() prüft, ob eine Variable gesetzt ist und gibt nur dann true zurück. Sonst liefert isset() jedoch den Wert false. Das ist bekannt. Mit der neuen Funktion empty() dagegen kannst du herausfinden, ob eine Variable nicht gesetzt ist, ob sie leer ist oder ob sie dem Wert 0 entspricht. In allen diesen drei Fällen liefert die Funktion true zurück, sonst ist der Wert von empty() false. Du schlägst also gleich drei Fliegen mit einer Klappe! Weil empty() ebenfalls einen Wahrheitswert zurückgibt, eignet sich die Funktion genau wie isset() so wunderbar für den Einsatz in ifStrukturen. Der Test lautet dann wie folgt: empty($Variable). Einen Haken gibt es noch an der Geschichte. Mit isset() ermittelst du, ob eine Variable gesetzt ist, nur dann gibt die Funktion true zurück. Mit empty() hingegen erhältst du true, wenn die Variable eben nicht gesetzt (oder leer oder 0) ist. Hmm. Eigentlich wollten wir es ja umgedreht haben. Doch hier greift ein neuer Trick! Stelle der Funktion ein Ausrufezeichen voran! Mit diesem Ausrufezeichen verkehrst du die Funktion in ihr Gegenteil, dieses Ausrufezeichen ist eine Art »Umkehroperator«. Schreibe also !empty($Variable). 162
Einnahmen minus Ausgaben: Taschengeldrechner
Und so sieht das Beispiel aus, wenn du statt isset() mit empty() arbeitest: Das Ergebnis lautet $c\n"; } ?>
Bei leer gelassenem Feld erfolgt keine Berechnung.
Zum Vergleich: Die derart verbesserte Version findest du unter dem Namen rechner_hund.php auf der CD. Probiere sie aus!
Noch besser testen: Funktion is_numeric() Der Hund Buffi aus der Randspalte wird in letzter Zeit ein wenig vorlaut! Die Funktion empty() ist keine schlechte Idee, das gebe ich zu. Und die Überlegungen aus seinem Tipp sind schon sehr wichtig. Trotzdem sollten wir an dieser Stelle weiterdenken. Denn !empty() unterdrückt auch die Eingabe einer 0 in eines dieser Formularfelder. Zugegeben, in den meisten Fällen macht die Eingabe von Nullen nicht viel Sinn. Aber wenn du außer der Reihe doch mal eine 0 brauchst? Wer den Trick kennt, tippt einfach 0.0 oder 0. in das Formularfeld ein. Das geht. Besser wäre es, wenn du gleich die Funktion is_numeric() verwenden würdest. Sie prüft, ob ein Wert eine Zahl ist. Nur dann gibt sie true zurück, ansonsten false! Das ist doch viel eleganter, findest du nicht? Und so sieht das Beispiel aus, wenn du statt !empty() mit is_numeric() arbeitest. (Dabei prüfe ich zuerst aus Sicherheitsgründen mit isset(), ob die Variable überhaupt existiert. Erst dann teste ich, ob sie einem Zahlwert entspricht. So vermeide ich Fehlermeldungen.)
163
Kapitel
6
Etwas Mathe: Taschen(geld)rechner
Das Ergebnis lautet $c\n"; } ?>
Ein weiterer Vorteil: Fehleingaben wie Buchstaben oder Leerzeichen werden auf diese Weise von vornherein ignoriert. Das Beispiel findest du unter dem Namen rechner_autor.php auf der CD zum Buch!
$_SERVER['PHP_SELF']: Daten an sich selbst schicken Wirf doch einmal einen kritischen Kontrollblick auf das Formular. Auf die erste Zeile deines Formulars. Die Aktion interessiert uns. Bisher haben wir hier den Dateinamen notiert:
171
Kapitel
Etwas Mathe: Taschen(geld)rechner
6
case "-": $c = $_POST['a'] - $_POST['b']; break; case "*": $c = $_POST['a'] * $_POST['b']; break; case "/": $c = $_POST['a'] / $_POST['b']; break; } echo "
Das Ergebnis lautet $c
\n"; } ?>
So liest du ein SELECT-Feld aus Das Herzstück des Skriptes ist das neue Feld SELECT wie Auswählen. Dieses Feld wird von <select> eingehüllt. Die einzelnen Tags bilden die verschiedenen Optionen. Also die Auswahlmöglichkeiten, die in der Liste herunterklappen. In diesem Fall handelt es sich um die vier Grundrechenoperatoren.
Das Auswahlfeld Fertig ist das wunderbare Auswahlfeld, unsere praktische Klappliste. <select name="rz">
Außerdem gebe ich dem Feld im einleitenden Tag <select> noch einen Namen mit auf dem Weg. Ich nenne das Feld rz (wie Rechenzeichen). Je nach Auswahl schickt das Feld den entsprechenden Value zurück, also entweder den String +, -, * oder /. So einfach ist das. Auch nicht weiter kompliziert ist die Auswertung im PHP-Teil! Hier arbeite ich mit der aus dem vorigen Kapitel bekannten switch-Anweisung. Erin172
So liest du ein SELECT-Feld aus nerst du dich? Eine Variable wird auf das Vorhandensein eines Wertes geprüft, hier die Variable $_POST['rz']: switch($_POST['rz']) {
Bei Übereinstimmung mit einem bestimmten Wert wird die jeweilige Rechenoperation ausgeführt, z. B. die Addition. case "+": $c = $_POST['a'] + $_POST['b'];
Die Ausführung wird dann durch das Schlüsselwort break abgebrochen. break;
So funktioniert es auch bei den anderen drei Fällen, zumindest sinngemäß. In diesem Fall kannst du auf den default-Zweig verzichten, da die Variable $_POST['rz'] sowieso nur einen der vier Werte annehmen kann. Zum Vergleichen: Du findest das Beispiel auch in der Datei select1.php.
Werte in Formularfeldern speichern So schön unser Rechner bisher funktioniert: Eine Sache ist recht ärgerlich. Nach Klick auf BERECHNEN wird zwar das Ergebnis angezeigt. Doch die Werte sind längst aus den Eingabefeldern verschwunden. Kein Problem, speichere die Werte einfach dauerhaft in den Formularfeldern. Wie? Mit einem kleinen Trick. Baue die beiden Zahlen-Eingabefelder im Formular einfach um. Schreibe statt
Zahl 1:
einfach folgende aufgebohrte Zeile:
Zahl 1:
Ändere auch die zweite input-Zeile von Zahl 2:
in
173
Kapitel
6
Etwas Mathe: Taschen(geld)rechner
Zahl 2:
Der Trick ist schnell erklärt: Du notierst einfach zusätzlich das Attribut value in den beiden -Formularfeldern. Damit lässt sich ein Wert schon vorher in das Formular eintragen. Den Wert schreibst du jedoch nicht fest, sondern dynamisch in das Feld, und zwar über einen kurzen PHPAbschnitt. Notiere also die Anweisung . Prüfe innerhalb des PHP-Bereichs zuerst, ob $_POST['a'] bzw. $_POST['b'] existieren. Dann gibst du die Werte aus mit echo $_POST['a'] bzw. echo $_POST['b']. Du findest das Skript unter dem Namen select2.php auf der CD zum Buch.
Rechner de luxe: Wir schreiben eine Funktion An dieser Stelle folgt nun die große Herausforderung von Kapitel 6. Sozusagen der Höhepunkt. Bist du bereit? Stelle deinen Gehirnkasten auf Empfang, denn du schreibst eine eigene Funktion! Eine Funktion für das Rechenskript! Zugegeben, an der Funktionalität des kleinen Taschenrechner-Programms wird sich dabei nichts ändern. Zumindest nicht nach außen. Aber du bist nach dieser Aktion um einige wichtige Kenntnisse reicher. Und das sollte doch die Mühe allemal wert sein, oder?
Was ist eine Funktion? Eine Funktion ist eigentlich nichts weiter, als eine Sammlung von Programmzeilen. Es ist ein Programmabschnitt, der etwas für dich tut. Ein Programmbereich mit einem speziellen Namen. Man kann eine Funktion aufrufen, übergibt ihr ein paar Argumente und bekommt das verarbeitete Ergebnis zurück. Klingt zu kompliziert? 174
Rechner de luxe: Wir schreiben eine Funktion Denke einfach an die vordefinierten Funktionen. Es gibt hunderte davon in PHP. Einige kennst du schon, andere bringe ich dir im Verlauf des Buches noch bei. Die Funktion isset($variable) z. B. prüft eine Variable auf Existenz. Sie gibt je nach Sachstand den Wahrheitswert true oder false zurück. Die übergebene Variable (der Prüfling) wird hierbei auch als Argument bezeichnet. Eine Funktion kann auch mehrere Argumente besitzen. Erinnerst du dich an die Funktion sprintf(), die wir eben besprochen haben? Nimm die Zeile: $c = sprintf("%01.2f", $c);
Die Funktion besitzt gleich zwei Argumente, die durch ein Komma getrennt werden. Das erste Argument steckt in der Formatieranweisung. Das zweite Argument ist der Wert, der formatiert wird. Im Beispiel gibt die Funktion den formatierten Wert zurück, der hier erneut in der Variablen $c gespeichert wird. Halten wir fest: Eine Funktion besitzt ein paar runde Klammern, die sich ohne Leerzeichen nahtlos an den Funktionsnamen anschließen. Innerhalb der runden Klammern werden die sogenannten Argumente übergeben. Mehrere Argumente trennt man durch ein Komma voneinander. Eine Funktion gibt in der Regel etwas zurück, das kann ein String, eine Zahl oder ein Wahrheitswert sein. Keine Bange: Ob du nach einem Komma hinter einem Argument ein Leerzeichen lässt oder nicht, bleibt dir überlassen. Ein Leerzeichen erhöht die Übersicht, muss aber nicht unbedingt sein. In der Praxis findest du stets beide Varianten vor.
Funktionen selber schreiben Ich hatte vorhin behauptet, dass eine Funktion eine Sammlung von Programmzeilen ist. Eine Art Programm-Modul also, was auf Abruf zur Verfügung steht. Wo stecken denn diese Programmzeilen? Bei den vordefinierten Funktionen ist die Antwort ganz einfach: Sie sind in PHP fest eingebaut, du bekommst sie nicht zu Gesicht. Vordefinierte Funktionen arbeiten wie ein schwarzer Kasten, in den man etwas hineintut und etwas anderes zurückbekommt. Ganz anders sieht die Sache aus, wenn du eine Funktion selber schreibst. Dann kannst du bestimmen, was in der Funktion passiert, denn du »baust den Funktions-Kasten selber zusammen«. Doch warum solltest du das überhaupt tun?
175
Kapitel
6
Etwas Mathe: Taschen(geld)rechner 0 Funktionen sind ideal, wenn du eine bestimmte Funktionalität in PHP vermisst, aber häufig benötigst. 0 Funktionen sind dann sinnvoll, wenn du eine dieser Aktionen immer wieder durchführen willst. Im Klartext: Funktionen sind etwas für Faule, die sich ihre Codezeilen gerne aufbewahren. Und natürlich etwas für Pfiffige, die damit in manchen Fällen viel Schreibarbeit sparen.
Grundsyntax einer Funktion Wenden wir uns von der Theorie nun der Praxis zu: Die Grundsyntax einer Funktion sieht folgendermaßen aus, beachte das einleitende Schlüsselwort function vor dem Funktionsnamen: function Funktionsname(Argument[, Argument]) { Codezeile(n); return $variablenwert; }
Zusammengehalten wird der Funktions-Block wieder durch geschweifte Klammern – diesmal bekommt die einleitende Klammer eine eigene Zeile! Wie schon bei Variablennamen gilt auch bei Funktionsnamen: Groß- und Kleinschreibung werden unterschieden. Leerzeichen, Umlaute und die meisten Sonderzeichen sind tabu. Beginne einen Funktionsnamen nie mit einer Zahl. Der Unterstrich (_) jedoch ist erlaubt. Nehmen wir einmal an, du benötigst eine Funktion, die bei einem Produktpreis aus dem Nettowert den Bruttowert berechnet. So eine Funktion gibt es nicht in PHP. Der Nettowert ist der Preis des Produktes ohne die sogenannte Mehrwertsteuer. (Hinter der Mehrwertsteuer verbirgt sich eine Abgabe, die in Deutschland auf fast jedes Produkt aufgeschlagen wird und die du damit automatisch mit bezahlst.) Diese Mehrwertsteuer beträgt 19%. Die Berechnung selber ist simpel: Du brauchst nur den Nettowert mit 1.19 zu multiplizieren. Das ist schon alles. Ich nenne die Funktion nettoinbrutto(), weil sie den Nettowert in einen Bruttowert umwandelt. Erstelle eine neue PHP-Seite und mache mit! Die Funktion besitzt nur ein einziges Argument: 176
Der Rechner im Einsatz function nettoinbrutto($wert) { $wert = $wert * 1.19; return $wert; }
Die Funktion nimmt das Argument entgegen, multipliziert es mit 1.19 und gibt diesen Wert zurück. Innerhalb der Funktion wird dafür die Variable $wert verwendet. Variablen, die du in der Funktion deklarierst, haben normalerweise auch nur innerhalb dieser Funktion Gültigkeit. Die Variable $wert ist im übrigen Skript nicht sichtbar. Auch umgedreht gilt diese Regel. Die Funktion kann nur auf die Werte zurückgreifen, die du ihr als Argument übergibst. Überprüfe, ob die Funktion »funktioniert«. Ergänze unterhalb der Funktion noch folgende Zeilen: $zahl = 100; $zahl = nettoinbrutto($zahl); echo $zahl;
Herauskommen muss 119. (Die Mehrwertsteuer beträgt in diesem Fall also 19, da 19% von 100 19 sind.) Und, klappt es? Statt dieser drei Zeilen kannst du auch schreiben: echo nettoinbrutto(100);
Das Beispiel findest du in der Datei mwst.php.
Der Rechner im Einsatz Soweit zu den Vorbemerkungen. Zurück zu unserem Rechner, zur Datei select1.php oder vielmehr der verbesserten Variante select2.php. Speichere das Dokument ruhig unter einem anderen Namen, ich schlage nun function.php vor. Nach diesen Vorübungen können wir uns endlich an die große Funktion wagen. Es geht um die Funktion zum Berechnen! Unsere Funktion selber nenne ich berechne() und übergebe ihr gleich drei Argumente. Es sind die erste Zahl, die zweite Zahl und der entsprechende Rechenoperator.
177
Kapitel
6
Etwas Mathe: Taschen(geld)rechner Und nun zeige ich dir, wie ich den PHP-Teil aufgebaut habe. Dank der neuen Funktion konnte ich hier erst einmal radikal ausmisten: Das Ergebnis lautet $c\n"; } ?>
Übrig geblieben sind neben der if-Abfrage und der echo-Zeile für das Ergebnis nur noch zwei weitere Zeilen. Das nennt man klar und übersichtlich, findest du nicht? Das Berechnen wird von der neuen Funktion übernommen. Die ganzen langen switch-Zeilen und all das »Programmgestrüpp« verschwindet damit in der »Funktionskiste«. Doch ehe wir uns die »Kiste« anschauen, betrachten wir den Funktionsaufruf. Der Funktionsaufruf erfolgt in der Zeile: $c = berechne($_POST['a'], $_POST['b'], $_POST['rz']);
Die Funktion nimmt die drei Argumente entgegen, berechnet das Ergebnis und gibt dieses zurück. Das Skript speichert das Ergebnis in der Variablen $c und gibt den Inhalt mit echo() aus. Doch was ist mit der Funktion selber? Wo steckt die? Hier verwendet der Autor die »Modulbauweise«. Die Codezeilen für die Funktion selber hat er in einer separaten externen Datei abgelegt. Die Datei wird dabei oberhalb des Funktionsaufrufes eingebunden. Das sollte man tun, damit die Funktion noch vor dem Aufruf eingelesen werden kann. So steht sie praktisch schon »auf Abruf bereit«. Für das Einbinden dieser externen Datei dient die im vorigen Kapitel besprochene include()-Anweisung. include("function_modul.inc.php");
Diese externe Datei heißt function_modul.inc.php und liegt im Beispiel im gleichen Ordner. Warum diese Doppelendung, warum nicht einfach function.txt? Die Endung .php ist ideal, weil dadurch der Code nicht sichtbar ist. Denn PHP-Dateien werden vom Webserver nicht im Klartext angezeigt. Die davor platzierte Endung .inc steht für include, einfügen. So weißt du also, dass es eine externe Include-Datei ist, die du an dieser Stelle einfügst. 178
Der Rechner im Einsatz
Quellcode der Datei function_modul.inc.php Nun zur Funktionskiste selber. Schau dir dafür den Quellcode der externen Datei mit dem gewichtigen Namen function_modul.inc.php an. (Den Namen function_modul habe ich so gewählt, dass er möglichst selbsterklärend ist.) Gibt es da Besonderheiten? Da die Datei als PHP-Datei deklariert wurde, muss sie zum einen auch von eingehüllt werden. Nur so kann der Quellcode nicht von jedermann eingesehen werden, wenn die Seite zufällig direkt aufgerufen wird. Außerdem habe ich am Anfang ein paar Kommentarzeilen eingefügt, damit ich später noch verstehe, was die Funktion überhaupt macht.
Programmtechnisch jedoch bietet die Funktion nichts Neues. Es ist genau die gleiche switch-Anweisung, die ich schon für die erste Version dieses Rechners verwendet habe. Nur für die Variablen habe ich mir neue Namen ausgedacht, aber diese existieren sowieso nur innerhalb der Funktion. 179
Kapitel
6
Etwas Mathe: Taschen(geld)rechner Wichtig sind weiterhin die geschweiften Klammern, die den Funktionsblock bilden. Außerdem muss das Ergebnis der Funktion mit return $ergebnis zurückgegeben werden. Denn unsere Funktion braucht schließlich einen Rückgabewert. Blickst du da auf Anhieb durch? Herzlichen Glückwunsch! Dann hast du schon ein wichtiges Stück fortgeschrittener PHP-Programmierung verstanden. Wenn nicht, ist es auch nicht so schlimm. Du kannst fast alle Programme auch ohne Funktion schreiben. Im Fortgeschrittenen-Band »PHP und MySQL Praxisbuch für Kids« gehe ich näher auf Funktionen ein und mache dich auch mit den Details zur Klammersetzung vertraut.
Schlussbemerkung In diesem Kapitel haben wir uns mit Mathematik beschäftigt. War es schwer? Ich hoffe nicht, zumindest nicht am Anfang. Du kennst die Grundlagen für das Rechnen mit PHP und hast dich sogar an die Prozentrechnung gewagt. Du kannst Diagramme zeichnen und Auswahlfelder erstellen. Das Beste: Du hast in das Thema PHP für Fortgeschrittene hereingeschnuppert und weißt sogar schon, wie man eigene Funktionen zusammenbaut. Für das sechste Kapitel ist das schon nicht schlecht, oder?
Zusammenfassung 0 Du kennst die vier Grundrechenarten und die entsprechenden Operatoren +, -, * und /. 0 Du kennst die Operatoren zum Inkrementieren (um 1 erhöhen) und Dekrementieren (um 1 erniedrigen), sie lauten ++ und --. 0 Du kennst die Funktion empty(). Damit kannst du testen, ob eine Variable nicht gesetzt ist, ob sie leer ist oder ob sie dem Wert 0 entspricht. 0 Du kennst die Funktion is_numeric(). Sie testet, ob eine Variable eine Zahl ist und gibt dann true zurück.
180
0 Du kennst die Server-Variable $_SERVER['PHP_SELF'], die den Pfad und Dateinamen der aktuellen Datei ausgibt. Du weißt jedoch, dass sie ein Sicherheitsrisiko darstellt und sparsam eingesetzt werden sollte.
Ein paar Fragen … 0 Du hast dich mit Prozentrechnung beschäftigt und weißt, wie du mit unsichtbaren Tabellen ein Säulendiagramm zeichnen kannst. 0 Du kennst die Funktionen round() und sprintf() zum Runden bzw. Formatieren von Zahlen. 0 Du kennst das Konzept der Funktionen, der »Speicherkästen« für eine Abfolge von Befehlen. Neben den vielen in PHP eingebauten Funktionen weißt du nun auch, wie man eigene Funktionen schreibt.
Ein paar Fragen … 1. Wie sieht der Rechenoperator aus für Geteilt durch? 2. Mit welcher Funktion kannst du Zahlen so formatieren, dass stets eine bestimmte, aber von dir frei wählbare Zahl von Nachkommastellen angezeigt wird? 3. Welche Doppelendung vergibt man gerne an ausgelagerte IncludeDateien und warum? 4. Wie schreibt man Eineinhalb als Dezimalbruch in PHP? Warum verwendet man das von dir gewählte Trennzeichen?
… und ein paar Aufgaben 1. Der Taschenrechner (Datei function.php) hat noch einen Haken. Wähle doch einmal die Division und trage ins Feld 2 eine 0 ein! Eine Fehlermeldung ist die Folge. Klar, denn eine Division durch 0 ist nicht definiert! Deine Aufgabe: Sorge dafür, dass die Rechnung zumindest dann nicht durchgeführt wird, wenn der Nutzer in Feld 2 eine 0 eingibt. Speichere das Dokument unter dem Namen taschenrechner.php. 2. Verändere das Diagramm-Skript (diagramm.php) so, dass die Säulen doppelt so lang sind wie in der bisherigen Variante. 3. Sorge außerdem dafür, dass der Inhalt der Formularfelder für die Eingabe der Zahlen nach dem Abschicken nicht gelöscht wird. 4. Berechne die Versandkosten für ein Produkt. Nutze dafür eine Seite, die du versand.php nennst. Das zu bestellende Produkt soll 20 Euro kosten. Erzeuge auf dieser Bestellseite also ein Formularfeld, in das der Nutzer die Produktanzahl eintragen kann. Liegt der Bestellwert unter 100 Euro, sollen die Versandkosten 10 Euro betragen. Liegt der Wert jedoch höher, fallen die Versandkosten auf 5 Euro. Gib den entsprechen-
181
Kapitel
6
Etwas Mathe: Taschen(geld)rechner den Gesamtpreis in Abhängigkeit von der eingetragenen Bestellmenge aus. (Wie du die Seite optisch aufbaust, bleibt dir überlassen.) 5. Öffne das Dokument mwst.php. Notiere hier eine zweite Funktion, die diesmal den Nettowert aus dem Bruttowert berechnet. Dazu erkundige dich, wie hoch die Mehrwertsteuer zur Zeit in Deutschland ist. Beachte, dass der Bruttowert bei 19 Prozent mit 119% angesetzt werden muss, wobei der Nettowert dann 100% beträgt. Bekommst du das hin mit dem Dreisatz?
182
7 Schleifen: Die »Gratulationsmaschine« Wenn mich einer fragt: »Was ist das Wichtigste beim Programmieren?« Dann antworte ich ohne zu zögern: Die Schleife. Denn erst mit Schleifen sorgst du dafür, dass Befehle immer und immer wiederholt werden können. Wie meistens gibt es auch diesmal einen Haken an der Geschichte. Schleifen gehören zu den nicht ganz einfach zu durchschauenden Elementen. Aus diesem Grund nähern wir uns dem Thema sanft und vorsichtig. Beispiele, Abbildungen und Diagramme sollen dir das Verständnis erleichtern. Du lernst in diesem Kapitel, wie du $ eine while-Schleife erstellst $ die do-while-Schleife nutzt $ eine for-Schleife erzeugst $ mit foreach alle Elemente eines Arrays durchläufst Und wenn du nach dem Lesen feststellst: »Schleifen, Mann: Das ist doch cool und easy!« – dann hat das Kapitel seinen Zweck erfüllt.
183
Kapitel
7
Schleifen: Die »Gratulationsmaschine«
Die while-Schleife Wir fangen ganz gemütlich mit der while-Schleife an, werfen einen Blick auf do-while und landen dann bei for und foreach. Doch halt, was sind Schleifen überhaupt? Schleifen dienen dazu, eine Anweisung in Abhängigkeit von einer oder mehreren Bedingungen wiederholt ausführen zu können. Alles unklar? Kein Problem, das ging mir am Anfang auch so! Das Schlüsselwort lautet Wiederholung. Repetitio est mater studiorum, sagte mein alter Lateinlehrer immer. Frei übersetzt heißt das: Wiederholung ist die Mutter der Porzellankiste. (Zugegeben, das ist etwas zu frei übersetzt, aber auch Latein hat nie zu meinen Stärken gezählt.) Zurück zu den Schleifen. Ein Beispiel muss her! Was wiederholt sich in deinem Leben? Der Tag deiner Geburt! Wie alt bist du? 6, 14 oder gar 42 wie der Schreiber dieser Zeilen? Programmiere doch einmal eine Schleife, die den Satz wiederholt: Happy Birthday! Und zwar so oft, wie es deinem Alter entspricht.
Der Quelltext für die Schleife Zuerst zeige ich dir den gesamten Quelltext zwischen den Tags . Du kannst das Dokument abschreiben und unter dem Namen while.php speichern.
Die while-Schleife
\n"; $i++; }
184
Die while-Schleife echo "Schleife wurde verlassen.\n"; } ?>
Probiere es aus. Funktioniert das mit der Wiederholung?
Du gibst eine 6 ein? Dann schreibt das Skript sechsmal Happy Birthday!
Einiges kommt dir sicher schon bekannt vor. Du erzeugst ein Formular zur Eingabe des Alters. Nach Absenden wird der Inhalt des Feldes anzahl abgeschickt und an den PHP-Teil übergeben. Dort kommt wieder unser bewährter Test zum Einsatz, der prüft, ob die Variable existiert und nicht etwa leer ist bzw. 0 entspricht. So weit, so bekannt. Doch was passiert innerhalb der Schleife, die eigentlich nur aus folgenden Zeilen besteht? while ($i <= $_POST['anzahl']) { echo "Happy Birthday! \n"; $i++;
Hier wird die Wiederholung festgelegt, und zwar in Abhängigkeit von der eingegebenen Zahl! Was da genau abgeht, klären wir gleich.
Die Grundsyntax der while-Schleife Schaue dir zuerst die Grundsyntax der while-Schleife an. while (Bedingung) { Befehlszeilen immer wieder ausführen, solange Bedingung wahr ist; } Fortsetzung, wenn Bedingung falsch;
185
Kapitel
7
Schleifen: Die »Gratulationsmaschine« Was fällt dir auf? Richtig: Auch hier dient wieder ein geschweiftes Klammernpaar zum Zusammenhalten des Schleifenblocks. Die erste Zeile bildet den Schleifenkopf. Hier wird die Bedingung geprüft. Zumindest die Struktur ist nicht neu, die kennst du ja schon von den if-Abfragen. (Wenn nicht, blättere ganz fix zwei Kapitel zurück!) Doch im Gegensatz zu if werden die Anweisungen innerhalb des Blocks stets wiederholt. Und zwar so lange, bis die Bedingung endlich einmal falsch geworden ist. Daraus folgt 0 Schleifen brauchen eine sinnvolle Bedingung, die sich auf Wahrheit prüfen lässt. 0 Du musst darauf achten, dass die Bedingung irgendwann wieder falsch wird. Bist du ein optischer Typ? Dann kannst du versuchen, dir die Wirkungsweise von while anhand dieses Diagramms zu veranschaulichen:
Nur wenn die Bedingung wahr ist, werden die Befehle der Schleife ausgeführt.
Beachte, dass die Befehle innerhalb der Schleife stets wiederholt werden. Das ist schließlich der Sinn der Sache. Sie werden so lange wiederholt, bis die Bedingung falsch ist.
Das Beispiel in der Diskussion Und nun zu unserer Beispiel-Schleife. Schau dir zuerst die Zeilen an, die im weiteren Sinne zu unserer »Geburtstags-Schleife« zählen. Auch wenn sie nicht innerhalb des Schleifen-Blocks notiert wurden: 186
Die while-Schleife $i = 1; while ($i <= $_POST['anzahl']) { echo "Happy Birthday! \n"; $i++; } echo "Schleife wurde verlassen.\n";
Zuerst erzeuge ich eine Zählvariable $i, die ich gleich mit 1 initialisiere. Solch eine Variable benötigst du in der Regel. Schließlich musst du dafür sorgen, dass die Bedingung irgendwann wieder falsch wird. Zählvariablen werden gerne mit $i bezeichnet. Diese Benennung ist aber keinesfalls Pflicht. Du kannst deine Variable auch $zaehler, $kaugummi oder $fliegenschiss nennen. In der ersten eigentlichen Schleifenzeile wird nun die Bedingung überprüft. Der Test erfolgt also in dem eben erwähnten Schleifenkopf: while ($i <= $_POST['anzahl']) {
Was wird hier geprüft? Es wird geprüft, ob $i kleiner gleich $_POST['anzahl'] ist, also kleiner gleich dem Wert, den du in das Formularfeld eingegeben hast. Nehmen wir einmal an, du hast eine 6 eingegeben! Die 1 ist kleiner gleich 6. Also wird der Code innerhalb der Schleife ausgeführt. Der Satz Happy Birthday wird nebst Zeilenumbruch in das Dokument geschrieben. echo "Happy Birthday! \n";
Als nächstes wird die Zählvariable um 1 erhöht. Dafür kommt der im vorigen Kapitel besprochene Inkrementierungs-Operator ++ zum Einsatz: $i++; bedeutet so viel wie $i = $i + 1. In der Variablen $i ist nun der Wert 2 gespeichert. Der Schleifenblock ist zwar zu Ende, doch die Schleife prüft die Bedingung erneut auf Wahrheit: Das ganze Spielchen geht also von vorne los: Ist $i (nunmehr 2) immer noch kleiner gleich 6? Jawohl, das ist der Fall. Die Bedingung ist immer noch wahr und die Schleife kann wiederholt werden. Also wird der Satz Happy Birthday ein zweites Mal ausgegeben usw. usf. Erst nach dem 6. Durchlauf (ich wiederhole: danach!) gibt die Prüfung der Bedingung in unserem Falle falsch zurück. Warum? Das ist klar: Nach dem 187
Kapitel
7
Schleifen: Die »Gratulationsmaschine« 6. Durchlauf hat $i den Wert 7 angenommen. Und der Vergleich 7 ist kleiner gleich 6 liefert nicht mehr wahr, sondern falsch. Damit wird die Schleife verlassen, ein siebter Durchlauf findet nicht statt. Jetzt wird der Satz unterhalb der Schleife angezeigt: echo "Schleife wurde verlassen.\n";
Ganz wichtig: Achte unbedingt darauf, dass die Bedingung im Schleifenkopf irgendwann einmal falsch (false) zurückgibt. Denn sonst erzeugst du eine der berüchtigten Endlosschleifen. Die Endlosschleife läuft Amok, sie wird immer wieder und wieder ausgeführt, bis dein Rechner oder der Webserver im schlimmsten Fall nicht mehr reagiert!
Gib auch die Zählvariable aus! Du hast das Prinzip verstanden? Sehr gut! Dann hast du in wenigen Stunden das geschafft, wofür der Autor dieses Buches Monate gebraucht hat! Zum Festigen schlage ich vor: Erweitere das eben erstellte »Geburtstagsskript« ein wenig. Gib zusätzlich die Zählvariable mit aus. Wandle den Satz Happy Birthday! einfach um in Happy Birthday, 1. Jahr! bzw. Happy Birthday, 2. Jahr! usw. usf.
So verstehst du noch besser, was mit dem Zähler geschieht.
Hast du die Lösung selbsttätig gefunden? Es ist ganz einfach! Ändere lediglich die echo-Zeile innerhalb der Schleife wie folgt: echo "Happy Birthday, $i. Jahr! \n";
Du findest das Beispiel auch unter dem Namen whilecount.php im Ordner kapitel07 auf der CD zum Buch. 188
Prüfung zu Fuß: do while
Prüfung zu Fuß: do while Der Vollständigkeit halber erwähne ich noch die do-while-Schleife. Der Unterschied: Bei der while-Schleife wird die Bedingung im Schleifenkopf getestet, bei der do-while-Schleife dagegen im Schleifenfuß. Die Syntax sieht folgendermaßen aus: do { Befehlszeilen immer wieder ausführen, solange Bedingung wahr ist; } while (Bedingung); Fortsetzung, wenn Bedingung falsch;
Im Klartext: Da die Bedingung erst im Schleifenfuß getestet wird, wird die Schleife mindestens einmal durchlaufen. Auch wenn die Bedingung von vornherein falsch ist. Das entsprechende Diagramm sieht folgendermaßen aus:
Die Schleife wird mindestens einmal ausgeführt.
Wenn du die vorige Datei auf do-while umbaust, kommt folgendes heraus, ich zeige dir zumindest den PHP-Bereich:
189
Kapitel
7
Schleifen: Die »Gratulationsmaschine«
\n"; $i++; } while ($i <= $_POST['anzahl']); echo "Schleife wurde verlassen.\n"; } ?>
Prüfe, ob meine Aussage stimmt. Gib einmal einen negativen Wert in das Feld ein. Die Schleife wird zumindest einmal durchlaufen! (Mit der 0 klappt es in unserem Fall allerdings nicht. Die 0 wird schließlich schon von unserer if-Abfrage mit empty() herausgefiltert!) Du findest das Beispiel in der Datei dowhile.php. Hilfe! Du hattest schon Probleme mit der while-Schleife und magst die do-while-Konstruktion überhaupt nicht? Ich mag sie auch nicht. Und ich habe sie in meiner ganzen Praxis wohl nur ein einziges Mal benötigt. Bleibe bei der while-Schleife. Mache dich jedoch unbedingt mit der nächsten Schleifengattung vertraut, lerne den Schleifentyp for.
Der Bestseller: for Kommen wir nun zum Höhepunkt unserer »Schleifendiskussion«. Die beliebteste und wohl am häufigsten eingesetzte Schleife ist die for-Schleife. Diese Schleife wird gemeinhin als Zählschleife bezeichnet. Leider ist sie nicht ganz so einfach zu verstehen. Aber wir nehmen uns Zeit!
Die Syntax von for am Beispiel erklärt Hier zeige ich dir zuerst die Grundsyntax der for-Schleife:
190
for (Zählvariable; Bedingung; Zählmuster) { Befehlszeilen immer wieder ausführen, solange Bedingung wahr ist; }
Der Bestseller: for Zählvariable, Prüfung der Bedingung und das Festlegen des Zählmusters erfolgen gebündelt im Schleifenkopf. Diese Elemente werden in runden Klammern zusammengefasst und durch Semikolons voneinander abgegrenzt. Schau dir diesen besonderen Schleifenkopf etwas genauer an. Dazu wähle ich zur Verdeutlichung eine etwas ausführlichere Schreibweise: for (Zählvariable initialisieren; Bedingung abfragen; Zählmuster festlegen) { Befehlszeilen immer wieder ausführen, solange Bedingung wahr; }
Soweit die Theorie. Jetzt zur Praxis. Nimm dir doch noch einmal das while-Beispiel vom Anfang des Kapitels vor! Hier fix der Quelltext, damit du nicht erst zurückblättern musst: $i = 1; while ($i <= $_POST['anzahl']) { echo "Happy Birthday, $i. Jahr! \n"; $i++; } echo "Schleife wurde verlassen.\n";
Dieses while-Beispiel bauen wir jetzt zu einer for-Schleife aus. Zählvariable initialisieren Im while-Beispiel gibt es einen Zähler ($i), den ich mit 1 initialisiert habe. Dort wird also die Zählvariable initialisiert. Dafür sorgt die Zeile $i = 1;
Diese Anweisung hatte ich oberhalb der Schleife notiert. Sie gehört zwar nicht direkt zum Schleifenblock dazu, ist aber wichtig. Bedingung abfragen Die Bedingung selber wird im Schleifenkopf geprüft, sie lautet $i <= $_POST['anzahl']
Zählmuster festlegen Außerdem habe ich ein Zählmuster festgelegt. Der Zähler wurde innerhalb der Schleife inkrementiert, also um 1 erhöht. Diese Anweisung sieht so aus: $i++;
191
Kapitel
7
Schleifen: Die »Gratulationsmaschine« Soweit also das schon bekannte while-Beispiel. Alles das wird in der forSchleife nun im Schleifenkopf zusammengefasst, also an einer zentralen Stelle. Daraus ergibt sich im Beispiel folgende kompakte Notation. for ($i = 1; $i < = $_POST['anzahl']; $i++) { echo "Happy Birthday, $i. Jahr! \n"; }
Zugegeben, bei einer while-Schleife sind alle diese Elemente etwas verstreut, aber das Prinzip ist das gleiche. In den meisten Fällen ist es egal, ob du while oder for verwendest. Ich empfehle die for-Konstruktion, weil sie so schön »aufgeräumt« ist. Es gibt jedoch einige seltene Fälle, wo du vor allem mit while glücklich wirst. Beispiele dafür findest du im Datenbankteil, wenn MySQL-Tabellen abgefragt werden.
Die for-Schleife ist der komfortabelste Schleifentyp.
Du findest das Beispiel in der Datei for.php auf der CD zum Buch.
Und die Geburtstagskerzen?
192
Feierst du gerne Geburtstag? Mit Party, Torte und Kerzen? Kerzen – das ist genau das Stichwort. Ich möchte in diesem Kapitel noch mehr »Geburtstagsstimmung« verbreiten und ein paar »Kerzen anzünden«. Und zwar für jedes Jahr eine. Wir stellen die Kerzen schön ordentlich nebeneinander.
Und die Geburtstagskerzen? Egal, ob dich das Beispiel vom Hocker reißt oder nicht. Du lernst, wie du mit einer Schleife eine Grafik mehrfach einfügen kannst und gleichzeitig die Zellen einer Tabelle dynamisch erzeugst.
Wie alt bist da? Dank einer Tabelle stellt das Skript für jedes Jahr eine Kerze auf.
Tabelle dynamisch erzeugen Nimm das vorhandene for-Schleifen-Beispiel aus der Datei for.php. Auch hier benötigen wir das Formularfeld für die Eingabe des Alters. Ich speichere die Datei unter einem anderen Namen, im Beispiel unter dem Namen kerzen1.php. Für das Beispiel habe ich eine kleine Abbildung vorbereitet, die 12 Pixel breit und 50 Pixel hoch ist. Sie heißt candle.gif. Du findest sie auf der CD zum Buch, und zwar im Ordner beispiele/kapitel07. Du kannst aber auch jede andere Grafik verwenden, solange diese nicht zu breit ist Und hier zeige ich dir nun den gesamten Teil zwischen den Tags :
Schleifen: Die »Gratulationsmaschine« Das Prinzip ist nicht schwer zu verstehen. Das Grundgerüst der Tabelle entsteht erst einmal außerhalb der Schleife. Diese Zeile leitet die Tabelle ein: echo "
\n";
und diese Zeile schließt die Tabelle: echo "
\n";
Die Schleife selber macht nun nichts weiter, als die einzelnen Zellen zu erzeugen. In Abhängigkeit vom eingegebenen Alter wird folgende Passage mehr oder weniger oft wiederholt: echo "
\n";
Fertig ist die »Kerzenlinie«. So einfach kannst du mit einer Schleife also auch dynamische Inhalte erstellen! Das Beispiel eignet sich übrigens ganz fabelhaft zum Erstellen eines attraktiven Säulendiagramms. Du willst die Verkaufszahlen eines Produktes darstellen, z. B. deiner selbst gekochten Kaugummis? Dann kannst du die Säule einfach aus kleinen Abbildungen deiner Produkte zusammensetzen! Hatte es einen tieferen Sinn, dass ich ausgerechnet eine Tabelle schreibe? Hätte ich das Skript nicht verkürzen und den ganzen
-
-Kram weglassen können? Na klar! Aber ich wollte auf jeden Fall einen Umbruch vermeiden. Mit anderen Worten: Ich wollte verhindern, dass die »Kerzensäule« auseinandergerissen wird!
Have a break: Abbruchbedingung einfügen Reagiere auf Fehleingaben! Gegen die Eingabe von Buchstaben oder negativen Zahlen ist das Skript von Hause aus immun. Dann wird die Schleife schlicht und einfach nicht ausgeführt. Auch eine 0 wird dank !empty() schon von vornherein abgeblockt. Doch manchmal kann man gar nicht so dumm denken, wie es kommt. Ein Spaßvogel gibt eine irrwitzig hohe Zahl ein, z. B. zehntausend? Dann muss 194
Und noch eine Schleife: foreach dein Webserver ganz schön arbeiten, um alle diese zehntausend Kerzen an den Browser zu schicken. Was hier spaßig klingt, hat ernste Hintergründe. Gerade solche Möglichkeiten machen dein Skript verwundbar für Angriffe der »Skript-Kids«. Dahinter verbergen sich Amateure die es nur darauf abgesehen haben, deine Präsenz zu stören. Und schon die wiederholte Durchführung solcher »Angriffe« kann deinen Webserver lahm legen und die Site für andere nicht mehr erreichbar machen. Welche Möglichkeit hast du in diesem Fall? Füge eine Abbruchbedingung ein! Nutze das Schlüsselwort break. Das Schlüsselwort break führt innerhalb einer Schleife wie do, do-while oder for zu einem Abbruch der Schleife. Die Schleife wird sofort verlassen und die Programmausführung geht unterhalb der Schleife weiter. Definiere solch eine Abbruchbedingung! Ab der Zahl 108 soll das Skript mit dem Erzeugen von Kerzen aufhören. Mit anderen Worten: Es sollen höchstens 108 Kerzen gezeichnet werden, egal wie hoch das angebliche Alter des Benutzers auch sein mag. Dafür arbeite ich mit einer einfachen ifAbfrage. Diese prüft, ob der Wert größer als 108 ist und setzt im Zweifelsfalle das Schlüsselwort break in die Schleife ein. Da ich im Vergleich zum vorigen Beispiel nur die Schleife verändert habe, zeige ich dir lediglich die erweiterte Schleifenkonstruktion mit eben dieser Abbruchbedingung. Du findest das Beispiel in der Datei kerzen2.php. for ($i = 1; $i <= $_POST['anzahl']; $i++) { echo "
$i
\n"; if ($i >= 108) { break; } }
Ich habe die Variable $i (siehe Pfeil) nur deshalb mit eingefügt, damit du die Zählung überprüfen kannst! Entferne sie einfach, wenn sie dich stört.
Und noch eine Schleife: foreach Zum Schluss stelle ich dir noch eine wirklich tolle Schleifenkonstruktion vor. Ich präsentiere dir hier an dieser Stelle ganz exklusiv die … foreachSchleife!
195
Kapitel
7
Schleifen: Die »Gratulationsmaschine«
Schleife für Wertelisten Die foreach-Schleife durchläuft ein Array und gibt die dort gespeicherten Werte zurück. Auf diese Art und Weise kannst du nacheinander alle Werte eines Arrays ermitteln. Zur Erinnerung: Ein Array ist eine Werteliste, bei der mehrere Werte in einer Variablen gespeichert werden. Zum Ermitteln des einzelnen Wertes dient der jeweilige key, der Schlüssel. Es gibt Arrays mit einem numerischen key. Hier werden die einzelnen Werte mit 0 beginnend hochgezählt. Weiterhin gibt es die assoziativen Arrays mit einer Zeichenfolge als key. Der key trägt hier meist eine Bedeutung und ist daher im Gegensatz zur Nummer meist viel interessanter. Probiere es zuerst bei einem »herkömmlichen« Array, bei dem dich der numerische key nicht so dringend interessiert. Wenn du auf die Ausgabe des keys verzichtest, sieht die Syntax von foreach so aus: foreach ($Arrayname as $value) { echo "$value \n"; }
Das Wort $Arrayname steht hierbei nur als Platzhalter für den Namen der Werteliste. Die echo-Zeile dient lediglich als Vorschlag. Du kannst die Ausgabe natürlich noch besser verpacken. Wichtig ist jedoch die Zeichenfolge $value, welche den Wert ausgibt.
Wochentage: Nur den value ausgeben Zu theoretisch? Ein Beispiel muss her! Erinnerst du dich noch an das Wochentage-Beispiel von Kapitel 4? Mal sehen ob es dir gelingt, alle Werte aus dem Array $tag fein säuberlich auszugeben.
196
Wochentage ausgeben mit foreach
Und noch eine Schleife: foreach foreach ($tag as $value) { echo "$value \n"; } ?>
Bei dieser ersten Variante wird der Wert (value) ausgegeben, nicht der key, der sogenannte Schlüssel. Wie schon erwähnt, der key ist im ersten Fall nicht so umwerfend wichtig, entspricht er doch der Index-Nummer.
Alle Werte aus dem Array werden ausgegeben!
Du findest das Beispiel unter dem Namen foreach1.php auf der CD zum Buch. Die Zeichenfolge foreach kann mit für jedes übersetzt werden. Die Schleife gilt also für jedes Element im Array, sie liest alle Elemente aus.
Hauptstädte: key und value gemeinsam ausgeben Viel interessanter wird die Geschichte bei assoziativen Arrays. Also bei der Array-Gattung, bei der auch der key eine Bedeutung trägt und nicht nur eine langweilige Nummer ist. Dann lohnt es sich auch, den key zu ermitteln. Die Grundsyntax von foreach wird dafür etwas erweitert: foreach ($Arrayname as $key => $value) { echo "$key = $value \n"; }
Auch hier dient die echo-Zeile lediglich als Ausgabe-Vorschlag. 197
Kapitel
Schleifen: Die »Gratulationsmaschine«
7
Bei dieser Variante wird sowohl der key als auch der value ausgegeben.
Probiere auch diese Variante am Beispiel aus.
Hauptstädte: key und value ermitteln
$value) { echo "$key = $value \n"; } ?>
Fabelhaft! Das Array liefert dir alle Schlüssel-Werte-Paare aus dem Array. Vergleiche mit der Datei foreach2.php von der CD zum Buch. Übrigens bist du nicht auf die Bezeichnungen $key und $value festgelegt – das ist nur ein Vorschlag. Du kannst auch $schluessel und $wert oder etwas anderes einsetzen. Vergleiche mit der Datei foreach3.php, wo ich diese individuelle Variante verwendet habe. Natürlich kannst du die Ausgabe bei echo stets an deinen Geschmack anpassen. Kleide die Variablen $key und $value und $schluessel und $wert beispielsweise in Sätze ein. Gib die Daten in Tabellenzellen aus usw. usf. Besonders wichtig ist diese Technik bei der Auswertung von Formularen, denn Formulare sind ein assoziatives Array, welches aus Attribut-Werte-Paaren (key-value-Paaren) besteht. Das Array selber heißt $_POST. Der Wert (key) ist der Name des Formularfeldes. Genau dieses Wissen brauchst du im nächsten Kapitel! 198
Schlussbemerkung
Schlussbemerkung In diesem Kapitel hast du die Schleifen kennengelernt, die praktischen »Wiederholmodule« einer Programmiersprache. Egal ob while, for oder foreach: Vielleicht hast du ja die Erfahrung gemacht, dass Schleifen gar nicht so kompliziert sind, wie der Autor behauptet hatte? Wie auch immer, mit diesem Kapitel ist der Grundlagenteil des Buches abgeschlossen. Fortgeschrittene Programmieraufgaben sowie kleine als auch größere Projekte warten auf dich!
Zusammenfassung 0 Du kennst das Konzept von Schleifen. Hier werden Befehlszeilen in Abhängigkeit von einer oder mehreren Bedingungen wiederholt. 0 Die while-Schleife wird ausgeführt, solange die Bedingung wahr ist. Die Prüfung findet im Schleifenkopf statt. 0 Bei der do-while-Schleife findet die Prüfung erst im Schleifenfuß statt. Deshalb wird die Schleife auch dann einmal durchlaufen, wenn die Bedingung von Anfang an falsch ist. 0 Du weißt, dass du bei Schleifen immer eine Abbruchbedingung vorsehen musst, damit es nicht zu einer Endlosschleife kommt. 0 Du kennst die for-Schleife (Zählschleife). Hier erfolgen Initialisierung der Zählvariable, Test der Bedingung und Festlegen des Zählmusters direkt im Schleifenkopf. 0 Du kennst das Schlüsselwort break, welches zum Abbruch einer Schleife führt. 0 Du kennst die foreach-Schleife, die ein Array durchläuft und auf Wunsch key und value zurückgibt.
Ein paar Fragen … 1. Bei welchem Schleifentyp erfolgt der Test der Bedingung im Schleifenfuß? 2. Mit welchem Schlüsselwort erreichst du, dass eine Schleife abgebrochen wird?
199
Kapitel
7
Schleifen: Die »Gratulationsmaschine« 3. Wie heißt der Schleifentyp, mit dem man ein Array durchlaufen und key und value zurückgeben kann? 4. Was bedeutet $i++ und wie nennt man diese Operation?
… und ein paar Aufgaben 1. Erstelle eine for-Schleife, die alle ungeraden Zahlen zwischen 2 und 16 nebeneinander ausgibt. Nenne die Datei ungerade1.php.
So soll es aussehen: Die ungeraden Zahlen stehen nebeneinander.
2. Versuche, das Gleiche mit einer while-Schleife zu erreichen. Nenne die Datei ungerade2.php. 3. Erstelle ein Dokument namens anzeigen.php. Hier sollen per Formular folgende Besucherdaten erfragt werden: Vorname, Name, Str, PLZ, Ort und Email. Nutze diese Bezeichnungen für die Bennennung der Formularfelder. Nach Klick auf ABSENDEN sollen alle Benutzerdaten auf der gleichen Seite noch einmal eingeblendet werden. Verwende dafür eine foreach-Schleife. Tipp: Denke daran, dass das Array eines mit method="post" erzeugten Formulars $_POST heißt!
200
8 Fürs Feedback: Formmailer selbst gestrickt Feedback! Danach sehnen sich wohl die meisten Betreiber einer Webseite. Du lernst in diesem Kapitel, wie du $ die Funktion mail() zum Versenden von E-Mails einsetzt $ der Botschaft einen Datums- und Zeitstempel aufdrückst $ ein Feedback-Formular programmierst $ die Daten vor dem Absenden überprüfst (validierst) $ einen Universal-Formmailer erstellst, der praktisch jedes Formular versendet Im gesamten Kapitel müssen wir die Zeichensatzkodierung der HTMLDatei ausnahmsweise auf ISO-8859-1 ändern! UTF-8 bereitet Probleme, Umlaute und Sonderzeichen kommen beim Empfänger möglicherweise verstümmelt an! Ersetze utf-8 stets durch iso-8859-1 Wähle dann in PSPad FORMAT|ANSI. Außerdem gilt: Die Skripte dieses Kapitels funktionieren nur richtig, wenn du sie online testest! Zumindest der Sende-Teil wird nur auf dem Webserver deines Dienstleisters funktionieren! Dein lokaler Computer kann mit der Funktion mail() in der Regel nicht umgehen und produziert eine Fehlermeldung!
201
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt
Die Funktion mail() Sicher kennst du die klassische Feedback-Lösung – den E-Mail-Link. Erstelle einen mailto-Verweis, auf den man klicken und dir eine Mail schreiben kann. Die Syntax ist dir sicher vertraut: Schreibe mir!
Genauso vertraut sind dir sicher auch die großen Nachteile dieser Methode. Damit es funktioniert, muss der Benutzer ein korrekt installiertes Mailprogramm verwenden. Das ist aber nicht immer der Fall, vor allem nicht in Internetcafés! Ein weiterer Nachteil wiegt viel schwerer: Die »internationale Spam-Mafia« ergaunert solche Adressen und müllt dich in Folge mit unsinnigen Werbemails zu. Ich rate deshalb inzwischen von der mailto-Variante ab. (Eine E-Mail-Adresse solltest du auf deiner Webseite möglichst nur noch als »verschlüsselten Text« mit Leerzeichen, fehlenden Zeichen bzw. Füllzeichen oder sogar als »Text-Grafik« ablegen!)
Lösung mit PHP Wir lernen etwas Besseres: nutze PHP! Denn so kannst du Daten per E-Mail verschicken, ohne dass deine E-Mail-Adresse im Klartext übermittelt wird. Dabei wird ein Mailprogramm verwendet, welches dein Dienstleister für dich bereithält. 0 Beachte allerdings, dass alle Skripte dieses Kapitels nur dann vollständig funktionieren, wenn du sie online testest! Zumindest der Sende-Teil wird nur auf dem Webserver deines Dienstleisters funktionieren. Dein lokaler Computer kann mit der Funktion mail() in der Regel nicht umgehen und produziert eine Fehlermeldung! Zuerst zeige ich dir, wie simpel das Versenden einer E-Mail in PHP eigentlich ist. Dafür benötigst du lediglich die Funktion mail(). Diese Funktion verschickt – nomen est omen – eine E-Mail an die angegebene Adresse. Diese Funktion besitzt folgende Grundsyntax: mail("Empfängeradresse", "Betrefftext", "Botschaft", "From: Absenderadresse")
202
Du kannst alle Argumente direkt in die Funktion eintragen oder aber durch Variablen darstellen. Wichtig: Diese Werte müssen dem Datentyp String
Die Funktion mail() entsprechen. Setze sie also im Zweifelsfalle in Gänsefüßchen! Oder achte darauf, dass die entsprechende Variable für das jeweilige Argument dem Datentyp String entspricht.
Bei Aufruf der Seite: E-Mail! Wie wäre es mit dem ersten Beispiel? Das nun folgende PHP-Dokument verschickt immer dann eine E-Mail, wenn der Surfer die entsprechende Seite aufruft. Weil es so simpel ist, zeige ich dir den gesamten Quelltext. Du findest das Dokument unter dem Namen infomail.php auf der CD zum Buch. Info-Mail verschicken <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
Diese Seite verschickt eine Info-Mail
Achtung! Ersetze »utf-8« durch »iso-8859-1«! Wähle in PSPad außerdem FORMAT|ANSI!
Schaue dir die Funktion mail() etwas genauer an. Als erstes Argument gibst du natürlich statt [email protected] deine eigene E-Mail-Adresse an. Der Wert der Variablen $Email wiederum ist nur ein Platzhalter. Schließlich kannst du bei diesem Skript die E-Mail-Adresse des Surfers nicht ermitteln. Trotzdem verlangt die Funktion irgendeine Absenderadresse. In der Variablen $mailbody speicherst du den Text, welchen die E-Mail an dich schickt. Es ist der »Body« der E-Mail, wenn du so willst. Lade die Seite auf den Server und probiere es aus. Bei jedem Hit bekommst du nun eine E-Mail geschickt mit dem Text Soeben hat jemand deine Seite angeklickt.
203
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt
Hilfe, bei dir funktioniert das Skript nicht, es gibt nur Fehlermeldungen? Bitte vergiss nicht, dass alle Beispiele dieses Kapitels nur dann funktionieren, wenn du die Datei vorher auf den Server lädst. Dein Dienstleister sollte außerdem das serverseitige Mailen unterstützen. Auf deinem lokalen System funktioniert mail() in aller Regel nicht und gibt daher einen Fehler zurück!
mail() läuft nicht auf
dem lokalen System, es gibt eine Fehlermeldung!
E-Mail mit Datums- und Zeitstempel Eine simple E-Mail pro Besuch reicht dir nicht? Du wünschst mehr Informationen? Kein Problem! Ermittle zum Beispiel Datum und Uhrzeit des Besuches. Dazu erzeugst du zusätzlich einen Datums- und Zeitstempel. So weißt du auch ganz exakt, wann der Besucher bei dir vorbeigeschaut hat. Erinnerst du dich? Zum Ausgeben von Datum und Uhrzeit verwendest du die Funktion date() mit den entsprechenden Argumenten. Du möchtest das Datum nach dem Motto ausgeben Tag (1-31), Monat (1-12) und Jahreszahl (vierstellig)? Dann verwendest du die folgende Syntax: echo date("j.n.Y"). Einen Zeitstempel mit Stunden (24 h-Format), Minuten und Sekunden erzeugst du dagegen mit echo date("H:i:s").
Der Quelltext im Überblick Das nun folgende Beispiel verschickt die E-Mail mit Datums- und Zeitstempel. Ich zeige dir den PHP-Teil der Datei mailstempel.php:
204
Das Feedback-Formular $mailbody = "Am $datum um $zeit Uhr hat jemand deine Seite angeklickt!"; mail("[email protected]", "Ein Besucher", $mailbody, "From: $Email"); ?>
Probiere es aus: Lade das Dokument auf den Server und rufe es auf. Schaue dann in deinen Posteingang.
Warum nicht: E-Mail mit Datums- und Zeitstempel.
Hat es funktioniert? Wunderbar. Das war nur eine Übung. Zeit für ein etwas fortgeschritteneres Beispiel!
Das Feedback-Formular Jetzt kommt der erste Höhepunkt dieses Kapitels. Du erstellst ein Feedback-Formular. Der Besucher kann seine E-Mail-Adresse und einen Kommentartext eingeben. Auf Knopfdruck wird der Inhalt an dich abgeschickt.
Erzeuge ein Formular zur Entgegennahme von Feedback.
TEXTAREA: Ideal für Kommentare Ich zeige dir zuerst den kompletten HTML-Quelltext des PHP-Dokuments mitsamt Formular. Den PHP-Teil fügen wir hinterher gemeinsam ein. Nenne das Dokument feedback.php und ergänze es Schritt für Schritt. So erzeugen wir ein sicheres Formular, das auch für das Web geeignet ist!
Dieses Dokument enthält neben zwei INPUT-Feldern eine Besonderheit. Beachte das große »Kommentarfeld«. Dieses Feld wird vom Tag-Paar umschlossen. Es ist wie geschaffen für große Texteingabebereiche. Apropos Größe: Mit dem Attribut cols (Spalten) legst du die Breite des Feldes in Zeichen fest. Ich habe mich für 50 Zeichen entschieden. rows (Zeilen) steuert dagegen die Zeilenzahl, im Beispiel 5. Denkst du an iso-8859-1 statt utf-8? Hast du die Kodierung der Datei auch von UTF-8 auf ANSI geändert (PSPad: FORMAT|ANSI)?
Der PHP-Teil Nun baust du den Formmailer zusammen. Schließlich fehlt der PHP-Teil zum Versenden! Füge folgende Zeilen ein, und zwar zwischen dem abschaltenden -Tag und dem Tag :
206
Professionell mailen: Fehler unterdrücken Das genügt. Zuerst prüfst du mit if, ob das Feld Email zurückgeschickt wurde und nicht leer geblieben ist. Dann schickst du den Formularinhalt mit mail() auf die Reise. Da die einzelnen Argumente von mail() Strings sein müssen, wird z. B. die Zeichenfolge From: $_POST[Email] in Gänsefüßchen eingekleidet. Deshalb darfst du den key des Array-Eintrags aus $_POST ausnahmsweise nicht in Gänsefüßchen schreiben! Schreibe also $_POST[Email] statt $_POST['Email']. Diese gänsefüßchenfreie Schreibweise ist immer dann notwendig (und zulässig), wenn die Array-Variable selber innerhalb eines Gänsefüßchen-Paars steht. Ansonsten solltest du den key je nach Geschmack stets mit einfachen bzw. doppelten Gänsefüßchen umkleiden, wie ich es z. B. bei $_POST['botschaft'] getan habe. Meine Version findest du unter dem Namen feedback1.php auf der CD zum Buch – es ist der erste Stand. Lade das Skript doch einmal auf den Server und probiere es aus. Klappt die Formularauswertung?
Professionell mailen: Fehler unterdrücken Das Skript besitzt bisher etliche Schönheitsfehler! Den ersten Schönheitsfehler merkst du, wenn du das Beispiel offline ausprobierst, also auf deinem heimischen Rechner. Da das Mailen hier nicht funktioniert, hagelt es eine kryptische Fehlermeldung. Solch eine Fehlermeldung kann aber auch auftreten, wenn der Mailer deines Dienstleisters gerade überlastet ist.
Zeichen @ zur Fehlerunterdrückung Vielen Funktionen kannst du das Zeichen @ voranstellen. Dadurch werden Fehler unterdrückt. Notiere statt mail() einfach @mail(). Stelle der mail()-Funktion im Beispiel nun das @-Zeichen voran. Probiere das Skript offline aus. Wunderbar, die Fehlermeldung ist weg. Aber der Nutzer wiegt sich in dem Glauben, sein Kommentar wäre abgeschickt worden. Offenbar war diese eine Maßnahme doch noch nicht der Weisheit letzter Schluss. Und tatsächlich gibt es einen weiteren Trick.
207
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt
Rückgabewert der Funktion mail() testen Viele Funktionen geben einen Wahrheitswert zurück. Bei Erfolg ist es der Wert true, bei Misserfolg der Wert false. So auch bei unserem Star des Kapitels, der Funktion mail(). Die Funktion mail() gibt bei erfolgreichem Versand den Wert true zurück. Wenn der Versand fehlschlägt, wird der Wahrheitswert false zurückgegeben. Diese Eigenschaft solltest du nutzen, um Fehler abzufangen! Zeige dem Besucher eine Bestätigung an, wenn der Versand geglückt ist. Informiere im Gegenzug auch über einen Misserfolg! Der derart erweiterte PHP-Teil sieht so aus: Danke! Die Botschaft wurde weitergeleitet!\n"; } else { echo "
Leider gab es einen Sendefehler!
\n"; } } ?>
Die kryptische Fehlermeldung wird unterdrückt und durch eine sinnvolle ersetzt.
Wie du siehst, werden hier zwei if-Abfragen ineinander geschachtelt. Die innere if-Abfrage testet, ob mail() erfolgreich war. Wenn ja, sieht der Nutzer die Meldung Danke! Die Botschaft wurde weitergeleitet. Bei Misserfolg greift der else-Zweig und informiert über den Sendefehler. Diese Version des Feedback-Formulars findest du in der Datei feedback2.php. 208
Professionell mailen: Fehler unterdrücken
Mehr Variablen für eine klarere Struktur! Ich fürchte, dass uns an dieser Stelle der Hund Buffi noch etwas zu sagen hat. Er scheint mit der bisherigen Fassung des Skripts noch nicht zufrieden zu sein. Der Autor versucht, das Skript kurz zu fassen. Das scheint das Problem vieler sogenannter »genialer Programmierer« zu sein: Sie kürzen wo es geht, und zwar auf Kosten der Klarheit. Ich schlage dir vor, das Skript auf mehr Zeilen aufzuteilen. Füge für E-Mail-Adresse und den Kommentar zusätzliche Variablen ein. Das erzeugt zwar etwas längeren Code, schafft aber eine klarere Struktur! Ich zeige dir meine Version des PHP-Teils, damit du siehst, was ich meine. Danke! Die Botschaft wurde weitergeleitet!\n"; } else { echo "
Leider gab es einen Sendefehler!
\n"; } } ?>
Hinzugekommen sind die Variablen $mailbody und $Email. In diesen speichere ich zuerst den Inhalt aus den zwei Formularfeldern ab. Dann brauche ich innerhalb der Funktion mail() nicht mehr mit den »Monstern« $_POST['Email'] und $_POST['botschaft'] zu arbeiten. Außerdem kannst du den Inhalt der Formularfelder einfacher bearbeiten und ergänzen. Beispielsweise, wenn du weitere Daten in der Variable $mailbody sichern möchtest, und nicht nur den Inhalt des Kommentarfeldes namens botschaft. Diese Version findest du in der Datei feedback3.php. 209
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt
Formular um ein Name-Feld erweitern Einverstanden, der Hund hat Recht. Mehr Klarheit kann nicht schaden. Ich habe seinen Tipp beherzigt und mein Skript um die beiden Variablen erweitert. Damit bin ich tatsächlich viel flexibler. So kann ich nun das Formular problemlos z. B. um ein Name-Feld erweitern!
Füge ein Feld für den Namen ein!
Das ist ganz einfach. Mach mit! Ergänze im Formularbereich folgende Zeile: Name:
Gehe nun in den PHP-Bereich. Ersetze diese eine Zeile: $mailbody = $_POST['botschaft'];
durch folgende zwei Zeilen: $mailbody = $_POST['Name'] . " schrieb\n\n"; $mailbody .= $_POST['botschaft'];
Die Zeichen \n\n sind sicher klar. Sie sorgen für zwei zusätzliche Zeilenumbrüche im Text der E-Mail. So bleibt in der Mail zwischen Name und dem Kommentartext eine Leerzeile. Doch was bedeutet das Zeichen .=?
Kurzform für das Verketten Es handelt sich um eine Kurzform für das Verketten. Diese Zeile entspricht eigentlich folgender Zeile $mailbody = $mailbody . $_POST['botschaft'];
210
Backslashes entfernen mit stripslashes() Mit diesem raffinierten »Verkürzungsoperator« ersparen sich die schreibfaulen Programmierer das doppelte Schreiben einer Variablen: $mailbody .= $_POST['botschaft'];
Wenn man sich an diesen praktischen Operator einmal gewöhnt hat, möchte man ihn bald nicht mehr missen! (Allerdings dauert es eine Weile, ehe man sich daran gewöhnt hat.) Die bisherige Fassung findest du in der Datei feedback4.php.
Backslashes entfernen mit stripslashes() Das Skript besitzt trotzdem noch einen Schönheitsfehler. Dieser ist jedoch nicht gleich offensichtlich: Gib zur Probe einmal einen Kommentartext ein, der einfache oder doppelte Gänsefüßchen enthält. Schließlich soll es vorkommen, dass der Besucher derartige Zeichen einsetzt. Auch bei einem Namen kann z. B. das einfache Gänsefüßchen vorkommen. Denke an den schönen irischen Namen O’Hara.
Gänsefüßchen werden manchmal automatisch durch einen Backslash maskiert.
Wie du der abgebildeten Mail entnehmen kannst, werden diese Zeichen automatisch maskiert – zumindest bei einigen Webhostern. Sie werden »escaped«, es wird ein Backslash vorangestellt. Aus dem Eingabetext Ich wünsche dir "viel Glück"!
wird in der E-Mail z. B.: Ich wünsche dir \"viel Glück\"!
Ist das bei dir auch der Fall? Wenn nicht, hast du Glück mit deinem Hoster! Falls doch – kein Problem dank der Funktion stripslashes().
211
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt
Die Funktion stripslashes(($Variable) entfernt alle Backslashs aus einem String und gibt den bereinigten String zurück. Ich ergänze unterhalb dieser Zeilen: $mailbody = $_POST['Name'] . "schrieb\n\n"; $mailbody .= $_POST['botschaft'];
Und schon wird in $mailbody der »bereinigte String« gespeichert und kann an die mail()-Funktion übergeben werden. Probiere es aus! Die Backslash-Zeichen sind weg! Ich zeige es dir in der Datei feedback5.php. Das eben gezeigte Problem hat etwas mit einer PHP-Einstellung namens magic_quotes_gpc zu tun. Früher stand dieser »magische Schalter« bei den meisten Dienstleistern auf »On«, die Backslashes wurden also stets automatisch hinzugefügt. Inzwischen wird dieser »Schalter« meist auf »Off« geschaltet, auch XAMPP macht das so. Nicht ohne Grund, denn die »magic quotes« sind ein Auslaufmodell! Zum Glück! Mehr zu den Vorund Nachteilen der »magic quotes« verrate ich dir auf Seite 351.
Prüfen! Sind alle Felder ausgefüllt? Wünschst du dir ein Feedback-Formular mit allen Schikanen? Prüfe, ob alle Felder ausgefüllt sind. Gib bei jedem einzelnen Feld eine gezielte Fehlermeldung aus nach dem Motto Die E-Mail-Adresse fehlt. Ich zeige es dir wieder Schritt für Schritt:
>
Ergänze den SUBMIT-Button im Formularfeld. Notiere im Tag zusätzlich das Attribut-Werte-Paar name="submit". Damit verpasst du auch diesem Knopf einen Namen, den du im PHP-Teil auswerten kannst. Ich habe die Ergänzung fett hervorgehoben
> 212
Schaue nun in den PHP-Teil. Bisher findest du dort innerhalb von folgende Codezeilen:
Prüfen! Sind alle Felder ausgefüllt? if (!empty($_POST['Email'])) { $mailbody = $_POST['Name'] . "schrieb\n\n"; ... usw. ...; echo "
Leider gab es einen Sendefehler!
\n"; } }
>
Entferne die erste und die letzte Zeile (siehe Pfeil). Diese auf das E-Mail-Feld bezogene if-Abfrage brauchst du für die nächste Version nicht mehr. Sie wird ersetzt durch eine if-Abfrage, die sich auf den SUBMIT-Button bezieht. Schließlich soll die Namensgebung name="submit" nicht umsonst gewesen sein.
>
Erweitere nun den Bereich innerhalb von wie folgt. Für die eben um zwei Zeilen »gestutzten« Mailer-Zeilen habe ich Auslassungszeichen ... notiert: if (isset($_POST['submit'])) { $fehler = false; $fehlertext = ""; if (empty($_POST['Name'])) { $fehler = true; $fehlertext .= "Der Name fehlt! \n"; } if (empty($_POST['Email'])) { $fehler = true; $fehlertext .= "Die E-Mail-Adresse fehlt! \n"; } if (empty($_POST['botschaft'])) { $fehler = true; $fehlertext .= "Das Kommentar-Feld muss ausgefüllt werden! \n"; } if ($fehler) { echo "
$fehlertext
"; } else { ... hier steht der Mailbereich ... } }
213
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt Probiere das Skript aus, indem du mal das eine, mal das andere Feld frei lässt.
Der Nutzer wird gezielt auf fehlende Felder hingewiesen!
Der Quelltext im Überblick Ich fürchte, dass hier einiger Erklärungsbedarf besteht. Gut, fangen wir außen an. Der gesamte PHP-Teil wird nun von folgender if-Abfrage umspannt: if (isset($_POST['submit'])) { ... }
Hier prüft das Skript, ob das Formular überhaupt abgeschickt wurde. Nur dann ist die Variable $_POST['submit'] gesetzt. Zur Erinnerung: Diese Variable entsteht, da der SUBMIT-Button einen Namen bekommen hat. Doch was passiert in diesen zwei Zeilen? $fehler = false; $fehlertext = "";
Hier werden zwei Variablen deklariert und gleich initialisiert, also mit Werten gefüttert. Die erste Variable namens $fehler ist eine sogenannte Flag-Variable. Es ist tatsächlich ein »kleines Fähnchen« (Flag wie Flagge), welches im Erfolgsfalle – also wenn ein Fehler auftaucht – gehisst wird. Doch zuerst hisse ich noch gar nichts. Ich gehe davon aus, dass dem Benutzer kein Ausfüll-Fehler unterlaufen ist und initialisiere die Variable deshalb mit dem Wahrheitswert false. 214
Prüfen! Sind alle Felder ausgefüllt? Die zweite Variable $fehlertext wird einfach mit einem Leerstring gefüttert. Später soll in dieser Variablen der Fehlertext gespeichert werden. Dieser wird je nach Anzahl der falsch oder gar nicht ausgefüllten Felder kürzer oder länger. Nun erfolgt der erste Test: if (empty($_POST['Name'])) { $fehler = true; $fehlertext .= "Der Name fehlt! \n"; }
Hier prüft das Skript, ob das Feld Name leer gelassen wurde. Wenn ja, ist das ein Fehler. Die Flag-Variable $fehler wird deshalb auf true geschaltet. Es ist wahr, dass ein Fehler vorgekommen ist, unser Fähnlein »flattert im Wind«. Außerdem wird die Variable $fehlertext mit einem Fehlertext nebst Zeilenumbruch gespeist. Wie du siehst, verwende ich hier wieder die Kurzform für das Verketten. Diese Zeile entspricht eigentlich folgender Zeile: $fehlertext = $fehlertext . "Der Name fehlt! \n";
Jetzt wird auch klar, warum ich die Variable $fehlertext am Anfang schon mit einem Leerstring initialisiert hatte. Es muss schon etwas da sein, wenn ich eine Variable mit sich selbst verketten möchte. Die nächsten beiden if-Blöcke prüfen nun, ob das E-Mail-Feld oder das Feld für den Kommentar nicht etwa leer geblieben sind. Falls das so ist, wird auch hier wieder die »Fehlerflagge gehisst« und ein »Fehlertext« notiert. if (empty($_POST['Email'])) { $fehler = true; $fehlertext .= "Die E-Mail-Adresse fehlt! \n"; } if (empty($_POST['botschaft'])) { $fehler = true; $fehlertext .= "Das Kommentar-Feld muss ausgefüllt werden! \n"; }
Und spätestens an dieser Stelle macht die Verkettung Sinn. Bei mehreren fehlenden Feldern werden alle Fehlermeldungen in dieser einen Variable gespeichert. Das ist gerade bei mehreren Feldern wirklich sehr praktisch! 215
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt (Ich habe absichtlich nur drei Felder verwendet, um das Skript nicht zu sehr zu verkomplizieren. In der Praxis können noch viel mehr Felder vorkommen, die der Nutzer ausfüllen muss!)
Fehlertext ausgeben Nun folgt eine weitere if-Abfrage. Hier wird der Status unserer FlagVariablen getestet. Wurde die Flagge gehisst? Gab es einen Fehler? Dann ist der Wert von $fehler true. Dann wird die Variable $fehlertext ausgegeben und der Nutzer sieht, welche Felder sie oder er vergessen hatte: if ($fehler) { echo "
$fehlertext
"; }
Sollte alles okay gewesen sein, kann die Mail dagegen endlich auf die Reise gehen: else { ... hier steht der Mailbereich ... }
Ich hoffe, dass du durch diesen Wust von verschachtelten if-Abfragen durchgestiegen bist. Immerhin hast du damit ein gutes Stück »PraxisKnow-how« mitbekommen. Vergleiche mit der Datei feedback6.php von der CD zum Buch.
Inhalt in die Formularfelder schreiben Die Sache mit den fehlenden Feldern ist ja ganz gut und schön. Und trotzdem ist das Skript bisher doch die reinste Veralberung! Dein Besucher hat mühsam seinen Namen notiert und einen meterlangen Kommentar eingetragen, vor lauter Aufregung jedoch die E-Mail-Adresse vergessen? Das kommt vor! Dann wird sie oder er darauf hingewiesen, dass die E-MailAdresse fehlt. Wie zum Hohn werden beim nächsten Aufruf der Seite Name und Kommentarfeld gelöscht. Das prickelt! Warum speicherst du die Daten nicht in den Feldern, wie schon zwei Kapitel zuvor gezeigt? 216
Inhalt in die Formularfelder schreiben
Das Feld Name sichern Du willst die Eingabe aus dem Feld Name sichern? Dann musst du lediglich den value dynamisch in das Feld schreiben. Ergänze also das Feld:
um das Attribut value – und zwar vor der schließenden spitzen Klammer. Schreibe dort, nach einem Leerzeichen, Folgendes: value=""
Bevor du den Inhalt der Variablen mit echo ausgibst, solltest du stets mit isset($_POST['...']) testen, ob das Formular abgesendet wurde! Nur wenn das jeweilige Formularfeld existiert, kannst du den Wert dieser Variablen auch in das Formularfeld schreiben. Sonst erzeugt PHP den schon erwähnten (normalerweise unsichtbaren) Fehlerhinweis. Die Funktion stripslashes() benötigst du, damit Gänsefüßchen demaskiert werden. Doch das genügt noch nicht! Wie meistens gibt es auch diesmal noch einen Haken an der Sache. Probiere es aus und gib einen Namen mit doppeltem Gänsefüßchen ein. Schreibe zum Beispiel: Hans "Ottokar" Meier. Was stellst du fest? Der Name wird bis zum Gänsefüßchen ausgelesen, dann ist Feierabend.
Der Blick in den Quelltext zeigt das Problem.
217
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt Das Problem: Hier wurden gleichrangige Gänsefüßchen ineinander verschachtelt, und das geht nicht. Denn das nächste Gänsefüßchen ist für HTML das Zeichen, mit dem Auslesen des values wieder aufzuhören. Doch du kannst dem Nutzer schließlich nicht verbieten, doppelte Gänsefüßchen zu schreiben. Ich habe zwei Ansätze für dieses Problem.
Funktion strtr() Zum einen kannst du die Funktion strtr() verwenden. Die Funktion strtr() tauscht bestimmte Zeichen aus. Die Syntax lautet strtr(String, "Zeichen", "Ersatzzeichen");
Der String ist das Element, das durchsucht werden soll. Das kann auch der Rückgabewert einer Funktion sein, wie im Beispiel gleich zu sehen sein wird. Bei Zeichen gibst du das auszutauschende Zeichen an. Bei Ersatzzeichen notierst du dagegen das Austauschzeichen. Im Beispiel würdest du statt stripslashes($_POST['Name']);
Dabei wickle ich einfach zwei Funktionen umeinander. Ersetzt wird das Zeichen " durch das '. Beachte, dass du dem Zeichen " einen MaskierBackslash voranstellen musst. Denn auch hier gilt: Gleichrangige Gänsefüßchen dürfen nicht ineinander verschachtelt werden.
Die Funktion strtr() ersetzt ein Zeichen durch ein anderes.
Die Wirkungsweise dieses Funktionsdoppels ist klar? Zuerst wird der String von seinen Backslashes befreit. Vom derart befreiten String werden nun alle doppelten in einfache Gänsefüßchen umgewandelt. Trotzdem ist strtr() in diesem Fall nicht meine Wahl. Ich entscheide mich lieber für die nächste Funktion!
218
Inhalt in die Formularfelder schreiben
Funktion htmlspecialchars() Besprechen wir nun eine im Zusammenhang mit Formulardesign ungeheuer wichtige Funktion, die Funktion htmlspecialchars(). Sie ist wirklich »sehr special«, denn sie dient zum »Entschärfen« aller in HTML mit besonderer Bedeutung ausgestatteten Zeichen! Auch das doppelte und einfache Gänsefüßchen werden dabei berücksichtigt. Die Syntax lautet: htmlspecialchars($variable)
Was macht htmlspecialchars() nun? Diese Funktion wandelt die vier hier aufgezählten Zeichen in ihre HTML-Entitäten um: Zeichen
wird zu
< > & "
< > & "
(steht für) lower than greater than Ampersand quotation mark
Hier wird das doppelte Gänsefüßchen also nicht durch ein anderes Zeichen ersetzt, sondern in sein HTML-Pendant " umgewandelt. Dadurch bleibt es auch optisch erhalten. Das Name-Feld wird also folgendermaßen erweitert: value=""
Die Funktion htmlspecialchars()
wandelt das Gänsefüßchen in " um.
Die gleiche Behandlung solltest du auch dem E-Mail-Feld gönnen: value=""
219
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt
Der Kommentarbereich Beim Kommentarbereich kannst du ausnahmsweise nicht mit dem Attribut value arbeiten. Für den Bereich ist ein besonderer Trick nötig. Ergänze das Feld
wie folgt:
Der Trick besteht darin, den Inhalt direkt zwischen den Tags zu notieren. Das ist die Besonderheit bei ! Auch hier darfst du nicht vergessen, die Backslashs mit der entsprechenden Funktion zu entfernen. Das Maskieren der Sonderzeichen ist zwar nicht unbedingt erforderlich, da es zumindest hier keine »Gänsefüßchenkonflikte« geben wird. Ich habe es aus Sicherheitsgründen jedoch trotzdem gemacht! Merke dir die wichtige Funktion htmlspecialchars() unbedingt schon einmal vor! Du wirst sie für das eigene Gästebuch aus Kapitel 12 noch benötigen! Hier ist es besonders wichtig, alle Zeichen zu maskieren, mit denen man HTML-Tags zusammensetzen kann. Die »Skript-Kids« schummeln dir sonst eigene HTML- oder JavaScript-Bereiche in dein Tagebuch und verändern damit das Aussehen deiner Seite! Vergiss jedoch nicht, auch hier vorher mit einer if-Abfrage zu prüfen, ob die Variable $_POST['botschaft'] existiert. Denn wenn das Formular noch gar nicht abgesendet wurde, muss auch kein Inhalt in das Formularfeld eingetragen werden. Ohne if-Abfrage würde das Skript zwar auch funktionieren, würde jedoch sofort alle Fehlermeldungen wie Der Name fehlt, Die E-Mail-Adresse fehlt usw. anzeigen. Doch das wäre Unsinn! Fehlermeldungen dürfen erst nach Absenden des Formularinhalts erscheinen. Den bisherigen Sachstand findest du in der Datei feedback7.php. 220
Erweiterter Fehlertest: Mindestlänge und E-Mail-Check
Erweiterter Fehlertest: Mindestlänge und E-Mail-Check Damit ist das Skript aber noch keinesfalls perfekt. Bisher prüfen wir, ob die Felder nicht leer gelassen wurden. Doch wenn der Benutzer nur ein Platzhalter-Zeichen eingegeben hat? Einen Buchstaben oder eine Zahl? »SpaßAusfüller« sind gar nicht so selten! Vor allem das Feld mit der AbsenderMailadresse ist gefährdet. Ohne gründliche Prüfung der Eingabe könnten Hacker dein Formular zum Versenden von Spammails missbrauchen! In diesem Kapitel zeige ich dir deshalb weitere wichtige Fehlerbehandlungs-Techniken. Schreibe eine bestimmte Mindestlänge vor. Prüfe vor allem, ob die E-Mail-Adresse den gültigen Regeln entspricht!
Mindestlänge erzwingen mit strlen() Zuerst unternimmst du etwas gegen zu kurze Namen. Mit weniger als drei Zeichen solltest du dich keinesfalls zufrieden geben! Nutze die talentierte Funktion strlen() für diesen Zweck. Die Funktion gibt die Länge eines Strings zurück. (Dahinter verbirgt sich die Abkürzung für string length.)
>
Suche den Bereich if (empty($_POST['Name'])) { $fehler = true; $fehlertext .= "Der Name fehlt! \n"; }
>
Notiere darunter und über if (empty($_POST['Email'])) { bitte Folgendes: elseif (strlen($_POST['Name']) < 3) { $fehler = true; $fehlertext .= "Der Name ist zu kurz! \n"; }
Durch die Angabe elseif sicherst du, dass der zweite Test erst dann ausgeführt wird, wenn der erste nicht erfolgreich war. Wenn das Feld schon von Anfang an leer ist, macht eine Prüfung auf Länge auch keinen Sinn. 221
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt Und wie wird nun auf Länge geprüft? Ganz einfach: Mit einem Vergleich stellst du fest, ob deine Wunschlänge unterschritten wurde. Wenn ja, setzt du die »$fehler-Flagge« auf true und fügst einen sinnvollen Fehlertext hinzu. Das gleiche kannst du für das Kommentarfeld (botschaft) erledigen. Ergänze zum Beispiel folgenden elseif-Zweig: elseif (strlen($_POST['botschaft']) < 3) { $fehler = true; $fehlertext .= "Der Kommentar ist zu kurz! \n"; }
Welche Zahlen du für die Länge einsetzt, bleibt natürlich dir überlassen.
E-Mail-Check mit regulärem Ausdruck Hast du Lust, auch den E-Mail-Check zu verbessern? Soviel schon vorweg: Prüfen, ob eine E-Mail-Adresse wirklich existiert, kannst du nicht. Du kannst dich aber davor schützen, dass dir der Ausfüllende unsinnige Zeichenfolgen als »E-Mail-Adresse« verkauft. Schließlich folgt der Aufbau solch einer Adresse ganz bestimmten Regeln. Solch ein Test gelingt dir mit den sogenannten regulären Ausdrücken, kurz RegExp. Mit diesen entsprechend vorbereiteten »Suchmustern« kannst du Strings auf das Vorhandensein bestimmter Zeichenfolgen prüfen. 0 Ist das Zeichen »@« vorhanden? 0 Ist die sogenannte Toplevel-Domain (eine Endung wie .de, .org oder .museum) nicht kürzer als zwei und nicht länger als sechs Zeichen? 0 Wurde ein Punkt notiert? 0 Besitzt die Adresse etwa verbotene Zeichen wie Leerzeichen, Umlaute oder Sonderzeichen? Betrachte diese mysteriösen regulären Ausdrücke einfach als eine Art universale Musterschablone. Also eine Schablone, die du dir für jeden Zweck zurechtbiegen kannst. Du testest auf das Vorhandensein oder Nichtvorhandensein bestimmter Zeichen- und Zeichenfolgen. Unsere »Musterschablone« für die E-Mail-Adresse sieht folgendermaßen aus, notiere bitte eine lange Zeile ohne Umbruch: $muster = "/^[a-zA-Z0-9-_.]+@[a-zA-Z0-9-_.]+\. [a-zA-Z]{2,6}$/";
222
Erweiterter Fehlertest: Mindestlänge und E-Mail-Check In dieser Zeile wird der reguläre Ausdruck definiert und in der Variablen $muster abgelegt. Nimm einfach hin, dass dieser Ausdruck die Schablone für eine E-Mail-Adresse darstellt und lass dich von dieser Zeichenwüste für den Anfang nicht allzu sehr beeindrucken.
Testen auf Übereinstimmung mit preg_match() Und wie testest du nun auf Übereinstimmung? Verwende die Funktion preg_match()! Die Syntax sieht so aus: preg_match(Suchmuster, Zeichenkette)
Das Suchmuster ist unser eben festgelegter regulärer Ausdruck. Also die Musterschablone für die E-Mail-Adresse. Die Zeichenkette ist der Prüfling, im Beispiel die zu testende E-Mail-Adresse. Wenn es keine Übereinstimmung mit dem Suchmuster gibt, wird eine 0 zurückgegeben, ansonsten liefert die Funktion mindestens 1. Das können wir uns in der if-Abfrage zunutze machen. Hier zeige ich dir die gesamte umgebaute if-elseif-Struktur für den Test der E-Mail-Adresse. Beachte, dass du die Variable $muster am Anfang dieser Passage initialisieren musst, damit der if-elseif-Ablauf nicht gestört wird. Es ist eine lange Zeile ohne Umbruch! Den alten Teil habe ich hervorgehoben. $muster = "/^[a-zA-Z0-9-_.]+@[a-zA-Z0-9-_.]+\. [a-zA-Z]{2,6}$/"; if (empty($_POST['Email'])) { $fehler = true; $fehlertext .= "Die E-Mail-Adresse fehlt! \n"; } elseif (preg_match($muster, $_POST['Email']) == 0) { $fehler = true; $fehlertext .= "Die E-Mail-Adresse ist ungültig! \n"; }
Probiere deinen Fehlertest bisher ruhig einmal aus. Gib absichtlich ein paar falsche E-Mail-Adressen ein, z. B. mit Umlauten, Leerzeichen, fehlendem Zeichen @ usw. usf. Mit diesem regulären Ausdruck verhindern wir übrigens auch den Missbrauch unseres Mailformulars zu Spamzwecken. Angreifer schaffen es nun nicht mehr, die mail()-Funktion auszutricksen!
223
Kapitel
Fürs Feedback: Formmailer selbst gestrickt
8
Das ist keine gültige E-Mail-Adresse. Es fehlt der Klammeraffe!
Mit diesem Test bist du »professionellem Formdesign« ein ganzes Stück näher gerückt. Das Beispiel findest du in der Datei feedback8.php.
RegExp: Der Aufbau des Such-Musters Zurück zum Such-Ausdruck aus der Variablen $muster. Interessiert dich, was dahinter steckt? Der gesamte Ausdruck wird zuerst einmal eingehüllt von zwei gleichen frei wählbaren Zeichen, hier ein Slash: / /. Das Dach ^ signalisiert den Beginn der Zeichenfolge, ein Dollar-Zeichen $ das Ende. Die Zeichenfolge a-zA-Z0-9-_. steht als Platzhalter für ein beliebiges alphanumerisches Zeichen, also für a-z, A-Z, 0-9, außerdem für den Bindestrich –, den Unterstrich _ und den Punkt .. Dadurch kann man Umlaute, Leer- und andere Sonderzeichen von vornherein ausschließen! Warum Unterstrich und Bindestrich? Diese Zeichen sind deshalb wichtig, da sie ebenfalls in E-Mail-Adressen vorkommen können. Auch der Punkt ist geläufig, deshalb musst du dieses Zeichen ebenfalls berücksichtigen. Das ganze fasst du in eckige Klammern ein und versiehst es mit einem Plus-Zeichen: [a-zA-Z0-9-_.]+ Das Plus-Zeichen verdeutlicht, dass dieses entsprechende Zeichen mindestens einmal vorkommen muss und beliebig oft vorkommen kann. Auch eine beliebige Kombination aller dieser Zeichen ist also erlaubt. Leerzeichen, Umlaute oder Sonderzeichen sind jedoch ausgeschlossen.
224
Das Zeichen »@« habe ich nicht innerhalb von Klammern notiert. Warum? Das bedeutet, dass dieses Zeichen genau einmal vorkommen muss, und zwar an dieser Position (in der Mitte der E-Mail-Adresse)! Danach notierst du wieder den Platzhalter für ein beliebiges alphanumerisches Zeichen. Der ebenfalls nicht eingeklammerte Ausdruck \. steht für dem »Pflicht-Punkt« an dieser einen Stelle.
Erweiterter Fehlertest: Mindestlänge und E-Mail-Check Ganz am Schluss der E-Mail-Adresse dürfen nur alphanumerische Zeichen vorkommen. Hier geht es um die Top-Level-Domains wie .de, .info oder .museum. Das wird durch folgende Zeichen symbolisiert: [a-zA-Z]{2,6}
Mindestens zwei, höchstens jedoch sechs Zeichen sind erlaubt. Das symbolisiert die Zeichenfolge {2,6}. Uff! Schon in diesem einen Suchmuster steckt ziemlich viel Komplexität. Schon aus diesem kurzen Beispiel merkst du, wie schwierig der Umgang mit diesen regulären Ausdrücken ist. Es gibt umfangreiche Kapitel in Fachbüchern, die sich allein diesem Thema widmen. Bei Stefan Münz auf http://de.selfhtml.org findest du ebenfalls eine ziemlich umfangreiche Einführung in dieses Thema. Und es gibt sogar mehrere »Spielarten« dieser regulären Ausdrücke. Der Autor hat z. B. mit den modernen Perlkompatiblen regulären Ausdrücken gearbeitet (Perl ist eine mit PHP vergleichbare Server-Programmiersprache!). Der Name der Funktion preg_match (Perl-kompatible reguläre Ausdrücke, match wie Übereinstimmung) weist darauf hin. Falls du ältere PHP-Einführungen liest, stößt du möglicherweise auf die veraltete Funktion ereg(). Diese Funktion bietet zu wenige Möglichkeiten. Im zweiten Buch werden wir uns noch intensiver mit diesen regulären Ausdrücken beschäftigen!
Schutz gegen Flooding? Ist das Skript damit schon perfekt? Nein! Es ist noch nicht gegen Flooding (»Fluten«) geschützt. Also dagegen, dass ein Scherzbold immer wieder und wieder auf den ABSENDEN-Button klickt und damit das erneute Versenden auslöst. Denn alle Formulardaten bleiben in den Formularfeldern erhalten. Man müsste den Inhalt der Formularfelder irgendwie löschen, damit es nicht zu einem erneuten Versand kommt. Und hier greife ich eine Idee von Falk auf, die er in meinem Forum gepostet hat. (Danke, Falk!) Mache einmal Folgendes:
>
Vertausche die Position von Formular (alles zwischen den Tags ) und PHP-Skript. Bisher beginnt das Formular ja direkt unterhalb der
und endet über dem einschaltenden PHP-Tag und dem schließenden Body-Tag
ein. (Ausschneiden und Einfügen
kannst du hoffentlich?) 225
Kapitel
8
Fürs Feedback: Formmailer selbst gestrickt Wenn du das Skript jetzt ausprobierst, sollte es weiterhin funktionieren. Der einzige Unterschied: Die Statusmeldungen erscheinen jetzt über und nicht mehr unter dem Formular – und das ist ja nicht das Schlechteste. (So fallen sie besser ins Auge.)
>
Die ersten drei Zeilen des Skripts unterhalb von
sehen nun wie folgt aus. Setze doch einmal die Zeile $fehler = false; vor die if-Abfrage.
Feedbackformular
Dadurch wird die $fehler-Variable gleich von Anfang an mit false initialisiert. Sie ist daher gleich im gesamten Skript »sichtbar«.
>
Und nun – ahnst du schon was? – gehst du in den unteren QuellcodeTeil, ins Formular. Und zwar zu den drei Stellen, wo der value dynamisch in das Feld geschrieben wird. Erweitere die jeweilige if-Abfrage um && $fehler, ich zeige es dir am Beispiel des ersten Felds, des Name-Felds:
Name:
Das bedeutet: Der Wert soll also nur dann in das Feld geschrieben werden, wenn die entsprechende Variable existiert – also wenn das Formular abgeschickt wurde – und wenn es einen Fehler gegeben hat. Einen Fehler, der dafür sorgt, dass die Daten noch nicht abgeschickt werden konnten. Wenn sie dagegen verarbeitet wurden, ist der Wert von $fehler schlicht und ergreifend false. Die Werte werden dann nach Klick auf ABSENDEN aus den Feldern gelöscht! Die Lösung findest du in der Datei feedback9.php.
226
Okay, das ist schon eine gute Lösung, perfekt ist sie noch nicht. Die Gefahr von Flooding ist damit noch nicht gebannt. Die Daten befinden sich trotzdem noch im sogenannten Browsercache (Zwischenspeicher). Der Scherzkeks braucht nur auf Reload des Browsers zu drücken – schon geht die E-Mail noch einmal auf die Reise. Auch der Klick auf den ZURÜCK-Button
Krönender Abschluss: Universal-Formmailer des Browsers ist sehr aufschlussreich. Plötzlich stehen die Daten wieder in den Formularfeldern und lassen sich erneut versenden! Für einen wirksamen Flooding-Schutz haben wir an dieser Stelle aber einfach noch nicht genug Wissen! In Kapitel 12 erstellst du die Funktion isDouble(), um Doppeleinträge bei Gästebüchern zu verhindern. Dabei erzeugt das Formular zusätzlich einen Zeitstempel. Dieser wird in einer Textdatei gespeichert und bei erneutem Versand verglichen. Beide Zeitstempel müssen voneinander abweichen, sonst handelt es sich um alte Formulardaten aus dem Browsercache. Auf diese Weise lässt sich der Doppelversand wirksam unterdrücken. Vergleiche mit meiner Lösung unter kapitel08/feedback (und lies Kapitel 12)! Diese Lösung läuft jedoch an dieser Stelle außer Konkurrenz und wird nicht mit in die Aufgaben am Ende des Kapitels einbezogen!
Krönender Abschluss: UniversalFormmailer Wie wäre es mit einem Skript, welches alle deine Formulare verschickt? Egal wie diese aufgebaut sind? Ideal für Feedback, für Bestellungen aus einem Onlineshop, für Umfragen usw. Dieses Skript gibt es. Nutze meinen berühmten Universal-Formmailer, den ich extra für dieses Buch erweitert und nochmals entscheidend verbessert habe. Das Skript kannst du praktisch zum Auswerten aller deiner Formulare verwenden, ganz egal, wie viele und welche Felder in diesen auftreten. Einzige Bedingung: Das Formular muss auf jeden Fall ein Feld besitzen, welches Email benannt wurde! Außerdem muss jedes Formularelement einen anderen Namen erhalten, aber das versteht sich sicher von selber!
Der Quelltext im Überblick Und hier zeige ich dir nun den kompletten Quelltext der Datei unimailer.php. Beachte meine Kommentare, die dir die Wirkungsweise des Skriptes erklären. Eine Einbauerklärung nebst kurzer Erläuterung der Besonderheiten bekommst du im Anschluss. 227
Kapitel
8
228
Fürs Feedback: Formmailer selbst gestrickt
Formularinhalt versenden <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> $value) { /* Formular-Daten werden in $mailbody gespeichert: */ $mailbody .= "$name = $value\n"; // Kurzform Verkettung $mailbody = stripslashes($mailbody); } $muster = "/^[a-zA-Z0-9-_.]+@[a-zA-Z0-9-_.]+\.[a-zA-Z]{2,6}$/"; /* Versenden! Email-Feld im Formular vorsehen! */ // Ist das Email-Feld nicht leer und gültig? if (!empty($_POST['Email']) && preg_match($muster, $_POST['Email']) > 0) { /* Dann wird Versenden-Funktion mail() aktiv */ $absender = $_POST['Email']; if (@mail($empfaenger, $betreff, $mailbody, "From: $absender")) { /* mail() erfolgreich? Dann sieht Nutzer Folgendes */ echo "
Herzlichen Dank!
\n"; echo "
Die Daten wurden weitergeleitet!
\n"; } /* Sonst gibt es eine Fehlermeldung: */ else { echo "
Leider konnte die Botschaft nicht verschickt werden.
\n"; } } // äußere if-Funktion schließen
Krönender Abschluss: Universal-Formmailer /* else-Zweig äußere if bei nicht gesetzter Email: */ else { echo "
Die E-Mail-Adresse muss angegeben werden und gültig sein!
Keine Lust zum Abschreiben? Du findest das Beispiel natürlich auch auf der CD zum Buch, und zwar unter dem Namen unimailer.php. Außer Konkurrenz biete ich dir noch eine zweite Version meines Unimailers. Du findest sie unter kapitel08 im Ordner unimailer_deluxe. Dort habe ich zusätzlich eine Flooding-Sperre eingebaut. Da ich diese Sperre aber erst in Kapitel 12 erläutere, gehe ich hier nicht weiter auf diesen Zusatz ein. Du möchtest den Inhalt deiner Formulare über diesen Unimailer versenden? Nichts leichter als das. Lege die unimailer.php (und die phpkid.css) auf deinen PHP-fähigen Server. Merke dir die Adresse gut, z. B. http://www.deinserver.de/unimailer.php. Schaue nun in die Datei mit dem Formular, es kann eine normale HTML-Datei sein. Gehe in das einleitende "); } // Dateiname in Variable speichern $datei = "result.txt"; $fp = fopen($datei, "r+"); $vote = fread($fp, filesize($datei)); // String mit Komma als Trenner in Array zerlegen $vote = explode(",", $vote); // Welcher Wert wurde im Formular ausgewählt? // Diese Position wird um 1 erhöht! $vote[$ergebnis]++;
271
Kapitel
11
Eine Umfrage mit grafischer Auswertung // String neu zusammensetzen $vote = $vote[0].",".$vote[1].",".$vote[2]; rewind($fp); // neuen String in Datei schreiben fputs($fp,$vote); fclose($fp); echo "