Schritt 1: Inhalte anlegen

Die Abbildung zeigt, dass die bestehende Website bereits verschiedene Ordner mit Webseiten enthält. Innerhalb Ihrer Webseite können Sie so viele Seiten erzeugen wie Sie möchten. Wenn Sie etwas Ordnung hineinbringen wollen, verwenden Sie am besten Unterordner. Durch Ordner können Sie ähnliche Webseiten gruppieren.

Ordner anlegen können Sie über das Kontextmenü Ihrer Website (rechte Maustaste drücken).

Schritt 2: Definieren der Navigationsstruktur

Damit sich die Benutzer Ihrer Website einfach durch die verschiedenen Webseiten navigieren können, müssen sie festlegen, wie diese Webseiten heißen und wo sie genau innerhalb Ihrer Website liegen.

Als erstes öffnen Sie den Dialog zum Hinzufügen eines neuen Elementes.

Diesen Dialog können Sie mit Hilfe der Menüleiste (siehe Abbildung) oder über das Kontextmenü der Website aufrufen.

Wählen Sie aus dem Dialog „Site-Übersicht“ aus und belassen den Namen „Web. sitemap“.

Anschließend wird Ihrer Website eine neue Site-Übersicht hinzugefügt und direkt geöffnet.

Schritt 3: Site-Übersicht Einführung

Die Site-Übersicht ist eine einfache XML-Datei. Innerhalb von XML-Dateien werden Daten immer in sogenannten Knoten beschrieben. Diese Knoten können auch ineinander geschachtelt sein. Ein Knoten beginnt z.B. mit <knoten> und endet mit </knoten>.

Klicken Sie auf die Abbildung um den Code zu erhalten!

Ein Knoten, der keine weiteren Knoten beinhaltet, kann auch so geschrieben werden: <knoten />. Einzelne Werte sogenannte Attribute werden innerhalb der eckigen Klammer hinter den Namen des Knoten gesetzt. Innerhalb der Site-Übersicht gibt es nur <siteMapNode> -Knoten, die beliebig inneinander geschachtelt werden können. Jeder dieser Knoten kann über verschiedene Attribute konfiguriert werden. Die wichtigsten Attribute sind url, title und description.

Wenn Sie nun Ihre Navigationsstruktur definieren, müssen Sie als erstes einen Hauptknoten festlegen, in den die weiteren Unterknoten eingefügt werden müssen.

Klicken Sie auf die Abbildung um den Code zu erhalten!

Der Hauptknoten wird für über die drei aufgeführten Attribute url, title und description konfiguriert.

url
Das Attribut „url“ gibt an, wo sich die Webseite vom Startpunkt der Webseite aus befindet. In diesem Fall ist es die Seite „Default.aspx“ direkt im Hauptordner meiner Website. Wenn sich die Webseite allerdings in einem Unterordner befindet, muss dieser Unterordner mit angegeben werden, z.B. „~/Fotos/NewYork.aspx“.

title
Mit dem Attribut „title“ lässt sich der Webseite ein einfacher Titel zuweisen, z.B. „Fotos“ oder „Startseite“. In der späteren Menüansicht wird dieser Titel angezeigt.

description
Durch das Attribut „description“ lässt sich jedem Navigationseintrag auch eine Beschreibung mitgeben. Diese Beschreibung wird innerhalb der Menüansicht später als Tooltip angezeigt.

Schritt 4: Site-Übersicht erstellen

Ändert man nun die gegebene Ordnerstruktur in eine Navigationsstruktur, dann erhält man folgenden Code innerhalb der Web.sitemap.

Klicken Sie auf die Abbildung um den Code zu erhalten!

Nach dem Bearbeiten, die Datei unbedingt speichern.

Schritt 5: Einfügen eines SiteMapPath-Steuerelement in die Masterseite

Nachdem man die Struktur definiert hat, möchte man diese Struktur innerhalb eines Menüs auch auf jeder Webseite zur Verfügung haben. Dazu verwendet man am besten die Masterseite. Änderungen an der Masterseite wirken sich sofort auf alle Webseiten aus, die diese Masterseite verwenden.

Also öffnen wir eine bestehende Masterseite oder legen eine neue Masterseite an. In der Toolbox gibt es einen „Navigation“- Bereich. Innerhalb dieses Bereichs befinden sich drei Steuerelemente: SiteMapPath, Menu und TreeView.

Als Erstes ziehen wir das SiteMapPath-Control auf unsere Masterseite. Am besten unterhalb der Überschrift. Über den Smarttag- Wizard lässt sich das SiteMapPathControl auch direkt „Automatisch Formatieren“.

Das SiteMapPath-Control zeigt die aktuelle Position und die übergeordneten Seiten an.

Schritt 6: Einfügen eines Menüs

Über die Toolbox innerhalb des Navigation-Bereichs ziehen wir nun das Menü-Steuerelement auf unsere Masterseite.

Dabei öffnet sich wieder ein Smarttag-Wizard, der verschiedene Menü-Aufgaben anbietet. Mit der Aufgabe „Automatischer Formartierung“ lässt sich das Menü sehr leicht grafisch verschönern.

Diese Möglichkeit gibt es übrigens bei vielen Steuerelementen. Der Smarttag-Wizard lässt sich beliebig über das kleine weiße Rechteck rechts oben vom Menü auf– und wieder zuklappen.

Schritt 7: Datenquelle auswählen

Als nächstes müssen wir dem Menü nun mitteilen, welche Navigationsstruktur es anzeigen soll. Dies machen wir über den Smarttag- Wizard über „Datenquelle auswählen“. Zu Beginn ist noch keine Datenquelle definiert bzw. ausgewählt, daher wählen wir bei diesem Punkt „Neue Datenquelle“.

Anschließend erscheint der abgebildete Dialog „Assistent zum Konfigurieren von Datenquellen“. Dort wählen wir einfach „Sitemap“ aus. Man kann (muss aber nicht) eine ID für die Datenquelle angeben, der vorgegebene Name kann einfach übernommen werden.

Anschließend erscheint auf der Masterseite eine „SiteMapDataSource“ und das Menü zeigt den Titel für unsere Startseite an.

Schritt 8: Anpassen des Menüs

Über das Eigenschaftenfenster (es öffnet sich mit der Taste F4) , kann man das Menü noch weiter anpassen. Dafür muss man das Menü auf der Masterseite selektiert haben. Über die Eigenschaften lassen sich diverse Einstellungen machen, die vielleicht interessanteste ist die „Static Display Level“-Eigenschaft. Diese Eigenschaft ist standardmäßig immer mit „1“ vordefiniert. Diese Eigenschaft definiert die angezeigte Menütiefe. Setzt man diesen Wert auf „2“, so werden direkt zwei Hierarchieebenen des Menüs und nicht nur eine angezeigt.

Schritt 9: Einfügen eines TreeView-Menüs

Alternativ zu dem Menü-Control kann man auch ein TreeView-Control zur Dastellung einer Navigationsstruktur verwenden. Dazu zieht man ein TreeView-Control aus der Toolbox auf die Masterseite und setzt über den Smarttag-Wizard die Datenquelle auf die gleiche Datenquelle wie das Menü-Control.

Schritt 10: Herzlichen Glückwunsch

Herzlichen Glückwunsch, Sie haben nun richtig Struktur in Ihre Website gebracht. Wie Sie Ihrer Website ein fetziges Outfit verpassen zeigt Siegfried in "Masterseiten bauen", wie Sie die Besucher Ihrer Seite managen, erklärt Manfred in "Benutzerverwaltung".