Problem with wayfinder

6 Posts

tobiasweeldee Reply #1, 14 years, 6 months ago

Hello modx-Community

I've got a problem with my newest modx-installation. I use there a 3level-sitetree like this:

- home
- page 1
- page 2
- page 3
- page 4
- page 5
- page 6
- page 7

(...)

and i use the following menu:

[[!Wayfinder? &startId=`0` &outerTpl=`mainnav_menuOuter` &rowTpl=`mainnav_menuRow` &innerTpl=`mainnav_menuInner` &innerRowTpl=`mainnav_menuInnerRow` ]]

mainnav_menuInner:

<ul>[[+wf.wrapper]]</ul>

mainnav_menuInnerRow:

<li><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li>

mainnav_menuOuter

<ul class="menu prepend-6">[[+wf.wrapper]]</ul>

mainnav_menuRow

<li class="[[+alias]]"><a href="[[+wf.link]]" title="[[+wf.title]]"><span>[[+wf.linktext]]</span></a>[[+wf.wrapper]]</li>

and i have two questions:

- basically i want to have the li-class-alias (see mainnav_menuRow) only on the top level to color the five main-items in css. how can i arrange this?

- i have the problem, that often on my site, while i'm for example on page 3, wayfinder creates every link like: /page3/page6.html etc, and when i'm on page6, it's like page6/page6.html - have you experience this as well? what could it be?

friendly url's are turned on logically.

Thanks in advance for your help and greetings
Tobias

edit: it works after i've added '<base href="[[++site_url]]" />' to the html-header, the class issue i've managed with levelClass in Wayfinder [ed. note: tobiasweeldee last edited this post 14 years, 6 months ago.]

1,098 Posts

microcipcip Reply #2, 14 years, 6 months ago

Quote from: tobiasweeldee at Apr 13, 2012, 01:39 AM

- basically i want to have the li-class-alias (see mainnav_menuRow) only on the top level to color the five main-items in css. how can i arrange this?

Try this code for mainnav_menuRow:

<li class="menu[[+id]]"><a href="[[+wf.link]]" title="[[+wf.title]]"><span>[[+wf.linktext]]</span></a>[[+wf.wrapper]]</li>

Now save and open the html, you should see each li with a different class, for example mine is:

<ul>
	<li class="menu1"><a href="page1.html">Pag 1</a></li>
	<li class="menu2"><a href="page2.html">Pag 2</a></li>
	<li class="menu3"><a href="page3.html">Pag 3</a></li>
	<li class="menu4"><a href="page4.html">Pag 4</a></li>
</ul>

Now you can style them with css:

.menu1 {
     background: red;
}
.menu2 {
     background: orange;
}
.menu3 {
     background: blue;
}
.menu4 {
     background: purple;
}

Quote from: tobiasweeldee at Apr 13, 2012, 01:39 AM

friendly url's are turned on logically.

Thanks in advance for your help and greetings
Tobias

Maybe you have not enabled .htaccess file and set up correct folder there.

Jertix.org -> Web Design & Development, Motion Graphics | Follow me on Twitter | MODx Tutorials (in Italiano) | MODx Snippets (English)

1,098 Posts

microcipcip Reply #3, 14 years, 6 months ago

BTW, at this link there is a Wayfinder e-book: http://www.gregorysmart.com/downloads/The_almost_Complete_Guide_to_Constructing_Menus_in_MODx_Using_Wayfinder.pdf

Note: the placeholders are for MODX Evolution, change them for Revolution if you use it.

Jertix.org -> Web Design & Development, Motion Graphics | Follow me on Twitter | MODx Tutorials (in Italiano) | MODx Snippets (English)

6 Posts

tobiasweeldee Reply #4, 14 years, 6 months ago

Thank you very much for your response. It works perfectly. At the moment I'm just struggling with this Level-Class-issue:

- i want every list-element-link (a class="fly") at level 2 that contains children-elements for getting it displayed. unfortunately this in the menuinnerrow doesn't work:

<li ><a class="[[+wf.classes+]]" href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li>

Does anybody have an idea how i could manage this?

1,098 Posts

microcipcip Reply #5, 14 years, 6 months ago

You mean that you're trying to display the third level if it is available?

Jertix.org -> Web Design & Development, Motion Graphics | Follow me on Twitter | MODx Tutorials (in Italiano) | MODx Snippets (English)

6 Posts

tobiasweeldee Reply #6, 14 years, 6 months ago

I want to add a class to the links at level 2 that contain children-elements.

ex:

<ul class="123">
	<li class="menu1"><a>Page</a></li>
	<li class="menu2"><a>Page</a>
		<ul>
		<li><a>Page</a></li>
		<li><a>Page</a></li>
		<li><a>Page</a></li>
		<li><a class="fly">Page</a>
			<ul>
				<li><a>Page</a></li>
				<li><a>Page</a></li>
				<li><a>Page</a></li>
			</ul>   
		</li>
		<li><a class="fly">Page</a>
			<ul>
				<li><a>Page</a></li>
				<li><a>Page</a></li>
				<li><a>Page</a></li>
			</ul> 
		</li>
		<li><a>Page</a> </li>
		<li><a>Page</a></li>
		<li><a>Page</a></li>
		</ul>
	</li>	
</ul>

1,098 Posts

microcipcip Reply #7, 14 years, 6 months ago

Add &parentClass paramenter then, in this way it will add the class for every element which has children. It will add the "fly" class to the first level as well, but with CSS you can target only the second level.

[[!Wayfinder? &parentClass=`fly`  ]]

Jertix.org -> Web Design & Development, Motion Graphics | Follow me on Twitter | MODx Tutorials (in Italiano) | MODx Snippets (English)

6 Posts

tobiasweeldee Reply #8, 14 years, 6 months ago

Thanks for your help but unfortunately I can't make it work atm. Is there any other idea around or do I need to add other stuff in my wf-Templates to make this parentClass-thing work?

1,098 Posts

microcipcip Reply #9, 14 years, 6 months ago

Your mainnav_menuInnerRow is missing the +wf.classes placeholder so it doesn't output anything:

<li [[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li>

Jertix.org -> Web Design & Development, Motion Graphics | Follow me on Twitter | MODx Tutorials (in Italiano) | MODx Snippets (English)

6 Posts

tobiasweeldee Reply #10, 14 years, 6 months ago

Thanks for your help but I'm still not really seeing the point with this container-checkbox. Isn't it a parent-element automatically if it contains children-element? For what is this container-checkbox for?