WordPress Quad Menu Help

HippySunshine

Senior Member
I have been asked to take a look at an existing WordPress site, that someone else built.
They have the 'Quad Menu' WordPress plugin installed and using this for their multi-level drop down menu.

In the dropdown, they have the post categories on left side, and ALL of the posts on the right side:
Screenshot 2019-10-16 at 10.26.03.png

What they want, is to show NO posts on the right side, and when hovering over a category, to show posts within that category only on the right side.
I hope this makes sense.

The Quad Menu admin is very confusing (with what the previous dev has set up) and I don't know how to go about this.

Any ideas?
 
Not sure you can do this with the plugin. To display the posts for a specific category requires conditionals and that needs a new theme function, not something Quadmenu supports (at least not the free version).

It's not a hugely complicated thing to code but it create a horrible menu system on mobile phones. The UX is so poor people will prefer to find another way to navigate around the site. Or more likely leave the site. Avoid dropdown menus wherever possible, there are much better ways to access the accommodation - none of which use menus.
 
Not sure you can do this with the plugin. To display the posts for a specific category requires conditionals and that needs a new theme function, not something Quadmenu supports (at least not the free version).

It's not a hugely complicated thing to code but it create a horrible menu system on mobile phones. The UX is so poor people will prefer to find another way to navigate around the site. Or more likely leave the site. Avoid dropdown menus wherever possible, there are much better ways to access the accommodation - none of which use menus.

Thanks for much for your help.
Let's ignore the fact that it will create a horrible menu on mobile for now, where do I start with coding this with conditionals?
 
You are going to be building a menu from scratch.

First job is to get all the categories and build the list.

second job is to loop through all the categories and loop through all the posts and find where the categories match. If there is a match you build new lists of posts (one for each category).

Once you have all your lists can add the assembly to the menu.

There are a number of Wordpress functions that will help, the main one being wp_query.

I’m out now, I’ll post some links later.

Note: all of the above goes in the theme functions.php
 
Right...

This will get you all the categories: https://developer.wordpress.org/reference/functions/get_categories/

Loop through the categories to get the posts: https://developer.wordpress.org/reference/functions/get_posts/

Build the post list from the array to get the menu item.

Then add the menu item: https://developer.wordpress.org/reference/hooks/wp_nav_menu_items/

Adding the menu item in a certain position is a little more tricky but this offers a solution: https://stackoverflow.com/questions/32203672/how-to-add-custom-menu-to-certain-position-in-wordpress

How you built the lists is up to you. There are a number of ways to do this - which one you use depends on your preferences. I'd to it using arrays, you might just want to use a for/while loop.
 
Back
Top