Hauptnavigation horizontal

  • Okulus Okulus
    T3PO
    0 x
    9 Beiträge
    0 Hilfreiche Beiträge
    11. 03. 2009, 10:08

    Hallo zusammen,
    ich bin im Moment dabei mir eine Homepage mit Typo3 zu programmieren läuft soweit auch ganz gut, jedoch ich habe mich entschlossen eine Horizontale Navigation einzubauen. Hier ist mein Problem, ich weiß nicht wie ich sowas Programmieren kann und benötige etwas hilfe. Ich habe ausch schon ein paar foren durchgesucht auch Skripte gefunden, die in meine Richtung gehen aber sind auf meiner Homepage nicht gelaufen, warum auch immer.
    Ich habe mir das ganze so vorgestellt.

    Ebene 1 Ebene2 Ebene 3
    Untermenu 1
    Untermenu 2
    ....

    Sobald man über dem Button Ebene ist sollten die Untermenus erscheinen. Ich hoffe mir kann jemand helfen. Danke im Vorraus


  • 1
  • Julian.Hofmann Julian.Ho...
    Flash Gordon
    0 x
    3012 Beiträge
    125 Hilfreiche Beiträge
    11. 03. 2009, 10:24

    Hallo.

    Mir stellt sich etwas die Frage
    a) was Du bisher probiert hast?
    b) warum/was nicht geklappt hat?

    Eine Anleitung wäre z.B. http://www.mortox.de/typo3-tipps/typoscript-sammlung/dropdown-menue-mit-3-ebenen.html

    Viele Grüße
    Julian

  • Okulus Okulus
    T3PO
    0 x
    9 Beiträge
    0 Hilfreiche Beiträge
    11. 03. 2009, 10:36

    Hallo Julian,
    Erstmal danke für deine schnelle Antwort.
    Diese Seite hatte ich auch probiert gehabt aber nach dem Einbinden in meine Seite wurde nichts agezeigt, als wäre kein Template vorhanden. Mein Aufbau sieht so aus das ich den subpart ###HAUPTNAVIGATION### genannt habe, und alle templates aus einem Systemordner in das Haupttemplate lade.

  • Julian.Hofmann Julian.Ho...
    Flash Gordon
    0 x
    3012 Beiträge
    125 Hilfreiche Beiträge
    11. 03. 2009, 10:59

    Und dem Subpart hast Du das Menü (bzw. das entsprechende TS-Objekt) zugewiesen?

    Zeigt doch evtl. mal die (relevanten) TS-Teile. Sonst ist das mehr ein Herumraten...

  • Okulus Okulus
    T3PO
    0 x
    9 Beiträge
    0 Hilfreiche Beiträge
    11. 03. 2009, 11:09

    Also hier die Ausschnitte:

    [b]Html Template:[/b]

    <!-- ###HAUPT_NAVI### start-->
    <div id="mainnavcontainer">
    <ul>
    Navigation
    </ul>
    </div>
    <!-- ###HAUPT_NAVI### stop-->

    [b]Ts vom Haupttemplate[/b]

    page.10.subparts.HAUPT_NAVI < tmp.HAUPTNAVIGATION

    [b]TS HAUPTNAVIGATION im Systemordner[/b]

    temp.HAUPTNAVIGATION = HMENU
    temp.HAUPTNAVIGATION {
    excludeUidList = 0

    special = directory
    # Hier die Start-ID angeben
    special.value = 66

    wrap = <div class="menu"> | </div>

    # Hauptmenue
    1 = TMENU
    1 {
    wrap = <ul> | </ul>
    expAll = 1
    NO.ATagTitle.field = subtitle//title
    NO.wrapItemAndSub = <li> | </li>
    NO.stdWrap.prepend = COA
    NO.stdWrap.prepend.10.wrap = ~&nbsp; |
    IFSUB = 1
    IFSUB {
    wrapItemAndSub = <li> | </li>
    allWrap = | <!--<![endif]-->
    linkWrap = |<!--[if IE 7]><!-->
    ATagBeforeWrap = 1
    }
    ACT < .NO
    ACT = 1
    ACT.ATagParams = class=dropact
    ACTIFSUB < .IFSUB
    ACTIFSUB.ATagParams = class=dropact
    }
    2 = TMENU
    2 {
    wrap = <!--[if lte IE 6]><table><tr><td><![endif]--><ul> | </ul><!--[if lte IE 6]></td></tr></table></a><![endif]-->
    expAll = 1
    NO.ATagTitle.field = subtitle//title
    NO.wrapItemAndSub = <li> | </li>
    IFSUB = 1
    IFSUB {
    wrapItemAndSub = <li> | </li>
    allWrap = | <!--<![endif]-->
    linkWrap = |<!--[if IE 7]><!-->
    ATagBeforeWrap = 1
    ATagParams = class=drop
    }
    }

    3 < .2

    4 < .2

    }

    lib.demo_ts < temp.HAUPTNAVIGATION

    Das ist jetzt das Beispiel was du auch gepostet hast. nach den Einstellungen kommt keine Reaktion im FE. Am Cache liegt es auch nicht, den habe ich schon geleert.

  • Julian.Hofmann Julian.Ho...
    Flash Gordon
    0 x
    3012 Beiträge
    125 Hilfreiche Beiträge
    11. 03. 2009, 11:37

    Wenn Du Dich beim posten nicht vertippt hast, dann ist's logisch:

    [quote="Okulus"]
    (...)
    page.10.subparts.HAUPT_NAVI < tmp.HAUPTNAVIGATION
    (...)
    temp.HAUPTNAVIGATION = HMENU
    (...)
    [/quote]

    Du nimmst einmal tmp, einmal t[b]e[/b]mp... ;)

    Die Zeile kannst Du Dir sparen, da Du temp.HAUPTNAVIGATION direkt an den Subpart zuweist und daher kein lib-Objekt benötigst.
    lib.demo_ts < temp.HAUPTNAVIGATION

  • Okulus Okulus
    T3PO
    0 x
    9 Beiträge
    0 Hilfreiche Beiträge
    11. 03. 2009, 11:52

    Ok jetzt hab ich eine Aufzählung als Struktur für das Menu das css

    ul.menu, ul.menu ul {

    list-style-type: none;

    }

    ul.menu a {

    display: block;

    padding: 3px 10px 3px 10px;

    font-weight: normal;

    }

    ul.menu li {

    padding: 0;

    margin: 0;

    float: left;

    background-color: #FFF9E4;

    border:1px solid #26383D;

    height: 20px;

    }

    /* Für Unterpunkte keine Float-Eigenschaft */

    ul.menu ul li {

    float:none;

    background-color: transparent;

    }

    /* Links auf Unterpunkten sollen die Hintergrundfarbe ändern */

    ul.menu ul li.hover, ul.menu ul li:hover {

    background-color: #FFF9E4;

    }

    /* Zweite Ebene */

    ul.menu ul {

    margin:0;

    padding: 0;

    position: absolute;

    background-color: #26383D;

    border: 1px solid #FFF9E4;

    display: none;

    width: 180px;

    }

    /* Zweite Ebene anzeigen */

    ul.menu li.hover ul, ul.menu li:hover ul {

    display: block;

    }

    /* Dritte Ebene */

    ul.menu li.hover ul ul, ul.menu li:hover ul ul {

    display: none;

    margin-left: 160px; /* Breite eines Listenelements - Überlagerung */

    margin-top: -20px; /* Höhe eines Listenelements */

    }

    /* Dritte Ebene anzeigen */

    ul.menu li.hover ul li.hover ul, ul.menu li:hover ul li:hover ul {

    display: block;

    }

    /* Vierte Ebene */

    ul.menu li.hover ul li.hover ul ul, ul.menu li:hover ul li:hover ul ul {

    display: none;

    }

    /* Vierte Ebene anzeigen */

    ul.menu li.hover ul li.hover ul li.hover ul , ul.menu li:hover ul li:hover ul li:hover ul {

    display: block;

    }

    habe ich eingefügt zum Test, aber noch keine reaktion.
    [b]Verknüpfung vom CSS im Haupttemplate
    [/b]
    page.stylesheet = uploads/tf/main_01.css

    Wie muss ich da noch das Javascript einbinden? bzw ohne das java script müsste doch auch schon was zu sehen sein.

  • Julian.Hofmann Julian.Ho...
    Flash Gordon
    0 x
    3012 Beiträge
    125 Hilfreiche Beiträge
    11. 03. 2009, 12:25

    [quote="Okulus"]
    Wie muss ich da noch das Javascript einbinden?
    [/quote]Ähm, [i]liest[/i] Du auch Tutorials oder schnappst Du Dir nur schnell die Codeteile draus???

    Auch der JavaScript-Code muss wieder im Kopf eingefügt werden um die IE6-Kompatibilität zu gewährleisten. Da mich auch immer wieder Fragen erreicht haben, wie man denn dieses JavaScript im Kopf der TYPO3-Seite einbaut zeige ich hier eine einfache Möglichkeit, dies ganz simpel per TypoScript zu realisieren:
    (Quelle: [url=http://www.mortox.de/typo3-tipps/typoscript-sammlung/dropdown-menue-mit-3-ebenen.html#c453]mortox.de[/url])

  • Okulus Okulus
    T3PO
    0 x
    9 Beiträge
    0 Hilfreiche Beiträge
    11. 03. 2009, 12:36

    ich hatte das schon gelesen auch die entsprechenden zeilen in das TS zugefügt, jedoch ohne reaktion. Deshalb habe ich gefragt wie ich das einbinde, wie im Tutorial beschrieben in das TS eingefügt ist es.
    Im Moment sehe ich nur eine Stichwortliste als Menu.

  • SLAng SLAng
    Flash Gordon
    0 x
    2757 Beiträge
    0 Hilfreiche Beiträge
    12. 03. 2009, 18:06

    Bitte in Zukunft Code-Beispiele mit den bereitgestellten Codes des Forum formatieren. Diese stehen der Bequemlichkeithalber am oben Rand des zu bearbeitenden oder des neu zu verfassendes Beitrags zur Verfügung. Die erhöht die Lesbarkeit von Beipielen immens.

  • 1