[TYPO3] navigation with unique icons for each nav entry

[Rens Admiraal]

Hi Dave,

I presume you want to change attributes like color?

In that case you can use:
fontColor = |#8e68a3||#4878c2|||#f36c1d


You can do the same for the other states, like RO / ACT

or something like that. In this example it gives the first 3 items  
each another color, and the next items will get the 3rd color I  
think. Here is an example of a site which uses this for the mainmenu:  
http://www.switchweb.nl/

Here is a piece of the TS used there:

temp.mainmenu.1 {
	NO {
		XY = [10.w]+50,[10.h]+6
		backColor = #d0d4d5
		transparentBackground = 1

		10 = TEXT
		10 {
			text.field = title
			fontSize = 22
			fontColor = |#8e68a3||#4878c2|||#f36c1d
			antiAlias = 1
			offset = 5,20
			align = left
		}
	}

	RO < .NO
	RO = 1
	RO.10.fontColor = |#7d5792||#3767b1|||#eb8b24
}


Op 11-mei-2007, om 12:55 heeft Dave het volgende geschreven:

> Hi all,
>
> I have site which needs a navigation with unique icons for each  
> nav. entry,
> thus for example - 'about us' would have an about us icon, 'contact  
> us'
> would have a contact us icon.
>
>
>
> I am not sure how to configure this with typoscript, but also how  
> would I
> configure the typoscript so when the icon is clicked it remains in the
> active state for the page it is on (has a differwent image for  
> active state
> and/or rollover state?
>
>
>
> No other main level pages need to be added, so I don't need to be  
> able to
> add new pages and thus add another unique icon..hopefully!!!
>
>
>
> Below is my basic code for a Gmenu. Maybee the whole background  
> image can
> change for each menu item???????
>
>
>
> subparts.footmenu_1 = HMENU
>
> subparts.footmenu_1.1 = GMENU
>
> subparts.footmenu_1.1 {
>
>   layerStyle =
> position:absolute;left:0px;top:30px;width:10px;VISIBILITY:hidden;
>
>   xPosOffset =-40
>
>   lockPosition = x
>
>   expAll=1
>
>   NO {
>
>     backColor = #000000
>
>             10.fontColor = #ff9933
>
>     XY = [10.w]+15, 30
>
>     10 = TEXT
>
>             10.fontSize = 18
>
>
>
>             10.fontFile = fileadmin/VENETO.TTF
>
>     10.text.field = title
>
>     10.offset = 8,20
>
>   }
>
>   RO < .NO
>
> RO {
>
> 10.fontColor = #ffffff
>
> 20 >
>
> 20< .10
>
> }
>
> RO = 1
>
>
>
> ACT < .RO
>
> ACT {
>
> 10.fontColor = #ffffff
>
> 20 >
>
> 20< .10
>
> }
>
> ACT = 1
>
> }
>
>
>
>
>
> The closest I can find on the net is this snippet which I think  
> changes the
> header for each page.
>
>
>
> Section Index with individual CSS-Styles
>
> This snippet wraps every section with a own CSS-style for  
> formatting the
> index on each page individually. The layout setting of the header  
> controls
> this behaviour (Layout1 - Layout5) and sets the coresponding CSS-Style
> .csc-section-1 to csc-section-5.
>
>
>
> # override "Section index (pagecontent w/Index checked)"
>
> tt_content.menu.20.3 >
>
> tt_content.menu.20 {
>
>   3 < styles.content.get
>
>   3.wrap = <div class="csc-menu csc-menu-3">|</div>
>
>   3.select.andWhere = sectionIndex!=0
>
>   3.select.pidInList.override.field = pages
>
>   3.renderObj = CASE
>
>   3.renderObj {
>
>     key.field = header_layout
>
>     default = COA
>
>     default {
>
>       stdWrap.fieldRequired = header
>
>       10 = TEXT
>
>       10.field = header
>
>       10.trim = 1
>
>       10.htmlSpecialChars = 1
>
>       10.dataWrap = <p class="csc-section-1">|</p>
>
>       10.typolink.parameter.field = pid
>
>       10.typolink.section.field = uid
>
>     }
>
>     1 < .default
>
>     2 < .default
>
>     2.10.dataWrap = <p class="csc-section-2">|</p>
>
>     3 < .default
>
>     3.10.dataWrap = <p class="csc-section-3">|</p>
>
>     4 < .default
>
>     4.10.dataWrap = <p class="csc-section-4">|</p>
>
>     5 < .default
>
>     5.10.dataWrap = <p class="csc-section-5">|</p>
>
>   }
>
>
>
> Regards,
>
>
>
> Dave
>
> _______________________________________________
> TYPO3-english mailing list
> TYPO3-english at lists.netfielders.de
> http://lists.netfielders.de/cgi-bin/mailman/listinfo/typo3-english