Wayfinder with Icons

OK not sure if this is possible but I am working on a site where I require icons for the main menu. My question is, is this possible with wayfinder, more details on what I want are. Allocate a given Icon for each section of the site which wayfinder would then display for each page allocated to that section. These Icons would need to replace the text that wayfinder currently displays. Then once clicked on it takes you to the home page of that section.

So the structure would be:
Home page
Section 1 Section 2 Section 3 Section 4 (Each of these represented by an Icon not text in menu)
Page 1 Page 2 Page 3 Page 1 Page 2 Page 1 Page 2 Page 3 Page 1 Page 2 (These will appear as a seperate text based menu on the sections home page)


The sperate menu I can do. The icon menu on the home page I could do by hard coding this in to the page but I would like to create it Dynamically from wayfinder if possible to make it easier to add sections.

Hope all this makes sense I always struggle to put my ideas down on paper.

You can have wayfinder append the item number which you could use to create unique IDs for each menu item and thus use CSS to insert your icons.

OK thanks for that the css I can do how do I have wayfinder append the item number and how do I put this into the ID

Quote from: peteedley at Oct 02, 2008, 09:33 AM

OK thanks for that the css I can do how do I have wayfinder append the item number and how do I put this into the ID

Am not sure about this, never tried it, but maybe this is the parameter you need? &rowIdPrefix

&rowIdPrefix
    default: FALSE
    values: name of prefix
    description: If this parameter is set, Wayfinder will replace the placeholder [+wf.id+] with a unique id consisting of the specified prefix plus the document id.
    example: &rowIdPrefix=`topMenu` will output the following for doc # 29: id="topMenu29"

This is from wayfinder’s developer’s website. http://www.muddydogpaws.com/development/wayfinder/parameters.html

More info from another wayfinder document says

If you’re writing custom templates and need an unique identifier for each row, then this is the parameter for you. For each document that WayFinder lists, the value you set in this parameter will be prepended to the document ID then placed in the [+wf.id+] placeholder. This placeholder can then be used in any row-level template.

The example from muddydogpaws is:



If I understand this correctly, it means that for every list item <li> in your menu, you will have a unique id that you can target in your CSS.

Anyway, hope it solves your problem...

cheers/k

Thanks for that will play around with it when i get time. I had looked at the developers website and missed that one.