How do I have a link display like this Product Range?

My client has requested to have the product range button to not display as a web page. When someone clicks on the product range button it shouldn’t go anywhere, but when someone places their mouse over the product range button a drop down menu should appear underneath that button. What I am asking is how to I have this "<a href="#">Product Range</a>" for the product range button, using Wayfinder? I already know how to make a menu and drop down menu for all of the web pages, which are in my client’s website. I really need to know how to display # (hash) as a link for a certain button.

If this will help, here is my Wayfinder call:

There’s probably a simpler way to do this in Wayfinder (I don’t use it that often to be honest) so this might be a bit of a hack, but if you don’t actually use your "Product Range" page at all, you could replace it with a weblink using # as the url. Weblinks can be used as folders just like documents, and can make full use of template variables, content, etc, but if the user is ever navigating to that page specifically, this won’t solve your problem.

Thanks swespi, I will try that.

From "The (almost) Complete Guide to Creating Menus in MODx Using Wayfinder" by Kongondo

&categoryFoldersTpl
The template chunk for category folders, category folders are determined
by setting the template to blank or by setting the link attributes field to
rel="category"
placeholders: same as &rowTpl
example: <li[+wf.classes+]><a href="#" title="[+wf.title+]">[+wf.linktext+]</a>[+wf.wrapper+]</li>

Thanks for your help swespi and bunk58.

I have tried what you both have typed here, both ways displays this as the link: http://website.domainname.com/#, and when I click on the Product Range button now it takes me to the home page. Is there a way of preventing the website visitor to go the home page, when the Product Range button has been clicked on?

Just guessing, I didn’t test it: You could try to take
<a href="[~[*id*]~]">Product Range</a>
- so the link should go to the actual page itself with no visual effect.

Or use this plugin to fix null links.

Quote from: ottogal at Jul 20, 2010, 10:45 PM

Just guessing, I didn’t test it: You could try to take
<a href="[~[*id*]~]">Product Range</a>
- so the link should go to the actual page itself with no visual effect.

This should work, but make sure you tack a # on the end of the link like so:



If you don’t include the #, you’ll be reloading the page which could confuse some visitors.

You’re right, swespi.