Help making menu item unclickable.

[chriso]

Hello all,

Hoping someone can help me with a minor issue I’m facing.

I need to make a parent item unclickable in my dropdown menu.

Specifically the menu "Products" at http://www.eternus.net

Has anyone been able to figure this one out? I’ve searched a bit and have not found a solution.

Thanks,

-Chris.

[chriso]

Well at this point I’m willing to pay for someone to help out. Any takers?

[imported_Ryan]

You need to change the URL to just #. How you do this depends on what you have in your menu.

We provide paid support through our [iurl=https://geek.hellyer.kiwi/services/premium-support/]premium support service[/iurl].

[Anonymous]

I am having this same problem. I can’t figure out where to put the url of "#". Does this go under "Appearance" or does this go under "Custom Code"? If it goes under Custom Code, is there some way or some place I can find the html code to do this? I’m not very experienced with HTML but am trying to learn.

[imported_Ryan]

That is for the custom code section. There are many sources of information about basic HTML on the web. I don’t have time to teach HTML here though sorry.

Here’s a basic example of an empty link:
[code:dqjfsixt]<li><a href="#">link text</a></li>[/code:dqjfsixt]

[Anonymous]

Here’s my solution.

When you create the parent page (Products), in the name field, create the blank anchor like so [code:669xhuzq]<a href="#Products">Products</a>;[/code:669xhuzq]

So instead of just entering [b:669xhuzq]Products[/b:669xhuzq] in the name field, you create the link itself. This trick alone works. When you rollover the parent menu link, nothing happens when you click on it.

There is one bug with this trick. WP will create two anchor links instead of just 1 and it might cause your button to have extra white space around the text; this is based on your CSS and it did happen to me.

To fix this;
* I added jQuery to my theme’s header.php file.
* I updated my anchor link and added a unique class name to my page: [code:669xhuzq]<a href="#Products" class="unclickable">Products< /a>[/code:669xhuzq]
* I used the following query to look for "unclickable" and delete the extra anchor:
[code:669xhuzq]$(".unclickable").parent().find("a:first").remove();[/code:669xhuzq]

The above gave me a parent button that if clicked on, it goes nowhere but also preserves your CSS styles by removing an extra <pre><a></pre> tag

Hope this helps anyone. The site should be going live this or next week. I’ll post their url when its ready for everyone to see the results.

[imported_Ryan]

Hi,
Sorry for the ridiculously long wait time before I have replied.

Thanks for your input. I’d be more inclined to fix the CSS than use jQuery to fix that problem though.

[Author]

Posts