Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.
| Nächste Überarbeitung | Vorherige Überarbeitung | ||
| typo3:templating:bootstrap [2015/06/05 21:28] – angelegt admin | typo3:templating:bootstrap [2016/06/08 00:09] (aktuell) – Seite löschen, Inhalt in aktualisierter Form auf Website (Tutorials) admin | ||
|---|---|---|---|
| Zeile 1: | Zeile 1: | ||
| - | ====== Bootstrap ====== | ||
| - | Die folgenden Snippets sind für den Gebrauch des Bootstrap Frameworks gedacht. | ||
| - | |||
| - | ===== Bootstrap 3 Navbar (Basic) ===== | ||
| - | |||
| - | Dieses TypoScript erstellt die komplette Navbar inklusive Firmenname. Bei Verwendung des Spacers wird dieser als Nav header ausgegeben, also nicht wählbare Überschrift im Menü. Über dem Nav header wird eine Trennlinie eingefügt, **außer** es ist der erste Menüpunkt auf dieser Ebene. | ||
| - | |||
| - | <code typoscript> | ||
| - | lib.bootstrapNav = COA | ||
| - | lib.bootstrapNav { | ||
| - | wrap = <nav class=" | ||
| - | |||
| - | 10 = COA | ||
| - | 10 { | ||
| - | wrap = <div class=" | ||
| - | 10 = COA | ||
| - | 10 { | ||
| - | # Hamburger-Icon: | ||
| - | wrap = <button type=" | ||
| - | 10 = TEXT | ||
| - | 10.value = <span class=" | ||
| - | 20 = TEXT | ||
| - | 20.value = <span class=" | ||
| - | 21 < .20 | ||
| - | 22 < .20 | ||
| - | } | ||
| - | |||
| - | # Firmenlogo: | ||
| - | 20 = TEXT | ||
| - | 20.value = Projektname | ||
| - | 20.typolink { | ||
| - | parameter = http:// | ||
| - | ATagParams = class=" | ||
| - | } | ||
| - | } | ||
| - | |||
| - | 20 = HMENU | ||
| - | 20 { | ||
| - | special = directory | ||
| - | special.value = 11 | ||
| - | wrap = <div id=" | ||
| - | | ||
| - | 1 = TMENU | ||
| - | 1 { | ||
| - | expAll = 1 | ||
| - | | ||
| - | NO = 1 | ||
| - | NO { | ||
| - | ATagTitle.field = title | ||
| - | wrapItemAndSub = < | ||
| - | } | ||
| - | |||
| - | CUR = 1 | ||
| - | CUR { | ||
| - | ATagTitle.field = title | ||
| - | wrapItemAndSub = <li class=" | ||
| - | } | ||
| - | | ||
| - | ACT < .CUR | ||
| - | | ||
| - | IFSUB = 1 | ||
| - | IFSUB { | ||
| - | ATagTitle.field = title | ||
| - | ATagParams = class=" | ||
| - | linkWrap = |<b class=" | ||
| - | ATagBeforeWrap = 1 | ||
| - | wrapItemAndSub = <li class=" | ||
| - | } | ||
| - | | ||
| - | ACTIFSUB = 1 | ||
| - | ACTIFSUB { | ||
| - | ATagTitle.field = title | ||
| - | ATagParams = class=" | ||
| - | linkWrap = |<b class=" | ||
| - | ATagBeforeWrap = 1 | ||
| - | wrapItemAndSub = <li class=" | ||
| - | } | ||
| - | } | ||
| - | |||
| - | 2 < .1 | ||
| - | 2 { | ||
| - | wrap = <ul class=" | ||
| - | | ||
| - | SPC = 1 | ||
| - | SPC { | ||
| - | wrapItemAndSub.cObject = COA | ||
| - | wrapItemAndSub.cObject { | ||
| - | # Keine Trennline, falls erster Menüpunkt dieser Ebene: | ||
| - | 10 = TEXT | ||
| - | 10.value = <li class=" | ||
| - | 10.if.value.data = register: | ||
| - | 10.if.equals = 1 | ||
| - | | ||
| - | # ansonsten: | ||
| - | 20 = TEXT | ||
| - | 20.value = <li class=" | ||
| - | 20.if.value.data = register: | ||
| - | 20.if.equals = 1 | ||
| - | 20.if.negate = 1 | ||
| - | } | ||
| - | } | ||
| - | } | ||
| - | } | ||
| - | } | ||
| - | </ | ||
| - | |||
| - | ---- | ||
| - | |||
| - | ===== Bootstrap 3 Navbar (mit Sprachmenü) ===== | ||
| - | |||
| - | <code typoscript> | ||
| - | |||
| - | </ | ||
| - | |||
| - | ---- | ||
| - | |||
| - | ===== Bootstrap 3 Navbar (Multilevel) ===== | ||
| - | |||
| - | <code typoscript> | ||
| - | |||
| - | </ | ||