Navigation mit Drop Down Effekt ab Ebene zwei!

Drei Ebenen ( Drop down ) Menue unter Verwendung von Nice Menues und der "active-trail" Klasse! Nicht nur Drupal ( Ein Open Source Content Management System ( CMS ) und Community Framework ) Anfänger stellt ein Menue, das eine "statische erste Ebene" hat und ab der zweiten Ebene mit den bekannten Superfish Effekten als Dropdown arbeitet, oft vor Schwierigkeiten in der Umsetzung.

Wie man eine derartige Navigation, die von vielen großen Portalen eingesetzt wird mit Drupal Bordmitteln und einigen Zusatzmodulen realisieren kann, möchte ich in diesem Tutorial aufzeigen.
Um das Tutorial nachbauen zu können, sind keine tiefergehenden Kenntnisse erforderlich. Es fällt aber sicherlich leichter, wenn man den grundsätzlichen Umgang und Basic Kenntnisse im Theming für Drupal bereits kann.

Bei diesem Beispiel werden eingesetzt:

  • Drupal 6.x
  • Pathauto Modul
  • Token Modul
  • Nice Menus Modul
  • Framework Theme ( Ein Theme ist bei Drupal die Bezeichnung für eine Designvorlage. Bei Wordpress spricht man beispielsweise von Templates. )

Pathauto und Token werden benötigt, um zum lesbare Pfade zu realisieren, die dann in der Blockverwaltung hinsichtlich der Sichtbarkeit der Blöcke zum Einsatz kommen. Das Nice Menu Modul sorgt für die Dropdown Effekte, die wir ab der zweiten Ebene erhalten wollen und das Framework Theme ist ein einfaches Theme, das leicht zu verstehen ist. Meiner Meinung nach ein ideales Einsteigertheme.

Module und Themes in die Drupal Seite einfügen

Los gehts mit dem Download und dem Extrahieren der Module Pathauto, Token und Nice Menus nach ../sites/default/modules und Download und Extraktion des Framework Theme nach ../sites/default/themes. Wenn Die Installation von Drupal noch "jungfräulich" sein sollte, dann müssen die beiden Ordner modules und themes unter ../sites/default erst angelegt werden, wie auch in der dort befindlichen readme.txt nachzulesen ist!

Anpassen des Themes

Nach dem Download des Themes und dem Extrahieren sind drei Anpassungen des Framework Theme für unser Vorhaben von Nöten. Eine kleine Änderung in der style.css ( Cascading Style Sheets CSS ... eine Sprache für strukturierte Dokumente. Sie wird vor allem zusammen mit HTML und XML eingesetzt und legt fest, wie Inhalte oder Bereiche dargestellt werden sollen. ) um die aktiven Links besser unterscheiden zu können und eine Anpassung der page.tpl.php um unsere "Nice Menues" anstelle der "Secondary Links" im Theme auszugeben.

In der style.css ergänzen wir die Zeile 115 so daß dort dann zwischen den Zeilen 115 und 127 folgendes steht:

Die Datei framework.info ergänzen wir um eine Region indem wir die Zeile regions[nicemenue] = Nice Menue bei den Regionen ergänzen.

Zuletzt muss die Region noch in der page.tpl.php eingefügt werden. Die Anweisung für die Secondary Links wird aus dem "nav" Bereich entfernt und anstelle dessen die eben angelegte Region eingefügt. Die Zeilen 39 bis 55 sollten nun wie folgt aussehen:

Hat Dir der Artikel gefallen? Eine Empfehlung kostet nur einen Klick!

Bild von Thoor

Verfasst von Thoor

Thomas Ortner ... ist seit 1996 Webworker und Herausgeber mehrerer Internetangebote. Von der Planung, über Programmierung, Design, SUMA Optimierung und Marketing realisiert THOOR komplette Internetangebote.

0 Kommentare zu "Navigation mit Drop Down Effekt ab Ebene zwei!"

THOOR freut sich über jeden neuen Kommentar. Möchtest Du einen Kommentar eintragen?

Kommentar schreiben

Der Inhalt dieses Feldes wird nicht öffentlich zugänglich angezeigt.
CAPTCHA
Diese Abfrage testet ob du wirklich ein Mensch bist und versucht SPAM auszuschliessen.
Bild-CAPTCHA
Gib die angezeigten Zeichen ein.

Wer ist online

Zur Zeit sind 0 Benutzer und 2 Gäste online.