[TYPO3] Untermenüeinträge im Template unterbringen?

preko

preko

Erfahrenes Mitglied
Hi,

ich habe folgendes CSS-basierendes Template für eine Website:
Code: 
# Seitenobjekt anlegen
Seite = PAGE
Seite {

	# CSS Datei zuweisen 
		stylesheet = fileadmin/template/text.css
		typeNum = 0

	# Das Imageobjekt für das Logo
		10 = IMAGE
		10 {
			file = fileadmin/template/images/weblogo.gif
			altText = Logo Grafik
			titleText = Dies ist die Logo Grafik
			wrap = <div id="logo_container"> | </div>
			}

	# Die Navigation
		20 = HMENU
		entryLevel = 0
		20 {
			wrap = <div id="navig"><ul> | </ul></div>
			1 = TMENU
                                                1.expALL = 0
			1.NO.linkWrap = <li> | </li>
			}

	# Dem Objekt den Inhalt aus der Spalte Normal zuweisen
		30 < styles.content.get
		30.wrap = <div id="content"> | </div>
                                	

	# Dem Objekt den Inhalt aus der Spalte Rand zuweisen 
		40 = IMAGE
		40 {
			file = fileadmin/template/images/impressum.jpg
			altText = Impressum
			titleText = Impressum
			wrap = <div id="content_border"> | </div>
			}

Nun möchte ich ein "Unter-" Menü unterbringen, welches mir die 2. Linkebene etwas eingerückt darstellt.

Ich habe nun auch eine Möglichkeit gefunden dies wohl umzusetzen und zwar wie folgt:
Code: 
# Das Untermenü erstellen
  UNTERMENÜ = HMENU
  UNTERMENÜ {
            special = directory
            special.value = 19
            1 = TMENU
            1.NO = 1
            1.NO.linkWrap = &nbsp;|
            }

Doch wo genau im oberen Template muß ich die zweiten Codezeilen einfügen? Muß die Unternavigation mit in die "Hauptnavigation" unter Punkt 20 eingebettet werden und wenn ja, wie? :confused:

Beste Grüße,
preko
 
Willst du 2 Menüs haben oder ein Menü mit 2 Leveln? Wenn du 2 Menüs willst musst du 2 marker im Template setzen. Wenn du ein 2 Level Menü willst kannst du das einfacher haben:

Code: 
temp.mainmenu = HMENU
temp.mainmenu.entryLevel = 0
temp.mainmenu.1 = TMENU
temp.mainmenu.1{
    expAll = 1
    noBlur = 1
    wrap = <ul class="navigation">|</ul>

    NO = 1
    NO{
        linkWrap = <li>|</li>
        ATagParams = class="linkLevel1"
    }

    IFSUB = 1
    IFSUB{
        linkWrap = <li>|
        ATagParams = class="linkLevel1"
    }
}


# AB HIER CODE FÜR DIE 2te EBENE

temp.mainmenu.2 = TMENU
temp.mainmenu.2{
    wrap = <ul class="navigation">|</ul></li>
    noBlur = 1
    NO = 1
    NO{
        linkWrap = <li>|</li>
    }
}

ciao
 
Hi Andreas,

1. ich möchte folgende Konstellation erreichen:

Äpfel
Birnen
     gelbe Birnen
     grüne Birnen
Aprikosen
...

Es soll, falls Unterseiten vorhanden sind, wie im o. g. unter dem Menüpunkt "Birnen", ein Untermenü dargestellt werden, welches die Unterseiten mit abbildet - nach Möglichkeit erst, wenn der entsprechende (Haupt-) Menüpunkt [z. B. Birnen] angewählt wird.

2. Da ich nun Typoneuling bin, habe ich mir bisher alles aus Typo3 Büchern "zusammengefrickelt". Ich komme mit Deinem Codeschnipsel insofern nicht klar, da ich nicht weiß, wie ich diesen in das Template einbinde.

Mein Template sind bis dato so aus:
Code: 
# Seitenobjekt anlegen
Seite = PAGE
Seite {
	# CSS Datei zuweisen 
		stylesheet = fileadmin/template/text.css
		typeNum = 0

	# Das Imageobjekt für das Logo
		10 = IMAGE
		10 {
			file = fileadmin/template/images/weblogo.gif
			altText = Logo Grafik
			titleText = Dies ist die Logo Grafik
			wrap = <div id="logo_container"> | </div>
			}

	# Die Navigation
		20 = HMENU
                                entryLevel = 0
		20 {
			wrap = <div id="navig"><ul> | </ul></div>
			1 = TMENU
                                                1.expALL = 0
			1.NO.linkWrap = <li> | </li>
			}

	# Dem Objekt den Inhalt aus der Spalte Normal zuweisen
                                30 < styles.content.get
		30.wrap = <div id="content"> | </div>
                                	

	# Dem Objekt den Inhalt aus der Spalte Rand zuweisen 
		40 = IMAGE
		40 {
			file = fileadmin/template/images/impressum.jpg
			altText = Impressum
			titleText = Impressum
			wrap = <div id="content_border"> | </div>
			}

Die passende CSS-Datei lautet:
Code: 
body         {
                line-height:normal;
                white-space:normal;
	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
                background-color: #FFFFFF;
	}

p.bodytext {
	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
                margin:0px;
	}
	
h1 {
	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
                font-size: 16 px;
	color: #FF3300;
	}
	
h2 {
	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
                font-size: 18 px;
	color: #FF3300;
	}

#logo_container {
	position: absolute;
                padding: 5px;
                text-align: center;
	left: 10px
	top: 10px;
	width: 765px;
                height: 66px;
                border-top: 1px solid #999999;
                border-left: 1px solid #999999;
                border-right: 1px solid #999999;
                background-color: #FFCC00;
	}
	
#navig {
	position: absolute;
	left: 10px;
	top: 80px;
	width: 140px;
                height: 500px;
                border-top: 1px solid #999999;
                border-left: 1px solid #999999;
                border-bottom: 1px solid #999999;
                background-color: #FFCC00;
	}

#navig ul:aktiv, li:aktiv a:aktiv {
                font-size: 10 px;
                font-weight: normal;
                margin-left: 0;
                padding-left: 3;
                }

#navig ul {
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
	}

#navig a {
	display: block;
	padding: 3px;
	width: 120px;
	}

#navig a:link, a:visited {
	color: #330033;
	text-decoration: none;
                font-size: 12 px;
                font-weight: bold;
	}

#navig a:hover {
	background-color: #330033;
	color: #fff;
	}

#navig a:active {
	background-color: #330033;
	color: #FF0000;
	}

#content {
	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
	color: #330033;
	position: absolute;
                padding: 10px;
	left: 150px;
	top: 80px;
	width: 425px;
                height: 500px;
                font-size: 12 px;
                border-top: 1px solid #999999;
                border-left: 1px solid #999999;
                border-bottom: 1px solid #999999;
                background-color: #FFCC00;
	}

#content td {
	font-size: 12 px;
	}

#content a, #content a:link, #content a:visited {
	color: #330033;
	text-decoration: none;
                font-size: 12 px;
                font-weight: bold;
	}

#content a:hover {
	background-color: #330033;
	color: #fff;
	}

#content a:active {
	background-color: #330033;
	color: #FFFFFF;
	}

#content_border {
              	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
	color: #330033;
	position: absolute;
	left: 575px;
	top: 80px;
	width: 200px;
                height: 500px;
	background: #FFFFFF;
	font-size: 10px;
	padding: 10px;
                border: 1px solid #999999;
                background-color: #FFCC00;
	}

#content_border ul {
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
	}

#content_border td {
	font-family: 70214___, Arial, Verdana, Helvetica, sans-serif;
                font-size: 12px;
	}

Wie Du siehst, ist bei mir im Template unter "Punkt" 20 (Überschrift # Die Navigation) das Menü angesiedelt. Was ich nun nicht verstehe ist, wie Dein Code eingebunden werden müsste, damit das Template diesen Bereich als Navigationsstruktur "erkennt"? Ich hoffe, ich habe mich halbwegs verständlich ausgedrückt? :confused:


Beste Grüße,
preko
 
Hi,

so, ich habs nun endlich soweit realisiert und zwar wie folgt:
Code: 
# Seitenobjekt anlegen
Seite = PAGE
Seite {

	# CSS Datei zuweisen 
		stylesheet = fileadmin/template/text.css
		typeNum = 0

	# Das Imageobjekt für das Logo
		10 = IMAGE
		10 {
			file = fileadmin/template/images/weblogo.gif
			altText = Logo Grafik
			titleText = Dies ist die Logo Grafik
			wrap = <div id="logo_container"> | </div>
			}

	# Die Navigation
		20 = HMENU
                                20.entryLevel = 0
                                20.1 = TMENU
                                20.1{
                                    expAll = 1
                                    noBlur = 1
                                    wrap = <ul class="navig">|</ul>

                                    NO = 1
                                    NO{
                                        linkWrap = <li>|</li>
                                        ATagParams = class="navig"
                                    }

                                    IFSUB = 1
                                    IFSUB{
                                        linkWrap = <li>|
                                        ATagParams = class="navig"
                                    }
                                }


                                # AB HIER CODE FÜR DIE 2te EBENE

                                20.2 = TMENU
                                20.2{
                                    wrap = <ul class="navig2">|</ul></li>
                                    noBlur = 1
                                    NO = 1
                                    NO{
                                        linkWrap = <li> | </li>
                                    }
                                }
		20.wrap = <div id="navig"> | </div>

	# Dem Objekt den Inhalt aus der Spalte Normal zuweisen
                                30 < styles.content.get
		30.wrap = <div id="content"> | </div>
                                	

	# Dem Objekt den Inhalt aus der Spalte Rand zuweisen 
		40 = IMAGE
		40 {
			file = fileadmin/template/images/impressum.jpg
			altText = Impressum
			titleText = Impressum
			wrap = <div id="content_border"> | </div>
			}
Nun werden die Untermenüeinträge etwas eingerückt dargestellt.

Die nächste Frage ist nun - was muss ich machen, damit die Untermenüeinträge nur dann angezeigt werden, wenn der übergeordnete Menüpunkt angeklickt wird, sprich so eine Art "Ausklappmenü"?


Beste Grüße,
preko
 
@preko

Auch wenn der Thread schon etwas älter ist, aber das ist jetzt schon der dritte Post von dir, in dem du eine Frage stellst, die du dir hättest selber beantworten können, wenn du die standard Tutorials duchgearbeitet hättest. Guck dir die einfach mal an, die sind ziemlich genial und beantworten alle deine Fragen.

Gruß BSA
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück