TypoScript Navigation

Aufbau einer Navigation mit TYPO3.

Navigation mit Bootstrap in 3 Ebenen.

lib.navigation_top = COA
lib.navigation_top {
  wrap = <nav class="navbar navbar-default"> <div class="container-fluid"> | </div> </nav>
   
  30 = COA
  30 {
    wrap = <div class="navbar-header"> | </div>
    10 = COA
    10 {
      // hamburger icon:
      wrap (
        <button type="button" 
          class="navbar-toggle collapsed" 
          data-toggle="collapse" 
          data-target="#navbar" 
          aria-expanded="false" 
          aria-controls="navbar">|</button>
      )
      10 = TEXT
      10.value = <span class="sr-only">Navigation Einklappen</span>
      20 = TEXT
      20.value = <span class="icon-bar"></span>
      21 < .20
      22 < .20
    }
  }
   
  20 = HMENU
  20 {
    wrap = <div id="navbar" class="navbar-collapse collapse"> <ul class="nav navbar-nav"> | </ul> </div>
    
    ## Startseite und Sitemap ausschliessen
    excludeUidList = 1, 2
     
    1 = TMENU
    1 {
      expAll = 1
         
      NO = 1
      NO {
        ATagTitle.field = title
        wrapItemAndSub = <li>|</li>
      }
      
      CUR < .NO
      CUR {
        wrapItemAndSub = <li class="active">|</li>
      }
      
      ACT < .CUR
      
      IFSUB = 1
      IFSUB {
        ATagTitle.field = title
        ATagParams = class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"
        linkWrap = |<b class="caret"></b>
        ATagBeforeWrap = 1
        wrapItemAndSub = <li class="dropdown">|</li>
      }
      
      ACTIFSUB < .IFSUB
      ACTIFSUB {
        wrapItemAndSub = <li class="dropdown active">|</li>
      }
      
      CURIFSUB < .ACTIFSUB
    }
     
    2 < .1
    2 {
      wrap = <ul class="dropdown-menu">|</ul>
       
      IFSUB {
        ATagTitle.field = title
        ATagParams = class="arrowbox"
        linkWrap = |
        ATagBeforeWrap = 1
        wrapItemAndSub = <li>|</li>
      }
      CURIFSUB {
        ATagTitle.field = title
        ATagParams = class="arrowbox"
        linkWrap = |
        ATagBeforeWrap = 1
        wrapItemAndSub = <li>|</li>
      }
      ACTIFSUB {
        ATagTitle.field = title
        ATagParams = class="arrowbox active"
        linkWrap = |
        ATagBeforeWrap = 1
        wrapItemAndSub = <li>|</li>
      }
    }
          
    3 < .2
    3 {
      wrap = <ul class="dropdown-menu">|</ul>
      NO = 1
      NO {
        ATagTitle.field = title
        wrapItemAndSub = <li>|</li>
      }
      
      IFSUB >
    }
  }
}

Navigation im Headerbereich der Webseite.
Diese Navigation liegt über dem Slider ganz oben auf der Webseite. Hier werden die Links generiert, die in jeder Seite angezeigt werden müssen, wie Kontakt, Datenschutz oder Start.

lib.navigation_banner = COA
lib.navigation_banner {
  10 = HMENU
  10 {
    special = list
    special.value = 2, 10, 72, 71
    entryLevel = 0
  
    1 = TMENU
    1 {
      NO = 1
      expAll = 0
      collapse = 0
      NO.ATagParams = class="bread_link_small white"
      NO.linkWrap = ||*|
    }
  }
}  
lib.breadcrumb = HMENU
lib.breadcrumb.special = rootline
lib.breadcrumb.special.range = 0
lib.breadcrumb.1 = TMENU
lib.breadcrumb.1 {
  wrap = |
  target = _top
  NO {
    linkWrap = |
    allWrap = |*||&nbsp;&raquo;&nbsp;|*||
  
    ## Aufklappende Menus unter dem Link
    stdWrap.prepend = TEXT
    stdWrap.prepend {
      field = description // subtitle // title
      wrap = <span>|</span>
    }
    
    ATagParams = class="bread_link_small"
  }
}
lib.navigation_footer = COA
lib.navigation_footer {
  
  10 = HMENU
  10.wrap=<div class="ibkfooter">|</div>  
  10.entryLevel = 0
  10 {
    1 = TMENU
    1 {
      NO = 1
     expAll = 1
      collapse = 0
      NO.allWrap = |*||<br />|*||
      NO.ATagParams = class="bread_link_small"
      <span class="div_footer">|</span>
    }
  }
}  
Cookies helfen bei der Bereitstellung von Inhalten. Durch die Nutzung dieser Seiten erklären Sie sich damit einverstanden, dass Cookies auf Ihrem Rechner gespeichert werden. Weitere Information
  • typoscript_navigation.txt
  • Zuletzt geändert: 22/09/2018 14:52
  • von Thomas Berscheid