9. Aufgabe Reisetagebuch

In dieser Aufgabe geht es um Include-Dateien. Es existiert bereits eine Startseite mit einer CSS-Datei. Sie finden die Dateien auf Moodle. Wichtig: Die CSS-Datei wird nicht verändert.

Erstellen Sie in Ihrem Verzeichnis einen neuen Ordner namens img und fügen Sie dort die Bilder ein. Öffnen Sie nun die Startseite im Browser. Die untere Abbildung zeigt einen Ausschnitt der Seite.

Abbildung 9.1: Ein Ausschnitt der Startseite

Aufgabe

Wie Sie anhand der Navigationsleiste erkennen können, soll die Webseite aus insgesamt vier Seiten bestehen:

Es fehlen jedoch noch die Seiten zu Rom, London und Paris. Diese müssen Sie erstellen.

Sie sollen mit Include-Dateien arbeiten, denn der Header-Bereich und der Footer-Bereich sollen für jede einzelne Seite gleich bleiben. Das heißt, Sie schauen sich den HTML-Code der Startseite an und schneiden den Code vom Header und vom Footer aus. Speichern Sie den Code in zwei neue PHP-Dateien.

Nennen Sie die Dateien

und legen Sie die Dateien in einem neuen Verzeichnis namens include ab (siehe Abbildung 9.2).

Abbildung 9.2: Die Ordnerstruktur

Nutzen Sie die Anweisung include, um für die Startseite den Header und den Footer wieder einzufügen.

Machen Sie von der startseite.php drei Kopien und benennen Sie diese um in rom.php, london.php und paris.php. Siehe untere Abbildung.

Abbildung 9.3: Ordnerstruktur mit den neuen Dateien

Die Inhalte für die Seiten Rom, Paris und London müssen nur minimal verändert werden.

Sie verändern lediglich die h1- und die h3-Überschrift. Zusätzlich müssen die das entsprechende Bild auswählen. Siehe folgende Abbildung am Beispiel Rom:

Abbildung 9.4: Lösung für die Seite Rom

Zum Schluss müssen Sie noch die Pfade im Navigationsmenü anpassen, so dass der Benutzer tatsächlich zu jeder Seite wechseln kann.