Listennavigation - Ordner & Unterordner Design, Unterschiedliche Gestaltung von Ordnern und Unterordnern Einstellungen

[fidg]

Hallo

Wie stelle ich in der Listennavigation die Ordner und Unterordner und Seiten unterschiedlich dar ?

- Hauptordner haben ein Design mit Bild
- Unterordner sollen ein anderes Design haben um klar unterschieden werden zu können
(hier schon mit einem leichten Einzug probiert, doch das Bild wird mitverschoben -> sieht sche..... aus)
in einem Hauptordner können verschiedene Unterordner sein
- Seiten wieder anders dargestellt

Hier findet Ihr die Baustelle: www.adola.com

Schaut bei "Home" und "Produkte" Die anderen Ordner und Seiten geben noch nicht soviel her.
Vor allem bei "Produkte" kann man die Unterordner nicht vom Hauptordner unterscheiden.
Die einzelnen Seiten sind dann schon was besser.

Wie gesagt, noch eine Baustelle und auch manch anderes ist noch am werden.


Gruss us drrr Schwiiiz
fidg

Der Beitrag wurde von fidg bearbeitet: Thu. 15. March 2007, 19:26

[alexander]

Die Listennavigation heißt deshalb Listennavigation, weil diese mit ungeordneten Listen arbeitet und nicht mit geschachtelten DIVs.

Das ist also ein reine CSS Thematik und hat nix mit dem Modul an sich zu tun. Ich empfehel dir mal bei einer Website wie Listamatic vorbei zu surfen und dir mal anzusehen wie man eine solche Listennavigation macht.

[fidg]

Da meine Vorbildung in CSS leider beschränkt ist wie die geographische Ausdehnung der Schweiz hab ich ein Berg voller Code ausprobiert und bin leider nicht draufgekommen wie das geht.
Der Tipp mit

Das ist also ein reine CSS Thematik und hat nix mit dem Modul an sich zu tun. Ich empfehel dir mal bei einer Website wie Listamatic vorbei zu surfen und dir mal anzusehen wie man eine solche Listennavigation macht.

war zwar sehr lehrreich. Für meinen Fall sieht es aus als ob man eine Tabelle mit einem Haufen

CODE

<ul><ul><ul>
<li><li><li><li>
</li></li></li></li>
</ul></ul></ul>

Das ganze lösen kann.

Die Frage ist nun, wie bring ich Sefrengo bei, dass dieses weiss, welche Stufe von Ordnern und Unterordnern gemeint ist.

Oder verwende ich das falsche Modul, um eine Navigation mit Bildern zu machen?

Hier ist die Baustelle : www.adola.com

Was ist im Template der Listennavigation mit "Verfolgter Ordner" gemeint ?


gruss us dr Schwiiiz und merci
fidg

[luxli]

Da meine Vorbildung in CSS leider beschränkt ist wie die geographische Ausdehnung der Schweiz...

... mit Weitblick über den See bis nach Zürich und Rapperswil, das ist ja nur eine kleine Beschränkung

Ich weiss nicht ob ich dich richtig verstehe aber versuchs doch mal mit {depth}

das sieht bei mir so aus:

QUELLTEXT

Ebene:
<ul>{layer}</ul>
Seite:
<li><a class="ebene{depth}" href="{link}">{name}</a></li>
Aktuelle Seite:
<li class="aktuell"><a class="ebene{depth}">{name}</a></li>
Ordner:
<li><a class="ebene{depth}" href="{link}">{name}</a>{folder}</li>
Aktiver Ordner:
<li class="aktuell"><a class="ebene{depth}">{name}</a>{folder}</li>

Dazu brauchst nur noch die gewünschte CSS für jede Ebene

und das cha jo nid so schwär sy

[alexander]

Die Frage ist nun, wie bring ich Sefrengo bei, dass dieses weiss, welche Stufe von Ordnern und Unterordnern gemeint ist.

was willst du SF beibringen? du musst das deinem Stylesheet beibringen. angenommen ich habe folgende Liste

QUELLTEXT

<ul class="navi">
  <li>Ebene1</li>
  <li>Ebene1
      <ul>
          <li>Ebene2</li>
          <li>Ebene2</li>
      </ul>
  </li>
  <li>Ebene1</li>
</ul>

dann kann ich die erste ebene im css mit

QUELLTEXT

ul.navi li { /* Formatierung */ }

und die zweite ebene mit

QUELLTEXT

ul.navi li ul li { /* Formatierung */ }

erreichen und formatieren. das spiel kannst du beliebig tief fortführen. auch für die umschließenden <ul> tags. hat also nix mit SF zu tun, sondern nur mit HTML/CSS

[saschapi]

Gute Erklärung von Alexander! In diesem Zusammenhang sei auch noch mal auf Alexanders Tip weiter oben "Listamatic" verwiesen. Das hilft beim Lernen des Umgangs mit Listen und Stylesheets!!!

[Uliwe]

QUELLTEXT

<ul class="navi">
        <li>Ebene1</li>
        <li>Ebene1
            <ul>
                <li>Ebene2</li>
                <li>Ebene2</li>
            </ul>
        </li>
        <li>Ebene1</li>
      </ul>

Wie bekomme ich das denn mit der Listen-Navi hin, dass ich in der 1. Ebene z. B. ein <ul id="irgendas"> habe und in den tieferen Ebenen lediglich ein <ul>? Ist das überhaupt möglich?

Gruß,
Ulrich

Der Beitrag wurde von Uliwe bearbeitet: Wed. 22. August 2007, 15:23

[andi]

hallo ulrich

funktioniert leider mit dem original nicht. du hast aber zwei möglichkeiten:

1. modifikation benutzen
2. ein umschliessendes div erstellen mit der id

gruss andi

[Uliwe]

Diese Modifikation kannte ich gar nicht. Prima Sache, läuft wunderbar. Danke an Dich, andi, und natürlich auch an STam! . Wäre wirklich schön, wenn diese Funktion(en) in einer späteren Version der Listen-Navi erhalten bliebe(n).

Grüße,
Ulrich.