Des Servers neue Kleider

Ein kleines Märchen zur Winterzeit

Einleitung

Es war einmal ein kleiner Schwabe, der hatte einen großen Traum. Er wollte alles daran setzen, sein Heimatdorf tief in den schwäbischen Wäldern in der ganzen Welt bekannt zu machen. Und so hub er an und kaufte dem Dorf einen Platz im weltweiten Netze und schrieb dem Dorfschultheissen einen Brief, in dem er ihm seinen Plan mitteilte.

Dieser wusste nichts gegen den Plan zu sagen, wo doch der kleine Schwab keinen Heller aus den Amtskassen haben wollte. Und so ging der Schwabe daran und suchte sich ein paar Gefährten, die sich gemeinsam an die mühselige Aufgabe machen wollten. Bald schon war Ihnen erster Erfolg gegönnt und die Gruppe der Gefährten wuchs und gedieh, wie auch der Platz im Netze. Als sie schliesslich sogar den Wettstreit um den schönsten Platz im ganzen Lande gewannen, kannte der Jubel keine Grenzen mehr.

Wie es jedoch im Leben so geht, kam einige Monate später ein junger Bursch daher und wollte dem Platz im Netze ein neues Gewand geben. Nach viel Mühsal und Gespräch ward ein Gewand gefunden, das allen Gefährten gefiel. So machte sich der junge Bursch daran, wie man dem Platz sein neues Gewand anlegen wölle ...

Übersicht

  1. Das alte Layout
  2. Das neue Layout
  3. Die Seite(n) im Frame main
  4. Was geändert werden muss
  5. Die Datei menu.txt
  6. Design Vorgaben

Das alte Layout


  • links oben der Frame corner mit der Datei corner.html. Dieser Frame enthält eine Überschrift für alle Seiten
  • rechts oben der Frame title. Dieser Frame ist statisch an die Datei /steinheim/title.html gebunden.
  • links unten der Frame side mit der Datei side.html: Dieser Frame enthält das Menü  der Seiten im jeweiligen Ordner.
  • rechts unten der Frame main mit der Startdatei main.html und Ausgabeframe der einzelnen Dateien


Steinheim am Albuch
Das
seitliche
Menü

Irgendeine Überschrift

Microserfs

FRIDAY

Early Fall, 1993

This morning, just after 11:00, Michael locked himself in his office and he won't come out.
Bill (Bill!) sent Michael this totally wicked flame-mail from hell on the e-mail system-and he just wailed on a chunk of code Michael had written. Using the Bloom County-cartoons-taped-on-the-door index, Michael is certainly the most sensitive coder in Building Seven-not the type to take criticism easily. Exactly why Bill would choose Michael of all people to wail on is confusing.
We figured it must have been a random quality check to keep the troops in line. Bill's so smart.
Bill is wise.
Bill is kind.
Bill is benevolent.
Bill, Be My Friend . . . Please!

Actually, nobody on our floor has ever been flamed by Bill personally. The episode was tinged with glamour and we were somewhat jealous. I tried to tell Michael this, but he was crushed.
Shortly before lunch he stood like a lump outside my office. His skin was pale like rising bread dough, and his Toppy's cut was dripping sweat,
leaving little damp marks on the oyster-gray-with-plum highlights of the Microsoft carpeting. He handed me a printout of Bill's memo and then gallumphed into his office, where he's been burrowed ever since.
He won't answer his phone, respond to e-mail, or open his door. On his doorknob he placed a "Do Not Disturb" thingy stolen from the Boston Radisson during last year's Macworld Expo. Todd and I walked out onto the side lawn to try to peek in his window, but his Venetian blinds were closed and a gardener with a leaf blower chased us away with a spray of grass clippings.
They mow the lawn every ten minutes at Microsoft. It looks like green Lego pads.



Das neue Layout


  • Oben der Frame top mit der statischen Datei /design/top.html
  • Darunter die Navigationsleiste mit dem Frame nav und der Datei nav.html
  • Schließlich der Hauptframe main mit der Startdatei main.html


  • Die Hauptmenüpunkte bleiben die ganze Zeit sichtbar und zugänglich.
  • Das seitliche Menü ändert sich nicht mehr nur wenn ein Verzeichnis gewechselt wurde. Jeder Sprung zu einer anderen Seite wird im seitlichen Menü angezeigt.
  • Großer Gewinn an Raum und  Übersichtlichkeit.
  • Künftige Umstellungen im Design werden erleichtert.
alle
menu.txt
menu.txt hier

Steinheim
am Albuch
Home  Die Gemeinde Tourismus Vereine&Kirchen ...

Irgendeine Überschrift


  • Startseite
  • Aktuelles
  • Termine
  • Gruppen
    • Gruppe 1
    • Gruppe 2
    • Gruppe 3

Microserfs

FRIDAY

Early Fall, 1993

This morning, just after 11:00, Michael locked himself in his office and he won't come out.
Bill (Bill!) sent Michael this totally wicked flame-mail from hell on the e-mail system-and he just wailed on a chunk of code Michael had written. Using the Bloom County-cartoons-taped-on-the-door index, Michael is certainly the most sensitive coder in Building Seven-not the type to take criticism easily. Exactly why Bill would choose Michael of all people to wail on is confusing.
We figured it must have been a random quality check to keep the troops in line. Bill's so smart.
Bill is wise.
Bill is kind.
Bill is benevolent.
Bill, Be My Friend . . . Please!

Actually, nobody on our floor has ever been flamed by Bill personally. The episode was tinged with glamour and we were somewhat jealous. I tried to tell Michael this, but he was crushed.
Shortly before lunch he stood like a lump outside my office. His skin was pale like rising bread dough, and his Toppy's cut was dripping sweat,
leaving little damp marks on the oyster-gray-with-plum highlights of the Microsoft carpeting. He handed me a printout of Bill's memo and then gallumphed into his office, where he's been burrowed ever since.
He won't answer his phone, respond to e-mail, or open his door. On his doorknob he placed a "Do Not Disturb" thingy stolen from the Boston Radisson during last year's Macworld Expo. Todd and I walked out onto the side lawn to try to peek in his window, but his Venetian blinds were closed and a gardener with a leaf blower chased us away with a spray of grass clippings.
They mow the lawn every ten minutes at Microsoft. It looks like green Lego pads.

Die Seite(n) im Frame main





Breite=150 Pixel

Überschrift

Breite=50 Pixel
Seitliches Menü
Seiteninhalt

(...

The term Virtual Host refers to the practice of maintaining more than one server on one machine, as differentiated by their apparent hostname. For example, it is often desirable for companies sharing a web server to have their own domains, with web servers accessible as www.company1.com and www.company2.com, without requiring the user to know any extra path information.

Apache was one of the first servers to support IP-based virtual hosts right out of the box. Versions 1.1 and later of Apache support both, IP-based and name-based virtual hosts (vhosts). The latter variant of virtual hosts is sometimes also called host-based or non-IP virtual hosts.

Below is a list of documentation pages which explain all details of virtual host support in Apache version 1.3 and later. ... )

Rechter Rand
Platz für weitere Informationen
Fußzeile: Informationen über Autor, letzte Änderung, usw.


Block
Kennzeichnung
Erklärung
Head
<!-- %%HEAD START%% -->
und
<!-- %%HEAD END%% -->
In diesen Block werden Informationen über die Datei (sog. META-Tags) eingetragen. Alles was im Kopfbereich einer HTML-Datei steht, wird nicht angezeigt.
Dieser Block ist auch ein guter Platz, um Javascript-Code unterzubringen.
Headline
<!-- %%HEADLINE START%% -->
und
<!-- %%HEADLINE END%% -->
In diesem Block wird die Überschrift eingetragen. Gestaltung frei.
Menu
<!-- %%MENU START%% -->
und
<!-- %%MENU END%% -->
Hier wird das seitliche Menü eingefügt. Normalerweise steht hier nur der Aufruf
<!--#exec cgi="/cgi-bin/menu.cgi" --> . Für die PHP-Seiten gibt es eine PHP-Klasse, die dasselbe macht (SSI funktioniert auf Seiten mit der Endung .php nicht).
Content
<!-- %%CONTENT START%% -->
und
<!-- %%CONTENT END%% -->
Der eigentliche Seiteninhalt. Hier kann beliebiger Text eingefügt werden. Sollen Hintergrundbilder verwendet werden, dann möglichst nur als Hintergrund der zugehörigen Tabellenzelle
Right
<!-- %%RIGHT START%% -->
und
<!-- %%RIGHT START%% -->
Der rechte Block. Auch dieser Block steht zur freien Verfügung. Hier kann z.B. ein Terminkalender oder ähnliches eingefügt werden.
Foot
<!-- %%FOOT START%% -->
und
<!-- %%FOOT END%% -->
Die Fußzeile. Die 3 Spalten wurden zusammengefasst. Ich habe in diese Zeile das Datum der letzten Änderung und den Autor eingebaut. Man könnte auch einen Hit- Zähler, Countdown, Laufschrift oder sonstewas einbauen.


Was geändert werden muss

  1. Am besten den ganzen Ordner als lokale Kopie vom Server runterkopieren.
  2. Einen neuen Ordner für die aktualisierten Dateien anlegen.
  3. Die Dateien index.html und nav.html in diesen Ordner kopieren. 
  4. Die Seiten auf die neue Aufteilung umstellen:
    1. Die Vorlage öffnen und gleich unter dem Namen der Seite, die aktualisiert werden soll im neuen Ordner speichern.
    2. Im Headline-Block die Überschrift ändern/einfügen.
    3. Im Content Block den Inhalt (im Prinzip alles zwischen den Body-Tags) der alten Seite einfügen.
    4. Nach Belieben einen rechten Block erstellen.
    5. Die Fußzeile ändern.
  5. Die Datei menu.txt erstellen. Wie das geht, erfahrt Ihr hier.
  6. Das Ganze auf den Server laden und 3 mal umrühren.
  7. Das Ergebnis mit einer Piña Colada (oder angesichts der Jahreszeit mit einem Glühwein) geniessen oder
  8. sich an die Fehlersuche machen.
ActiveState

Die Datei menu.txt


Wie bereits erwähnt soll die Datei menu.txt festlegen, wie das seitliche Menü auf den Seiten in eurem Verzeichnis aussehen soll. Die Datei ist eine reine Textdatei, was bedeutet, dass man sie am besten mit dem Notepad oder einem anderen Texteditor anlegt.
Jede Zeile der Datei steht für einen Eintrag im seitlichen Menü. Dabei steht am Anfang der Zeile der Text, wie er später im Menü erscheinen soll. Nach einem Komma als Trennzeichen folgt die Datei, auf die der Menüeintrag später zeigen soll. Möglich sind hier folgende Einträge:

  • normale Dateien: .html  .htm .php  ...
  • Dateien mit Pfad: /verein/drkstein/index.html  /steinheim/schwaebisch.html  ...
  • Externe Links: http://www.drk.de  www.wahnkauf.de ftp://ftp.fh-heilbronn.de ...
  • Anker: #Kap1   #kap2  #kap3  ...
_top

Als Beispiel wähle ich einfach mal die menu.txt meiner eigenen Seiten der evangelischen Kirchengemeinde. Diese sind bereits komplett auf das Design umgestellt und man kann jederzeit nachschauen.
Ich beginne zunächst mit den Hauptkategorien: Startseite, Aktuelles, Gruppen und Kreise, Jugend, Informationen, Links und Gästebuch. Dies ergibt folgende Einträge in menu.txt:

Startseite,main.php
Aktuelles,eka.html
Gruppen und Kreise,ekg.html
Jugend,ekj.html
Informationen,eki.html
Links,ekl.html
G&auml;stebuch,gbook.php

Wie Ihr seht, ist es wichtig, die deutschen Sonderzeichen bei den Menüeinträgen zu beachten.
Von diesen Hauptkategorien aus gibt es noch verschiedene Untermenüs. Ein Eintrag im Untermenü hat genau den gleichen Aufbau wie im Hauptmenü bis darauf, dass er mit einem Tabulator (Die Taste TAB oder  |-> ) eingerückt ist. Es ist extrem wichtig, dass die Untermenüs mit Tabulatoren eingerückt ist, da das Script sonst nicht funktioniert!
Mit dem ersten Untermenü sieht die Datei menu.txt jetzt so aus:

Startseite,main.php
Aktuelles,eka.html
    Kirchenwahl 2001,wahl2001.html
    Gemeindebrief Juli 2001,brief_0107.html
Gruppen und Kreise,ekg.html
    Ch&ouml;re,ekc.html
    come together,come.html
Jugend,ekj.html
    Aktuell,ekja.html
    Gruppen,ekjg.html
    Freizeiten,ekjf.html
    Informationen,ekji.htm
Informationen,eki.html
Links,ekl.html
G&auml;stebuch,gbook.php

Auch ein Untermenü kann natürlich weitere Untermenüpunkte enthalten. Diese werden mit einem weiteren Tabulator eingerückt.
Mit allen Untermenüs sieht die Datei menu.txt so aus:

Evangelische Kirchengemeinde,main.php
Aktuelles,eka.html
    Kirchenwahl 2001,wahl2001.html
    Gemeindebrief Juli 2001,brief0107.html
Gruppen und Kreise,ekg.html
    Ch&ouml;re,ekc.html
        Posaunenchor,ekcp.html
        Kirchenchor,ekck.html
    come together,come.html
        Jetzt mal ehrlich,come1.html
Jugend,ekj.html
    Aktuelles,ekja.html
    Gruppen,ekjg.html
    Freizeiten,ekjf.html
        Dorffreizeit,http://www.dorffreizeit.de
        Zeltlager,ekjfz.html
            Bilder 2001,zl2001.php
    Informationen,ekji.html
Informationen,eki.html
Links,ekl.html

Das Script das später die Menüs auf den Seiten generiert, achtet auch darauf, das immer die passenden Untermenüs geöffnet sind. Wird in unserem Beispiel die Seite Jugend geöffnet, so wird darin das erste Untermenü dieser Seite geöffnet. Alle anderen Untermenüs bleiben geschlossen.

Design Vorgaben


  1. Der Aufbau der Seite mit den Blockmarken sollte (nach Möglichkeit) beibehalten werden.
  2. Das seitliche Menü sollte auf allen Seiten gleich aussehen, damit sich die Besucher unserer Seiten immer zurechtfinden.
  3. Das Stylesheet /design/global.css oder eine erweiterte Kopie desselben sollte verwendet werden. Dieses Stylesheet legt u.a. auch fest, wie das seitliche Menü aussieht ( Siehe Regel 2).
  4. That's all, folks!

Epilog

Code Red

Letzte Änderung: durch Achim Dumberger