Anzeige
Tutorialbeschreibung

Template Vorlage in Typo3 einbinden

Template Vorlage in Typo3 einbinden

Hier könnt Ihr erfahren, wie man ein Menü (vertikal) in Typo3 anlegt. Die Vorlage findet Ihr zur freien Verfügung im Netz.
Viel Spaß!  


Ansicht in Typo3:
Bilder

In Typo 3 muss man das Menü wie folgt angeben:

MENU_OBEN = HMENU (Erzeugt hierarchische Menüs).

MENU_OBEN {

            special = directory

            # ID eben dieser Seite, an der das Menü anfangen soll

            special.value = 1

            # erste Menüebene

            1 = TMENU

            1 {

                        #für erste Menüebene Normalzustand benutzen

                        NO = 1 

                }


Die Seite sieht dann so aus …

Bilder


Nun haben wir ein Menü erzeugt, das horizontal ist. Unser Menü soll aber vertikal werden, also sind noch weitere Schritte nötig.

MENU_OBEN = HMENU

                                   MENU_OBEN {

                                               special = directory

                                               # ID eben dieser Seite, an der das Menü anfangen soll

                                               special.value = 1

                                               # erste Menüebene

                                               1 = TMENU

                                               1 {

                                                           # Menüelement im Normalzustand

                                                           NO = 1

                                                           # Jedes Menüelement mit li-Tag umschließen      

                                                           NO.linkWrap = <li> | </li> Platzhalter ist der senkrechte Strich

                                               }

Die Seite sieht dann so aus …

Bilder


Ist ja nun schon wesentlich besser, aber nicht so wirklich schön ... also weiter geht's!

Unter NO.linkWrap den Befehl einfügen, damit die komplette Menüebene mit ul -Tag umschlossen wird:

wrap = <ul> | </ul>

Die Seite sieht dann so aus …
Bilder


Viel besser, oder? Ich hoffe, Ihr kommt mit den angegebenen Schritten zurecht. Die mit

# gekennzeichneten Schriftzüge in den Befehlsanweisungen sind Kommentare und dienen nur zur Erklärung!

Um unser Menü links erscheinen zu lassen, benötigen wir den Befehl: entryLevel -  int 

Erklärung für diesen Befehl:
Gibt an, in welcher Ebene der rootline das Menü beginnen soll. Der Standardwert ist "0" (erste Seitenebene unter der Weltkugel),
was uns zu einem Menü mit den ersten Seiten der Website führt. Ist der Wert < 0, liegt entryLevel "hinter" der rootline. "-1" ist also ein Menü mit Einträgen aus der obersten Ebene,
"-2" ist die Ebene nach der obersten Ebene,...

Wir schreiben in Typo3:

MENU_LINKS = HMENU

                                   MENU_LINKS {

                                               entryLevel = 1

                                               # erste Menüebene

                                               1 = TMENU

                                               1 {

                                                           # Menüebene im Normalzustand

                                                           NO = 1

                                                 }

                                   }

Das Menü sieht dann so aus:

Bilder


Wie ihr seht, ist das Menü oben erschienen, aber auf keinen Fall ist es so, wie es sein sollte. Also sind weitere Schritte notwendig!
Die komplette Menüebene muss durch einen Absatz umschlossen werden.

wrap = <p class "menublock"> | </p>


Bilder


Schon viel besser, aber noch nicht perfekt, denn es stehen teilweise zwei Begriffe nebeneinander.
Also müssen wir nun hinter jedes Menüelement ein br-Tag setzen.

NO.linkWrap = | <br class="hide" />

Jetzt sind wir fertig.

Der ganze Befehl stellt sich wie folgt dar:


MENU_LINKS {

                                               entryLevel = 1

                                               # erste Menüebene

                                               1 = TMENU

                                               1 {

                                                           # komplette Menüelebene mit p- Tag umschließen

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

                                                           # Menüelement im Normalzustand

                                                           NO = 1

                                                           # Hinter jedes Menüelement ein br -Tag

                                                           NO.linkWrap = | <span class="nav"/> | </span>

                                                 }

                                   }


Unser Endprodukt sieht nun wie folgt aus ...

Bilder


Dieses Template findet Ihr zur freien Verfügung im Netz.
Viel Spaß beim Basteln!

# Dieses Zeichen dient als Kommentar und wird in Typo3 als solches verwendet.


Kommentare
Achtung: Du kannst den Inhalt erst nach dem Login kommentieren.
Portrait von TK814
  • 08.01.2011 - 20:11

Man hätte es besser erklären können.. Aber sonst ist es okay.

Portrait von Endless_Breath
  • 21.04.2010 - 16:50

werd ich gleich mal austesten, thx

Portrait von mistab
  • 09.02.2010 - 09:48

Kann meinen Vorrednern nur beipflichten... etwas mager geraten und auch ich hatte mir wesentlich mehr erwartet.

Portrait von silvereye2000
  • 17.11.2009 - 10:30

Ich hätte die HTML Vorlage auch eingefügt.

Portrait von topmanager
  • 10.11.2009 - 10:49

ja nicht schlecht,etwas mehr tiefe beim nächsten

Portrait von chris3
  • 21.10.2009 - 19:50

Nichts für Anfänger. Muss man sich sehr genau ansehen!

Portrait von spaxi
  • 18.10.2009 - 16:43

Naja, hatte mir ein wenig mehr Details erhofft...

Portrait von leon23
  • 17.10.2009 - 00:38

hmm habs nicht gelesen also mitte

Portrait von wacko
  • 17.10.2009 - 11:14

was soll das denn?! wieso dann überhaupt?!

Portrait von Assigned1004
  • 16.10.2009 - 06:06

Schade, hätte mehr erwartet..
Also für Typo 3 Anfänger leider nicht 100% geeignet das Tutorial :(

Portrait von romihue
  • 15.10.2009 - 19:26

Leicht verstndlich, hätte mir nur etwas audführlicher gewünscht. trotzdem Danke.

Portrait von didib
  • 15.10.2009 - 11:11

Und dafür hab ich jetzt wieder ein paar Punkte hier geopfert? .. schade.

Wenn Menüpunkte untereinander stehen, nennt man das sicher vertikal. Wenn Sie nebeneinander stehen nennt sich das horizontal. Irgendwie komm ich daher bei diesem Tut nicht ganz nach. Es scheint immer verdreht benannt zu sein.

Das Tut ist zudem völlig losgelöst vom Template und vom CSS. Es behandelt nur Typoscript. Ein netter Ansatz aber völlig unzureichend als Tut - vor allem für Typo3-Anfänger schwer nachzuvollziehen.

Zudem ist vergessen worden, dass hinter "special.value = " die ID einer Seite steht, auf die sich der Eintrag bei "entryLevel = 1" bezieht.

hier sind gute Tuts für Typo3: http://www.typo3.net/
und da ist auch die Erstellung von Menüs ausführlich dokumentiert (TS+CSS+HTML):
http://www.typo3.net/faq/div_aufgaben/menu_bulletlist/

Vielleicht sollte der Verfasser mal nachlegen und das Tut vervollständigen.

Portrait von RaKa
  • 15.10.2009 - 08:12

etwas sprunghaft und nichts für anfänger

Portrait von wacko
  • 15.10.2009 - 07:27

Verstehe nicht, warum das Tut "Template Vorlage in Typo3 einbinden (Version: Typo3)" heißt! Hier wird ja ein vertikales Menu gebaut, sonst nichts...

PS.: Vor "Platzhalter ist der senkrechte Strich" fehlt ein "#", denke ich.

Portrait von elxand
  • 12.10.2009 - 22:49

Super, alles inkl. Quelltext, leicht verfolgbar. Wie wär's mit nem Follow-Up für Submenüs? :)

Portrait von snoopdog1971
  • 12.10.2009 - 13:19

Danke für die ausführliche und einfache Beschreibung

x
×
×