How to use home image for the home page only with wayfinder

Before I start digging and digging, anyone out there that who has a working solution to use an iamge for the home page and the rest normal text links. Guess firstTpl or something?

if you just want to add a additional image, you can try to create a chunk with your home-image with the id of your home-resource in its name, for example:

nav_image_1

and put this tag into the row-tpl:



if that isn't what you want you can try to use output-filters



not sure, if this is a good idea, and it might slow your wayfinder-parsing [ed. note: Bruno17 last edited this post 10 years, 3 months ago.]

No need to use the firstTpl or anything,

From memory wayfinder give the class of first to the first LI so just target that:



If you start with that and give us a link we can then sort the rest out.

Doesn t seem to give that class first...

Quote from: paulp at Jan 12, 2014, 04:31 PM

No need to use the firstTpl or anything,

From memory wayfinder give the class of first to the first LI so just target that:

li.first a {
text-indent: -3000px /* put the text 3000px off screen */
background: url(path to home image/home.png) no-repeat;
/* set the heights/widths if not responsive */
height: 30px;
width: 30px;
/* set the position */
background-position: 20px 20px;
display: inline-block;
}

If you start with that and give us a link we can then sort the rest out.

It doesn't by default, you can set it up with &firstClass=`whatever`

If you really get into CSS, you could use first-of-type http://css-tricks.com/almanac/selectors/f/first-of-type/