Alternatives Menü bei Beepworld  

Wieso ein alternatives Menü? Das Problem von Flash und Javascript, mit dem viele Menüs aufgebaut sind, ist, dass nicht jeder User sie im Browser angezeigt bekommt. Die Ursachen können sehr vielseitig sein. Doch gerade bei so wichtigen Dingen wie einem Menü ist das fatal, da die betroffenen Seitenbesucher keine Chance zum Navigieren haben.
Um dieses Problem zuverlässig zu lösen, ohne auf das Flash- oder Javascript-Menü zu verzichten, sollte man ein alternatives Menü bereitstellen.

* * * * * * * * * * * * * * * * * * * *

Bei Frameset-Designs ist es ganz einfach, ein alternatives Menü als HTML-Datei zu erstellen und in die Dateiverwaltung hoch zu laden. Beim normalen freien Design ist es schwieriger, da das Menü nicht vom Seiteninhalt getrennt ist.

Zuerst mal das alternative Menü für Framesets:

Zuers braucht man den Quellcode für die HTML-Datei, die als Seite für das alternative Menü dient. Die Stellen die angepasst werden müssen, sind mit Sternen (*****Text editieren*****) markiert. Den Text mit den Sternen sollte durch den gewünschten Titel, URL oder Text ersetzt werden.
Hier schon mal der Quellcode für das alternative Menü, der nur noch angepasst und ergänzt werden muss.

Den hier kopierten und angepassten Quellcode musst du auf eine Textdatei mit der Endung txt (Notepad / Windows Editor) einfügen...
(Windows: Start > alle Programme > Zubehör > Editor)
...und dann als menu.htm auf dem Rechner speichern. Zum Speichern des Quelltextes Auf keinen Fall Word verwenden, das ist absolut ungeeignet!
Diese Datei kannst du dann so wie sie ist mit der Endung .htm in deine Memberdateien (Dateiverwaltung) hochladen.

Jetzt musst du noch die normale Menüframe Seite mit dem Link zum alternativen Menü ergänzen.
Dazu in der Seitenverwaltung die Seite frameset_menü oder frameset_menü_links (je nach verwendetem Frameset) im Editor zum Bearbeiten öffnen.
Dort einen beliebigen Linktext schreiben, diesem Text markieren und dann mit der Funktion Link einfügen des Editors verlinken. Verlinken musst du mit URL (bei "Protokoll" <anderes> wählen) und dort fügst du ./files/menu.htm in das Textfeld für die URL ein.

Hier noch eine Kleine Hilfe, mit was welcher zu editierende Text ersetzt werden sollte:

*****Linktext***** Hier einfach den gewünschten Text, den du für den Link (Menüpunkt) haben möchtest, wie beispielsweise Home.

*****URLzurSeite***** URL für die Links. Hier wirklich nur die Sterne und das URLzurSeite ersetzen, der Schrägstrich mit den zwei vorangestellten Punkten (../) und das htm mit dem vorangestellten Punkt (.htm) muss für Links zu Unterseiten unbedingt stehen bleiben (siehe relative Pfade). Ersetzt wird nur das *****URLzurSeite***** und zwar durch den Seitennamen der Unterseite in der Seitenverwaltung. Heisst die Seite uebermich, sollte danach also ../uebermich.htm dort stehen.
Soll der Beispiel-Link jedoch durch eine externe URL ersetzt werden, muss auch der Schrägstrich mit den zwei Punkten (../) entfernt werden und falls nötig auch die Endung .htm ersetzt oder ergänzt. Das gilt auch für den Link zu den Modulen.
Willst du einen Link zu deiner eMailadresse machen, dann musst du das ../ durch mailto: ersetzen und das .htm entfernen und bei *****URLzurSeite***** schreibst du dann deine eMailadresse hin. Beim eMail-Link sollte zusätzlich auch das target="mainframe" entfernt werden.

Im angebotenen Quelltext sind ein paar Beispiele vorhanden...

Achtung! Für den Zurücklink zur Home bitte folgendes beachten:
Die Startseite/Home heisst nicht wie oft irrtümlich angenommen index, sondern frameset_inhalt (siehe 1. Link-Beispiel im Quelltext)!
Die Seite wird zwar als Index/Startseite in der Seitenverwaltung aufgeführt, der wirkliche Name ist aber frameset_inhalt...

*****HintergundFarbe***** Hier musst du einen sechsstelligen Farbcode mit Raute davor (HEX-Code, für Schwarz wäre das beispielsweise #000000) einfügen, den du als Hintergundfarbe möchtest. Falls du für deine Webseite unter "Design" eine Hintergundfarbe definiert hast, musst du unter "Bereich 1" und "Hintergundfarbe" den richtigen Farbcode nachschauen.
Natürlich könntest du auch eine andere Farbe verwenden, falls du das möchtest.
Um zu der gewünschten Farbe den entsprechenden HEX-Code zu ermitteln, einfach diesen Farbengenerator verwenden!

*****Hintergund-Bild***** Hier kommt die URL zum Hintergrundbild hin. Hast du unter "Design" ein Hintergundbild aus den vorgegebenen Beispielen von Beepworld ausgewählt, kannst du die URL zum Hintergundbild aus dem Quelltext der normalen frameset_menu herauslesen, hast du eine URL zu einem anderen Hintergundbild angegeben, kannst du diese bei "Bereich 1" im Feld "Hintergundbild" kopieren. Natürlich könntest du wie für die Farbe auch ein anderes Bild für den Hintergund verwenden, falls du das möchtest.

*****Textfarbe***** Hier musst du einen sechsstelligen Farbcode mit Raute davor (HEX-Code, für Schwarz wäre das beispielsweise #000000) einfügen, den du als Textfarbe möchtest. Falls du für deine Webseite unter "Design" eine Textfarbe definiert hast, musst du unter "Bereich 1" und "Textfarbe" den richtigen Farbcode nachschauen. Natürlich könntest du auch eine andere Farbe verwenden, falls du das möchtest.

*****Linkfarbe***** Hier musst du ebenfalls einen sechsstelligen Farbcode/HEX-Code (siehe Textfarbe und Hintergundfarbe) verwenden, den du als Linkfarbe möchtest. Auch hier hast du die freie Wahl, ob du die selbe Farbe wie im "Bereich 1" bei "Linkfarbe" haben möchtest, oder eine ganz andere Farbe.
Es gibt drei Linkfarben, eine für normale Links (a:link), eine für Links die du bereits besucht hast (a:visited) und einen für den aktiven Link (a:active), das ist ein Link den man soeben angeklickt hat. Im Homepagebereich können diese drei Links leider nicht unterschiedlich gefärbt werden, im kopierten Quellcode jedoch kannst du für jeden der Drei eine andere Farbe wählen.

Bei <!-- ***** Infotext ***** ---> handelt es sich um Kommentare, die du so im Quellcode belassen kannst. Sie dienen für dich zur Info und zur besseren Orientierung im Quellcode, auch falls du später mal Ergänzungen oder Änderungen anbringen möchtest.

Dieses Tutorial ist ein Service von...  

Banner meinbeepweb