Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.
| Beide Seiten, vorherige ÜberarbeitungVorherige ÜberarbeitungNächste Überarbeitung | Vorherige Überarbeitung | ||
| typo3:templating:bootstrap [2015/06/05 21:31] – 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. | ||
| - | |||
| - | http:// | ||
| - | |||
| - | ===== Bootstrap 3 Navbar (Basic) ===== | ||
| - | |||
| - | http:// | ||
| - | |||
| - | Dieses TypoScript erstellt die komplette Navbar inklusive Firmenname. Bei Verwendung des Spacers '' | ||
| - | |||
| - | <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> | ||
| - | |||
| - | </ | ||