Verschiedene Farbschemata in Navigation darstellen [Gelöst]

  • 0 x
    27 Beiträge
    0 Hilfreiche Beiträge
    21. 04. 2008, 16:28

    Hallo,

    ich habe die Frage schon vor ein paar Wochen in einem anderen Typo3-Forum gestellt, aber da hatte leider niemand eine Lösungsidee, deshalb noch ein Versuch hier:

    ich bin Typo3-Anfänger und arbeite mich gerade durch 2 Bücher zum Thema.
    Die meisten meiner anfänglichen Fragen finde ich darin beantwortet, zu einer habe ich bisher aber nichts gefunden, vielleicht kann mir hier jemand weiterhelfen:

    Die Seite, die ich mit Typo3 aufbauen möchte soll 5 Hauptbereich und einen "Allgemein"-Bereich haben, die alle eigene Farbschema haben. Jetzt möchte ich passend zum Farbschema in der dynamisch erzeugten Navigation bereits vor den Links zu den Seiten jeweils ein farbiges Icon haben, das die Farbe des jeweiligen Bereiches hat und auch vor den Links zu den Unterseiten erscheint, wenn man in einem Bereich ist (Aufklapp-Navi). Ein Beispiel als Grafik:

    [img]http://www.ps-wein.de/navi-beispiel2.gif[/img]

    Kann mir jemand sagen, wie ich das umsetzen kann?
    Klar ist natürlich, dass ich, um die Navi zu trennen nach Hauptnavigation und Sonstige Infos die einzelnen Unterseiten in der Navistruktur (Baum) unter der jeweiligen Seite anordnen muß. Es geht mir vor allem darum, wie ich den Seiten, wenn sie alle unter der Seite Hauptnavigation angeordnet sind unterschiedliche Icons geben kann.

    Wie ich mit CSS die Liste gestalte ist mir schon klar, aber das gilt dann ja für alle Links.
    Ich möchte ja aber irgendwie, dass ich der Box vor dem Link die Farbe geben kann ich Abhängigkeit von der Zielseite.
    Ich denke, wenn die Links immer "zugeklappt" bleiben würden, könnte das über optionSplit gehen, aber wenn dann ein Menu aufgelappt ist (wie im Beispiel beim Besuche einer Seite im "Bereich 4" gibt das ja Probleme, weil sich alles verschiebt.

    Vielen Dank vorab und Gruß,

    Torsten


  • 1
  • typo3tester typo3test...
    Jedi-Meister
    0 x
    260 Beiträge
    0 Hilfreiche Beiträge
    21. 04. 2008, 19:46

    Hallo Torsten,

    vielleicht hilft Dir mein Script weiter, wenn Du es etwas umwandelst:
    [TS]#Linkes Menue
    10= HMENU
    10.entryLevel=0
    10.1=TMENU
    10.1.expAll=1
    10.1.NO.doNotLinkIt=1
    10.1.NO.allWrap = <li class="topli">|</li>

    10.2=TMENU
    10.2.expAll=0
    10.2.collapse=0
    10.2.NO.allWrap = <li class="hop">|</li>
    10.2.NO.beforeImg=fileadmin/images/leer.gif
    10.2.NO.beforeROImg=fileadmin/images/kreis.gif
    10.2.NO.RO=1
    10.2.CUR = 1
    10.2.CUR.allWrap = <li class="hop">|</li>
    10.2.CUR.beforeImg=fileadmin/images/kreis.gif

    10.3=TMENU
    10.3.collapse=0
    10.3.NO.allWrap = <li class="hop1">|</li>
    10.3.NO.beforeImg=fileadmin/images/leer.gif
    10.3.NO.beforeROImg=fileadmin/images/kreis.gif
    10.3.NO.RO=1

    10.3.CUR = 1
    10.3.CUR.allWrap = <li class="hop1">|</li>
    10.3.CUR.beforeImg=fileadmin/images/kreis.gif
    [/TS]

    Für Dich entscheidend sind die Zeilen mit beforeImg.
    beforeImg gibt an, welches Bild vor dem Text-Link stehen soll.
    In meinem Fall habe ich im Normal-Zustand ein durchsichtiges Platzhalter-GIF "leer.gif" eingebaut. Das wird beim Rollover mit der Maus durch einen Kreis ersetzt.
    Im Zustand CUR (aufgerufene Seite) wird gleich der Kreis eingesetzt.

    Wenn Du unter die Zeile mit beforeImg nochbeforeImgLink=1 ergänzt, dann wird auch das Bild als Link gesetzt.

    Um Deine bunten Quadrate zu erreichen, müßtest Du also einfach auf jeder Ebene ein andersfarbiges Gif einbauen.
    Die Zeile mit beforeROImg kannst Du einfach weglassen, wenn kein Bildwechsel stattfinden soll bei MouseOver.

    Vielleicht gehts ja noch eleganter mit einem graphischen Menü.

    Mein Beispiel kannst Du hier angucken:
    http://www.berggenuss.de

    Gruß, Regina

    Meine V

  • 0 x
    27 Beiträge
    0 Hilfreiche Beiträge
    21. 04. 2008, 21:42

    Hallo Regina,

    vielen Dank.
    Aber so wie ich das verstehe, ist das nicht das, was ich suche.
    Bei Deinem Beispiel könnte ich unterschiedlichen Navi-Ebenen je nach Navigationstiefe verschiedene gifs geben, wenn ich das richtig sehe.

    Die Seiten
    Bereich 1
    Bereich 2
    ...
    Bereich 5

    Sowie
    Seite 1
    ...
    Seite 4

    lägen bei mir ja auf einer Ebene.
    Jeder Bereich soll aber ein eigenes Farbschema bekommen, dass schon in der Navi sichtbar wird, eben durch das Quadrat in der entsprechenden Farbe.

    Also nach dem Motto: Wenn [Linkziel]in [Bereich 1]liegt, dann soll gif1.gif vor den Link in der Navi erscheinen.
    Wenn [Linkziel]in [Bereich 2]liegt, dann soll gif2.gif vor den Link in der Navi erscheinen.
    Ich weiß nicht, wie ich das besser beschreiben soll.

    Oder habe ich bei Deinem Beispiel was falsch verstanden?

    Danke und Gruß,

    Torsten

  • SLAng SLAng
    Flash Gordon
    0 x
    2757 Beiträge
    0 Hilfreiche Beiträge
    21. 04. 2008, 21:47

    Warum legst du das kleine Bildchen nicht im Media-Feld der Seite ab und greifst dann in deinem Menü darauf zu.
    Sprich also Seiten Eigenschaften -> Seiten-Typ auf Erweitert stellen und dann das kleine Bildchen bei Dateien hochladen.

    Das Feld kannst du dann in deinem Menü auslesen lassen.
    Wie das geht kannst du auch in der Doku nachlesen, oder Google spuckt dir da auch jede Menge aus.

  • typo3tester typo3test...
    Jedi-Meister
    0 x
    260 Beiträge
    0 Hilfreiche Beiträge
    22. 04. 2008, 14:04

    Hi Torsten,

    Sorry, da hatte ich nicht aufgepasst.
    Klar, das funktioniert nur für unterschiedliche Ebenen.

    Aber das mit dem Media-Feld der Seite klingt ja interessant.
    Das werde ich auch gleich mal ausprobieren.

    Gruß, Regina

  • 0 x
    27 Beiträge
    0 Hilfreiche Beiträge
    07. 05. 2008, 11:49

    Hallo SLang,

    sorry für die späte Antwort, war leider etwas länger krank.

    Vielen Dank!
    Ohne jetzt bisher schon gezielt probiert zu haben (Zeitmangel, weil ich erst einmal alles wieder aufarbeiten muß), denke ich, dass was Du schreibst dürfte die Lösung für meine Frage sein.

    Gruß,

    Torsten

  • SLAng SLAng
    Flash Gordon
    0 x
    2757 Beiträge
    0 Hilfreiche Beiträge
    07. 05. 2008, 21:49

    Jo, funktioniert bestens... Habs gerade heute erst umgesetzt:

    [TS]NO {
    wrapItemAndSub = <li>|</li>
    ATagParams = class="Second_NO"
    stdWrap {
    prepend = IMAGE
    prepend {
    file {
    maxH = 14
    maxW = 21
    import = uploads/media/
    import {
    listNum = 0
    override.field = media
    }
    }
    }
    }
    }[/TS]

    [img]http://www.leitstelle-paderborn.de/fileadmin/downloads/multimedia/menu.jpg[/img]

  • 0 x
    27 Beiträge
    0 Hilfreiche Beiträge
    07. 05. 2008, 22:44

    Hallo,

    super! Genau so habe ich mir das vorgestellt!

    Vielen Dank und Gruß,

    Torsten

  • 1