The Support Forums will be in read-only mode for a scheduled maintenance window on 01 September 2016 14:00 UTC - 20:00 UTC. More information.

How can you create anchor links in menu drop down? (3 posts)

  1. urbanrich
    Posted 2 years ago #

    Hiya all

    I'm trying to change menu links into anchor links. I have a page called 'Menu' that I would like to have a drop down list with links that jump to certain parts of the page i.e 'Burgers'. Then users can jump from another page directly to the linked area of the 'Menu' page.
    I've read a few different topics discussing how to do this, but seem unable to get it to work for me.
    Can anybody please give me any advice how I can achieve this?

  2. Andrew Nevins
    Forum moderator
    Posted 2 years ago #

    It's not clear why you reposted this in the Hacks forum, or at all.

  3. webmaster808
    Posted 2 years ago #

    Five easy steps to get what you want

    1. Get this plugin. https://wordpress.org/plugins/custom-menu-shortcode/

    2. Create a new custom menu in Appearance>Menus. Let's call it Menu Menu.

    3. Create your menu items by using the "Links" menu object type.

    In the config box for the first Link Menu Item, you would use something like this assuming you have a top level page named Menu:

    URL: http://yoursite.com/menu/#section_one
    Link Text: Section One

    The next one would be:

    URL: http://yoursite.com/menu/#section_two
    Link Text: Section Two

    4. Then in your "Menu" page use the wordpress custom menu shortcode to insert the menu into the page like this:

    [custommenu menu="Menu Menu"]

    Now you should see the Section One and Section Two menu items within the "Menu" page content. You will probably need to adjust your css to get them to display how you want(as a dropdown) but the links should be there.

    5. Then all you have to do is add id="section_one" and id="section_two" to the elements where you want to jump to

    Another way would be to use a form select element with a click handler script that would redirect to the page anchor.

Topic Closed

This topic has been closed to new replies.

About this Topic


No tags yet.