Archived topic
Mini Mega Menu - Alphabetize by Column
5 replies · Started by mikeb82 on March 1, 2021
I have been running the all-CSS Mini Mega Menu on a client site and it has been working well. There is only one "Mini Mega" dropdown with 28 menu items displayed in two columns. Now the client wants the menu items alphabetical order, with certain items in bold. I was able to do this with the current menu setup. There is an issue with this setup. On smart phones and tablets the menu changes to a single column and the left column and right column are combined. The menu is no longer in alphabetical order since the structure is really 14 two-column rows. I need an arrangement as shown in the image below.
Note that the top graphic illustrates how the current menu works. On the current website dropdown, the top row has item A in the left column and Item H in the right column. When the menu "wraps", Item H moves under Item A, and so on until the two columns are combined. The original alphabetical listing is gone.

I need the entire right column to wrap beneath the left column.
I have experimented with a couple of the Mega Menu plugins, but they are a bit complex to set up and are overkill for just one dropdown submenu.
I tried the WP Mega Menu and Max Mega Menu Plugins.
Any suggestions you have on solving this issue are greatly appreciated.
Hi there,
I think the easiest solution is to create this menu item and its children twice with different orders - one for desktop and one for mobile.
Then use the built-in hide-on classes to hide one or the other as the first example here:
https://docs.generatepress.com/article/responsive-display/#using-our-hide-on-classes
Thanks Leo,
That's a great suggestion, and something I hadn't thought of.
Much appreciated!
Mike
No problem :)
Just checking back in to let you know that your suggestion works great. I recreated the menu item with the 28 sub-items and added the hide-on-desktop class to it. I then added the hide-on-mobile and hide-on-tablet classes to the desktop item with its 28 sub-items.
GeneratePress continues to have the best support in the business.
Thanks again!
Mike
Glad to hear :)