How to deactivate menu button for dropdown menus

  • I’m setting up a new site and have activated the drop down menus in the site’s theme and put together a custom menu using WordPress’ menu tool. The only issue I’d like to resolve is having to create a separate page that acts as the anchor in the menu bar for the drop down menu.

    I’d like to have 2 pages in the drop down menu (Photos & Videos) that would drop down from a Media menu bar button. I’ve done this and it works great except for the fact that in order to get the Media button on the menu bar to be the root for the drop down, I had to create a separate page called Media. This page is clickable and blank because I have no need for that page.

    Is there anyway to make a menu bar button that only acts as an anchor? Or is there a way to make the Media page not clickable from the menu bar so that it only acts as the anchor?

Viewing 2 replies - 1 through 2 (of 2 total)

  • hi

    What I have done is, within the custom menu setup
    1) set the link href for the Media page to # – that is a link to the same page you are already on

    2) find out the ID assigned to the A tag that contains the Media option. You can do this by looking at the browser’s View Source. For example, on one of my custom menus, the ID of the link I want to treat as you do is menu-item-249

    I added CSS to the stylesheet of

    li#menu-item-23:hover a { cursor: default; }
    (you can’t copy that code, you have to find the correct ID to use based on the specifics of your site).

    The end effect of both of those changes is when the cursor moves over the Media tab it looks like a normal cursor. There is no indication there is anything to click. Even if someone does click, because of the # link the page stays right where it is.

    You do require the blank page for Media as a placeholder. Ive not found a way around that so far. (Although a “custom link” (upper left corner on the menu page) of # might do the trick – I’ve not tried that yet)

    The CSS I gave you might need to be a little more specific – if it doesn’t work that is likely the problem.

    Here is some code from the WP menu code I referred to:

    <li class="menu-item menu-item-type-post_type menu-item-23" id="menu-item-23"><a href="#">Media</a>
<ul class="sub-menu">

    Thread Starter jchristian79

    (@jchristian79)

    Thanks for the advice. I added a custom link menu with # as the url and Media as the title under WP’s menu’s. This added a menu item with Media as the title in the menu area. I then deleted the Media page and then moved the Photos & Videos pages in the custom menu area to be under the new custom link menu I created.

    This works well enough I think. The cursor still changes when you hover over the Media menu button, but when you click it doesn’t do anything since the url I set is #.

    So, it does appear that I do not have to have a placeholder page in order to have two pages as a subpage of a inactive menu button.

    I haven’t tried any of the CSS modification yet though. Not sure if I will since I’m not familiar with that at all and I think this will do what I was wanting anyway. Thanks again for the help!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to deactivate menu button for dropdown menus’ is closed to new replies.