A website I'm working on has a lot of menu items, so they were split into two menus. There's a more button which shows the second menu using JS (only one is shown at a time).
What I want to achieve is that when a user clicks on an item in the second menu, the second menu is displayed by default after reloading.
For this, I need to know if the current page is in the secondary menu, but I don't know how to access the menu items. More specifically, I can't find out what the ID of my menu is (I guess I should use the wp_get_nav_menu_items which needs a menu ID).
WordPress adds the current_page_item class on the li in the nav of the current page you are on. So you can use that class to style the current page item.
Related
On my Wordpress site I have the main primary menu set up with links to pages & top level categories. When I'm viewing a page the top menu highlights the proper menu item and all works just fine, but when I click on a post that falls under one of the category menu items it is not highlighted. I want the category menu item to highlight when I click on a post that uses that category. How would I accomplish that?
Website: http://deutschmetal.com If you click on this post: http://deutschmetal.com/deutsch-metal-videos/rammstein-herzeleid-videos/ you can see that the top menu link "Videos" is not highlighted. I would like it to be highlighted when viewing the post.
Wordpress detects it if a page is the child of a page in the navigation. It also adds a extra class to it, so you can create some new CSS to make it look the way you want. In your case this would be:
.current-post-parent.current-post-ancestor {
background: #cb0808;
}
You can add this in your Wordpress theme, or if you are not familiar with coding you can use the customizer's custom CSS that is supported is most of the themes.
How can I get this menu in Divi theme?:
Take these steps
Log in to your WordPress dashboard and go to Appearances > Menus. I assume you have a menu set up
I am assuming you have a menu that has a Menu item that is NOT a submenu let say it's called Features and under that you have submenus called Feature 1, Feature 2 etc.
Now in order to make your Megamenu you have to add a special CSS class to the main top tier link called “Features”. You can do that by clicking the screen options link of the top your page and making sure the CSS class option is checked.
Finally, you need to add a css class to the “Features” link you just created. Click the arrow on the right of the “Features” menu item to toggle the additional configuration options. Find the text box labeled CSS Classes and enter the class mega-menu
That's it basically. There is official documentation on how to do this
I have managed to add a 3rd level menu item into Drupal, however I can only see that menu item when I am on the parent page for that item, if I am on another page and view source the code for that menu item does not exist.
I have looked through all of the settings and can not find anyway to change this, what can I do to fix it?
Thank you
Figured it out, if anyone is wondering you go into Structure > Menus > Main Navigation.
You then click edit on the parent item and check the box that says Show as expanded.
I would like to be able to create a navigation menu in WordPress in which the top-level nav items are not pages, but rather menu headings, which expand the sub menu when clicked.
The default WP menu behavior is that all menu items are links to content (pages, posts, etc), and that sub-items are viewed upon hover.
I'm looking for a way to make it work more like the menu behavior built into Twitter Bootstrap (and for the same usability reason).
I'm looking for a solution that either already exists as a plugin, or which I can build into a plugin, so that anyone can create a new menu like this in the WordPress menu editor.
checkout this tutorial :
https://digwp.com/2011/11/html-formatting-custom-menus/
If you dont want any custom html structure than you can simply add the classed to menu and for top level menu create a custom link with # as href.
I only want to show the pages that do not have parents, and link the other pages from their parent pages.
I want to have a simple main menu: Home | Pages | About | Contact
About 8 pages are linked from the Pages page. At the moment, the menu has 12 items, which deforms the layout pretty badly.
I have tried making the pages private, unpublished, and other options, but that doesn't seem to be the way to do it. Is there a way I can just have only parent pages linked in the main menu?
You can edit the menu (under the appearance tab in the dashboard). (you may need to add a new menu and assign it to the main navigation menu. It sounds like you have the defaulted menu set-up.
Once you've added a menu and assigned it to the main navigation, you can uncheck "automatically add top-level elements" or its equivalent, and add/remove menu items. You can also change their hierarchy (independent of actual page hierarchy).
It's all so easy these days. Just Go to appearance>menus>click the little triangle next to the listed page name>click remove> don't forget to save ... all done!
Maybe you didn't set up a custom menu yet. Set up a custom menu first with the desired pages / links. If it doesn't show on your site, check custom memus are enabled in your theme.. this will help you setting up a custom menu: http://www.wpbeginner.com/wp-themes/how-to-add-custom-navigation-menus-in-wordpress-3-0-themes/