Archived topic
Mega Menu Not Working?
8 replies · Started by Mindy on March 23, 2017
Hello, I have followed the instructions on the documentation page for making a simple mega menu. I have added the css in the proper place in the customizer and added the mega menu class.
However, it does not change anything at all.
The menu under the word "My Condition" is what I would like to have as the mega menu. https://goo.gl/6XK1FT
Hi Mindy,
Looks like you missed the CSS class mega-menu in the parent menu item.
If you want to use 5 columns, this is what you want want to enter: mega-menu mega-menu-col-5
Let me know if this works.
Totally missed that! Thank you so much!
Is it possible to add a bottom border to the items under the parent menu? The items are currently bold, but I would also like to add a border.
Thank you!
One more thing, is there a way to add a character like ">" to go in front of the child items? (The menu we have has so many items, I think it would be less confusing that way on mobile).
Thank you!!
Looks like you've added a bottom border? Let me know if you still need help on that.
As for adding characters, you can use GP's built in FontAwesome library and insert them in the menu navigation label.
http://fontawesome.io/icons/
Let me know if if you need more info :)
Perfect! Thank you so much Leo!
Side note, the menu became unassigned from being the "slide out" menu when I changed the menu. Easy fix though!
Also, a question about the slide out menu on mobile. Currently when a parent menu item text is pressed, the menu disappears. Is it possible to make it so that the submenu opens and closes with touch? So basically the parent menu item can have the functionality that the little dropdown button at the far right does? I think it is slightly confusing for the menu to close when the text is pressed.
Thank you again!! :D
Can you try inserting # for the URL in all the parent menu custom links as seen in this page?
https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#custom-link
I think "My Condition" is the only one that # is added which is working correctly on mobile.
Let me know if this fixes it.
Great! Thank you so much!!
You're very welcome :)
