advanced search

We Recommend

Building Websites with TYPO3 Building Websites with TYPO3
Follow a clear path through the power and complexity of TYPO3 to get started, and build your own TYPO3 website This book is a fast paced tutorial to creating a website using TYPO3. If you have never used TYPO3, or even any web content management system before, then you need not look further than this book as it walks you through each step to create your own TYPO3 site.

Posted By

medienagent on 04/21/08


Tagged

menu typoscript tmenu gmenu


Versions (?)


accessible GTMenu

Published in: TYPO3 

URL: http://p21304.typo3server.info

Using this TypoScript, you can build an accessible GTMenu which may fully be styled using CSS. We propose using this instead of ANY GMENU which creates ugly code.

It renders a simple TMENU, and wraps an IMG_RESOURCE into the ATagParams by making this a cObject. There will be a podcast on typo3.org sometime soon.

Please note: in order to use {TSFE:lastImgResourceInfo|0} (which reads the width of the last image generated by the gifbuilder) you need TYPO3 4.1


Plain TextExpand 
  1. #############################

  2. # subpart temp.nav_mainUDM

  3. #############################

  4. #

  5.  
  6. temp.menu1 = HMENU

  7. temp.menu1 {

  8.   entryLevel = 0

  9.       1 = TMENU

  10.       1 {

  11.         expAll = 1

  12.         wrap = <ul id="nav">|</ul>

  13.         NO = 1

  14.         NO.doNotLinkIt = 1

  15.         NO.wrapItemAndSub = <li>|</li>

  16.  
  17.         NO.stdWrap.cObject = COA 

  18.         NO.stdWrap.cObject{

  19.  
  20.          10 = TEXT

  21.          10 {

  22.           field = subtitle//title

  23.           typolink {

  24.             parameter.field = uid

  25.             ATagParams.cObject = COA

  26.             ATagParams.cObject { 

  27.  
  28.             20 = IMG_RESOURCE

  29.             #10 = IMAGE

  30.  
  31.             20.file = GIFBUILDER

  32.             20.file {

  33.               XY = [10.w]+[20.w]+10,70

  34.               transparentColor = #ffffff

  35.               #backColor = #ffffff

  36.  
  37.               20 = TEXT

  38.               20 {

  39.                   text.field = title

  40.                   text.case = upper

  41.                   fontSize = 14

  42.                   fontFile=fileadmin/fonts/someFont.ttf

  43.                   offset = 5,20

  44.                   fontColor = #787879

  45.                   niceText = 1

  46.                  }

  47.  
  48.             30 = BOX

  49.             30.dimensions = 0,30,[10.w]+[20.w]+10,35

  50.             30.color = #e53827

  51.  
  52.             40 = TEXT

  53.             40 < .20

  54.             40 {

  55.                offset = 5,50

  56.                fontColor = #ffffff

  57.                }

  58.             }

  59.           20.stdWrap.dataWrap = class="imageheader" style="width:{TSFE:lastImgResourceInfo|0}px; background-repeat:no-repeat;background-image: url('/|');"

  60.  
  61.     }

  62.   }

  63. }

  64.  
  65.  
  66.  
  67.         }

  68.  
  69.       ACT = 1

  70.       ACT < .NO 

  71.       ACT {

  72.             wrapItemAndSub = <li class="current">|</li>

  73.         }

  74.  
  75.       }

  76.  
  77.  
  78.       2 = TMENU

  79.     2 {

  80.         wrap = <ul>|</ul>

  81.         NO {

  82.             wrapItemAndSub = <li>|</li> |*| <li>|</li> |*| <li>|</li>

  83.         }

  84.         CUR = 1

  85.         CUR {

  86.             wrapItemAndSub = <li>|</li> |*| <li>|</li> |*| <li>|</li>

  87.  
  88.             ATagParams = class="act-2ndlevel"

  89.         }

  90.  
  91.         ACT = 1

  92.         ACT < .CUR

  93.  
  94.     }

  95.  
  96.  
  97. }

Report this snippet 

You need to login to post a comment.