2016-08-03 118 views
1

我使用typoscript(新增功能)來處理我的網站的菜單欄,我想使用菜單條目旁邊的fontawesome圖標。Typo3菜單與字體真棒圖標

這是模型的樣子:

enter image description here

這是我的菜單看起來怎麼樣:

enter image description here

現在,我的菜單Typo腳本分部看起來是這樣的:

SUBNAV = HMENU 
    SUBNAV { 
          entryLevel = 0 
          1 = TMENU 
          1 { 
           expAll = 1 
           collapse = active 
           noBlur = 1 

        # Definition per page 
        # NO: default formatting          
           NO = 1 
           NO { 
            wrapItemAndSub = <li >|</li> 
            stdWrap.wrap = <i class="fa fa-plus"></i><span>|</span> 
           } 

        # ACT: User is on this or below this page 
        # Activate this state for this menu 
           ACT < .NO 
           ACT { 
            wrapItemAndSub = <li class="active">|</li> 
           } 
           CUR < .ACT 

        # try to check if submenu to add a arrow icon         

           IFSUB = 1 
           IFSUB{ 
            wrapItemAndSub = <li class="first">|</li>|*|<li>|</li>|*|<li class="last">|</li> 
            linkWrap = |<span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span> 
            ATagBeforeWrap = 1 
            stdWrap.wrap = <i class="fa fa-plus"></i><span>|</span> 
           } 
           ACTIFSUB = 1 
           ACTIFSUB < .ACT 
           ACTIFSUB.linkWrap = |<span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span> 
           ACTIFSUB.ATagBeforeWrap = 1 

           CURIFSUB = 1 
           CURIFSUB < .ACTIFSUB 

          } 


          2= TMENU 
          2 { 
           expAll = 1 
           collapse = active 
           noBlur = 1 
           wrap = <ul class="treeview-menu">|</ul> 
        # Definition per page 
        # NO: default formatting          
           NO = 1 
           NO { 
            wrapItemAndSub = <li >|</li> 
           } 

        # ACT: User is on this or below this page 
        # Activate this state for this menu 
           ACT < .NO 
           ACT { 
            wrapItemAndSub = <li class="active">|</li> 
           } 
           CUR < .ACT 

        # try to check if submenu to add a arrow icon         

           IFSUB = 1 
           IFSUB{ 
            wrapItemAndSub = <li class="first">|</li>|*|<li >|</li>|*|<li class="last">|</li> 
            linkWrap = |<span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span> 
            ATagBeforeWrap = 1 
           } 
           ACTIFSUB = 1 
           ACTIFSUB < .ACT 
           ACTIFSUB.linkWrap = |<span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span> 
           ACTIFSUB.ATagBeforeWrap = 1 

           CURIFSUB = 1 
           CURIFSUB < .ACTIFSUB 

          } 


          # Definition for pages on level 3 and lower                     
          # Copy the definitions from level 2 
            3 < .2 
          #  3.wrap = <ul class="treeview-menu">|</ul> 

          # Copy the definitions from level 2 
            4 < .2 
          #  4.wrap = <ul class="treeview-menu">|</ul> 

          # Copy the definitions from level 2 
            5 < .2 
          #  5.wrap = <ul class="treeview-menu">|</ul> 

          # Copy the definitions from level 2 
            6 < .2 
          #  6.wrap = <ul class="treeview-menu">|</ul> 

        } 

現在,我的問題是我不知道如何將不同的圖標(我選擇的)與不同的菜單(1級中的圖標)相關聯。正如你在typoscript中看到的,我使用了fa圖標,但對於每個菜單項(fa fa-plus)都是相同的。 有什麼建議嗎?

+0

有些東西是基於下面的消化而改變的,但我還沒有完全消除。我修改的Typo腳本沒有進入:\t \t \t \t \t \t \t \t \t NO { \t \t \t \t \t \t \t \t \t \t wrapItemAndSub =

  • |
  • \t \t \t \t \t \t \t \t \t \t#= stdWrap.wrap | \t \t \t \t \t \t \t \t \t \t stdWrap.wrap = | | * | | \t \t \t \t \t \t \t \t \t},但這僅適用於項目無子菜單。 IFSUB部分下的相同代碼不起作用...所以,仍在嘗試。 – fraktal12

    回答

    1

    如果你的菜單項的數量有限,你可以取代你的代碼:

    wrapItemAndSub = <li class="first">|</li>|*|<li>|</li>|*|<li class="last">|</li> 
    

    有了:

    wrapItemAndSub = <li class="first icon1">|</li>|*|<li class="icon2">|</li>|*|<li class="icon3">|</li>|*|<li class="icon4">|</li>|*|<li class="last iconN">|</li> 
    

    要控制每個列表項的顯示。