PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
CMS, Shopsoftware & Forensysteme
Typo3
Typo3: Horizontales Layer Menü
Beitrag
<blockquote data-quote="haig" data-source="post: 963857"><p>Hallo, </p><p></p><p>nach 5 Tagen Beschäftigung mit Typo3 will ich mich nach und nach mal daran wagen meine erst kürzlich mit Dreamweaver geschriebene mit Typo3 neu zu schreiben. </p><p></p><p>Horizontales Layer Menü:</p><p></p><p>Ich habe mit dem Dreamweaver ein Template erstellt und diese HTML-Datei + die CSS-Datei + Grafiken in meinen Upload-Ordner hochgeladen. Aus einer Publikation habe ich ein Typoscript auf die erste Seite über meiner Startseite abgeschrieben. Aber hier könnte Ihr sehen. Nehme ich den Code wieder raus, dann sehe ich schon mal mein Banner. Wenn auch die eigentlich unter der Bannerebene absolut positionierte ###NAVI### -Ebene direkt unter dem Banner sein sollte erscheint dann der Marker links über dem Banner. Wobei, eigentlich brauche ich diese Navi-Ebene + Marker doch gar nicht. Oder?</p><p></p><p>Die Stylesheet-Datei hat im Moment nichts weiter drin als die 3 Ebenen: Banner, Inhalt und Navi. Später soll noch Footer dazukommen.</p><p></p><p>Hier das Typoscript:</p><p></p><p>[CODE] 1.</p><p> # page zum Objekt PAGE machen</p><p> 2.</p><p> page = PAGE</p><p> 3.</p><p> </p><p> 4.</p><p> ## eigene Stylesheet einbinden</p><p> 5.</p><p> page.stylesheet = fileadmin/user_upload/stile.css</p><p> 6.</p><p> </p><p> 7.</p><p> ## Meta-Angaben für Suchmaschinen</p><p> 8.</p><p> page.meta.author = Me, |</p><p> 9.</p><p> page.meta.description = Das Vietnam Portal</p><p> 10.</p><p> page.meta.keywords = vietnam, asien, südostasien, hanoi, saigon, südvietnam, mitte vietnam, nordvietnam, hue, hoi an</p><p> 11.</p><p> </p><p> 12.</p><p> # Template an Position 10 einbinden</p><p> 13.</p><p> page.10 = TEMPLATE</p><p> 14.</p><p> page.10.template = FILE</p><p> 15.</p><p> page.10.template.file = fileadmin/user_upload/templ1.html</p><p> 16.</p><p> page.10.workOnSubpart = DOKUMENT</p><p> 17.</p><p> </p><p> 18.</p><p> # Inhalt einbinden</p><p> 19.</p><p> page.10.marks.INHALT = CONTENT</p><p> 20.</p><p> page.10.marks.INHALT.table = tt_content</p><p> 21.</p><p> page.10.marks.INHALT.select.orderBy = sorting</p><p> 22.</p><p> page.10.marks.INHALT.select.where = colPos=0</p><p> 23.</p><p> </p><p> 24.</p><p> # Navi Ebene als Layer einbinden</p><p> 25.</p><p> page.includeLibs.gmenu_layers = typo3_src-4.2.5/typo3/sysext/cms/tslib/media/scripts/gmenu_layers.php</p><p> 26.</p><p> page.bodyTagMargins = 0</p><p> 27.</p><p> page.5 = IMAGE</p><p> 28.</p><p> page.5.file = fileadmin/user_upload/navibut1.gif</p><p> 29.</p><p> page.5.wrap = <div> | </div></p><p> 30.</p><p> </p><p> 31.</p><p> page.10 = HMENU</p><p> 32.</p><p> page.10.wrap = <div style="background-color:#cccccc;border-width:1px 0px; border-style:solid;border-color:black;"> | </div></p><p> 33.</p><p> page.10.1 = GMENU_LAYERS</p><p> 34.</p><p> page.10.1 {</p><p> 35.</p><p> layerStyle = position:absolute;left:10px;top170px;width:985px;VISIBILITY:hidden;</p><p> 36.</p><p> xPosOffset = 0</p><p> 37.</p><p> lockPosition = x</p><p> 38.</p><p> expAll=1</p><p> 39.</p><p> NO {backColor = #cccccc</p><p> 40.</p><p> XY = [10.w]+30, 20</p><p> 41.</p><p> 10 = TEXT</p><p> 42.</p><p> 10.text.field = title</p><p> 43.</p><p> 10.fontFace = fileadmin/user_upload/arial.ttf</p><p> 44.</p><p> 10.fontSize = 12</p><p> 45.</p><p> 10.offset = 5,15</p><p> 46.</p><p> }</p><p> 47.</p><p> }</p><p> 48.</p><p> </p><p> 49.</p><p> page.10.2 = GMENU_LAYERS</p><p> 50.</p><p> page.10.2 {</p><p> 51.</p><p> layerStyle =</p><p> 52.</p><p> layerStyle = position:absolute;width:100px;VISIBILITY:hidden;</p><p> 53.</p><p> relativeToParentLayer=1</p><p> 54.</p><p> relativeToTriggerItem=1</p><p> 55.</p><p> relativeToTriggerItem.addWidth=1</p><p> 56.</p><p> expAll = 1</p><p> 57.</p><p> </p><p> 58.</p><p> page.10.2NO {</p><p> 59.</p><p> backColor = |*|| #cccccc || #aaaaaa |*|</p><p> 60.</p><p> XY = 140, 20</p><p> 61.</p><p> 10 = TEXT</p><p> 62.</p><p> 10.text.field = title</p><p> 63.</p><p> 10.offset = 5,13</p><p> 64.</p><p> 10.fontSize = 12</p><p> 65.</p><p> 10.fontFace = fileadmin/user_upload/arial.ttf</p><p> 66.</p><p> 20 = BOX</p><p> 67.</p><p> 20.dimensions = 0,0,2,20</p><p> 68.</p><p> 20.color = #000000</p><p> 69.</p><p> 30 < .20</p><p> 70.</p><p> 30.align = r</p><p> 71.</p><p> 40 = BOX ||</p><p> 72.</p><p> 40.dimensions = 0o,0,140,2</p><p> 73.</p><p> 40.color = #000000</p><p> 74.</p><p> 50 = |*||*| || BOX</p><p> 75.</p><p> 50.dimensions = 0,0,140,2</p><p> 76.</p><p> 50.color = #000000</p><p> 77.</p><p> 50.align = ,b</p><p> 78.</p><p> </p><p> 79.</p><p> page.10.3 = GMENU</p><p> 80.</p><p> page.10.3.NO {</p><p> 81.</p><p> backcolor = |*| #cccccc || #aaaaaa |*|</p><p> 82.</p><p> XY = 120, 20</p><p> 83.</p><p> 10 = TEXT</p><p> 84.</p><p> 10.text.field = title</p><p> 85.</p><p> 10.fontFace = fileadmin/user_upload/arial.ttf</p><p> 86.</p><p> 10.fontSize = 12</p><p> 87.</p><p> 10.offfset = 5,13</p><p> 88.</p><p> 20 = BOX</p><p> 89.</p><p> 20.dimensions = 0,0,1,20</p><p> 90.</p><p> 20.color = #000000</p><p> 91.</p><p> 30 < .20</p><p> 92.</p><p> 30.align = r</p><p> 93.</p><p> 40 = BOX</p><p> 94.</p><p> 40.dimensions = 0,0,120,1</p><p> 95.</p><p> 40.color = #000000</p><p> 96.</p><p> 50 = |*||*| |*| BOX</p><p> 97.</p><p> 50.dimensions = 0,0,120,1</p><p> 98.</p><p> 50.color = #000000</p><p> 99.</p><p> 50.align = ,b</p><p> 100.</p><p> </p><p> 101.</p><p> # Bannergrafik einbinden</p><p> 102.</p><p> page.10.marks.BANNER = IMAGE</p><p> 103.</p><p> page.10.marks.BANNER.file = fileadmin/user_upload/bannervnft1.jpg [/CODE]</p><p></p><p>Später soll das Layer-Menü 4 Ebenen bedienen. Es sind dann ca 120 Seiten, die ich hinsichtlich übersichtlicher Navigation in Rubriken (also Ebenen unterteile / Ebene 1-4). Ist über das Seiten einrichten schon geschehen. Da selbst dann die Menüleiste lang wird, bleibt mir nur ein horizontales "Ausklappmenü".</p><p></p><p>Ich muß eingestehen, daß das Typoscript für mich noch absolutes "Chinesisch" ist und ich nicht richtig dazu in der Lage bin es zu verstehen. Dadurch kann ich nur abschreiben und vielleicht hie und da verstehe ich diesen oder jene Anweisung was zu tun. Mehr aber nicht. Also ein absoluter Typoscript-DAU. Ich hoffe aber hier Hilfe zu finden.</p><p></p><p>Wenn ich es erst einmal funktionierend habe, kann ich anhand des richtigen Typoscriptes lernen wie was zu machen ist. Im Moment ist der Frustfaktor aber hoch.</p><p></p><p>heiko</p></blockquote><p></p>
[QUOTE="haig, post: 963857"] Hallo, nach 5 Tagen Beschäftigung mit Typo3 will ich mich nach und nach mal daran wagen meine erst kürzlich mit Dreamweaver geschriebene mit Typo3 neu zu schreiben. Horizontales Layer Menü: Ich habe mit dem Dreamweaver ein Template erstellt und diese HTML-Datei + die CSS-Datei + Grafiken in meinen Upload-Ordner hochgeladen. Aus einer Publikation habe ich ein Typoscript auf die erste Seite über meiner Startseite abgeschrieben. Aber hier könnte Ihr sehen. Nehme ich den Code wieder raus, dann sehe ich schon mal mein Banner. Wenn auch die eigentlich unter der Bannerebene absolut positionierte ###NAVI### -Ebene direkt unter dem Banner sein sollte erscheint dann der Marker links über dem Banner. Wobei, eigentlich brauche ich diese Navi-Ebene + Marker doch gar nicht. Oder? Die Stylesheet-Datei hat im Moment nichts weiter drin als die 3 Ebenen: Banner, Inhalt und Navi. Später soll noch Footer dazukommen. Hier das Typoscript: [CODE] 1. # page zum Objekt PAGE machen 2. page = PAGE 3. 4. ## eigene Stylesheet einbinden 5. page.stylesheet = fileadmin/user_upload/stile.css 6. 7. ## Meta-Angaben für Suchmaschinen 8. page.meta.author = Me, | 9. page.meta.description = Das Vietnam Portal 10. page.meta.keywords = vietnam, asien, südostasien, hanoi, saigon, südvietnam, mitte vietnam, nordvietnam, hue, hoi an 11. 12. # Template an Position 10 einbinden 13. page.10 = TEMPLATE 14. page.10.template = FILE 15. page.10.template.file = fileadmin/user_upload/templ1.html 16. page.10.workOnSubpart = DOKUMENT 17. 18. # Inhalt einbinden 19. page.10.marks.INHALT = CONTENT 20. page.10.marks.INHALT.table = tt_content 21. page.10.marks.INHALT.select.orderBy = sorting 22. page.10.marks.INHALT.select.where = colPos=0 23. 24. # Navi Ebene als Layer einbinden 25. page.includeLibs.gmenu_layers = typo3_src-4.2.5/typo3/sysext/cms/tslib/media/scripts/gmenu_layers.php 26. page.bodyTagMargins = 0 27. page.5 = IMAGE 28. page.5.file = fileadmin/user_upload/navibut1.gif 29. page.5.wrap = <div> | </div> 30. 31. page.10 = HMENU 32. page.10.wrap = <div style="background-color:#cccccc;border-width:1px 0px; border-style:solid;border-color:black;"> | </div> 33. page.10.1 = GMENU_LAYERS 34. page.10.1 { 35. layerStyle = position:absolute;left:10px;top170px;width:985px;VISIBILITY:hidden; 36. xPosOffset = 0 37. lockPosition = x 38. expAll=1 39. NO {backColor = #cccccc 40. XY = [10.w]+30, 20 41. 10 = TEXT 42. 10.text.field = title 43. 10.fontFace = fileadmin/user_upload/arial.ttf 44. 10.fontSize = 12 45. 10.offset = 5,15 46. } 47. } 48. 49. page.10.2 = GMENU_LAYERS 50. page.10.2 { 51. layerStyle = 52. layerStyle = position:absolute;width:100px;VISIBILITY:hidden; 53. relativeToParentLayer=1 54. relativeToTriggerItem=1 55. relativeToTriggerItem.addWidth=1 56. expAll = 1 57. 58. page.10.2NO { 59. backColor = |*|| #cccccc || #aaaaaa |*| 60. XY = 140, 20 61. 10 = TEXT 62. 10.text.field = title 63. 10.offset = 5,13 64. 10.fontSize = 12 65. 10.fontFace = fileadmin/user_upload/arial.ttf 66. 20 = BOX 67. 20.dimensions = 0,0,2,20 68. 20.color = #000000 69. 30 < .20 70. 30.align = r 71. 40 = BOX || 72. 40.dimensions = 0o,0,140,2 73. 40.color = #000000 74. 50 = |*||*| || BOX 75. 50.dimensions = 0,0,140,2 76. 50.color = #000000 77. 50.align = ,b 78. 79. page.10.3 = GMENU 80. page.10.3.NO { 81. backcolor = |*| #cccccc || #aaaaaa |*| 82. XY = 120, 20 83. 10 = TEXT 84. 10.text.field = title 85. 10.fontFace = fileadmin/user_upload/arial.ttf 86. 10.fontSize = 12 87. 10.offfset = 5,13 88. 20 = BOX 89. 20.dimensions = 0,0,1,20 90. 20.color = #000000 91. 30 < .20 92. 30.align = r 93. 40 = BOX 94. 40.dimensions = 0,0,120,1 95. 40.color = #000000 96. 50 = |*||*| |*| BOX 97. 50.dimensions = 0,0,120,1 98. 50.color = #000000 99. 50.align = ,b 100. 101. # Bannergrafik einbinden 102. page.10.marks.BANNER = IMAGE 103. page.10.marks.BANNER.file = fileadmin/user_upload/bannervnft1.jpg [/CODE] Später soll das Layer-Menü 4 Ebenen bedienen. Es sind dann ca 120 Seiten, die ich hinsichtlich übersichtlicher Navigation in Rubriken (also Ebenen unterteile / Ebene 1-4). Ist über das Seiten einrichten schon geschehen. Da selbst dann die Menüleiste lang wird, bleibt mir nur ein horizontales "Ausklappmenü". Ich muß eingestehen, daß das Typoscript für mich noch absolutes "Chinesisch" ist und ich nicht richtig dazu in der Lage bin es zu verstehen. Dadurch kann ich nur abschreiben und vielleicht hie und da verstehe ich diesen oder jene Anweisung was zu tun. Mehr aber nicht. Also ein absoluter Typoscript-DAU. Ich hoffe aber hier Hilfe zu finden. Wenn ich es erst einmal funktionierend habe, kann ich anhand des richtigen Typoscriptes lernen wie was zu machen ist. Im Moment ist der Frustfaktor aber hoch. heiko [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Der grüne Frosch hüpft über die Hügel an den Bäumen vorbei in die Höhle. Bitte nenne das vierte Wort!
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
CMS, Shopsoftware & Forensysteme
Typo3
Typo3: Horizontales Layer Menü
Oben