Guidance setting up a menu

Hello,

I'm kinda new to modx, still trying to understand the best ways of doing some things.

Right now I'm adapting a CSS/HTML site into modx, and I'm trying to integrate the menu. So, basically each resource/page on the site has it's own template (at least for now), and I have some bits which are always the same separated into chunks, like the footer and header.

But there is also a menu (based on div/li and css classes), that is pretty much the same on every page, except that, for the "active" page, I need to add a css class to a <li>, that highlights it. Like, if I'm on Home, the <li> section for that page will be <li class="active">. So this must be changed somehow per-page, to show the correct active page on the menu. As it is now, the menu is a static part of the page template, which is a pain if I want to change something in it that should be propagated to every page, of course.

Now, I'm not sure how to do this more correctly. For snippets, I read everywhere they should not contain any html. For chunks, if they're just for html, I don't see how can I have a chunk add a 'class="active"' on the right location, depending on the current page? Also, I'm not looking to use a plugin/add-on or any built-in menu system.

So, any hints? Thanks in advance.

rgds.

To generate your menus, use Wayfinder. Using the default settings, it will set the active class automatically. You will also want to set any specific menu classes in the outerTpl, innerTpl, and rowTpl chunks (create the chunks, and set them in the Wayfinder call).

http://rtfm.modx.com/display/ADDON/Wayfinder

Insofar as this being an addon/extra, it's completely bare bones by default except it sets the standard menu classes for you. Your active class will be generated by default for any active/current page. You will have to customize the chunks/parameters referenced above to apply your styles, otherwise all you'll get is a default ul li output. You can also generate menus with getResources, and similarly customized chunks of html but you'll have to set the getResources call to apply the active class manually. Wayfinder works really well for this purpose.

Don't be too afraid of MODX addons. There's not much out there that is going to a) mess up your site, or b) apply much of anything in the way of stylings. MODX isn't like that. A bummer for those that want everything all set up out of the box, and a gift for those of us who prefer otherwise.

I implemented formatting and the removal of the active page being an active link on my Wayfinder menu as follows:

Create a chunk to write the menu item. Mine is called menuHereTpl and looks like this:


In your Wayfinder call, reference that chunk like this:


If you make sure to have that particular option in your Wayfinder call, you will get your menu item but it can not be clicked on. To control the formatting, I leverage the "<span class="menuhere">" that I set in the menuHereTpl to format from the CSS as follows:


Note that the last four lines of formatting also place an icon to the left on the active menu item to show that that's the page you're on.