Some Menu Dropdowns not showing

Hi there, so I am having quite a strange issue, some of my menu dropdowns are working whilst others aren’t.

If you look at my URL in the private section. You will see that menu items 3 – 6 won’t open the dropdown when you drag your mouse over each one from 1 – 6.

I have even changed the order of the menu items around to see if the rest of the current working dropdowns are having the same issue and it seems that even if you put menu items from 1&2 or 7 down, into the menu items 3-6 then they have the same effect.

The data inside the HTML blocks for each of the items are almost identical so I don’t understand why the other dropdowns are working and menu items 3-6 aren’t working.

Thank you!

Hello,

I have visited your website. Please Go to Appearance >> Menus. And delete those elements from the menu and then add them. Please make sure that you have added the HTML block as Dropdown for every menu item. Then Go to WoodMart >> CSS Generator >> Generate CSS file.

Then Check back. This will fix the issue.

Best Regards.

Hi there, I have attempted your advice however, every time I generate the CSS files, it breaks my testing environment. My /home page ends up going blank and everything on my testing environment just malfunctions. Please advise as this issue is still happening.

Hello,

Please deactivate all the third party plugins, activate parent theme. Clear cache and check back.

If the problem continues then provide with admin panel login details of the website to check it myself and help you out accordingly.

Best Regards.

It is still breaking my testing environment.

Hello,

I have logged into the website you provided the login details. It seems that the URL in the Settings >> General are not added as https:

Please make sure that you have set the URLs with https. This will fix the issue that breaks the website after generating CSS.

Screenshot for Clarification: https://ibb.co/BqZkSRq

Best Regards.

Thank you, I am syncing back the testing environment from prod and will give you feedback if it has fixed the issue

Hello,

You are Welcome.

Please save the settings as I mentioned above in Settings >> General. If the issue not resolved then tell me I will check it myself and help you out accordingly.

Best Regards.

Hi there, I have attempted this now in my prod as it doesn’t break the website, however the issue still remains in terms of the menu not loading some dropdowns.

Hello,

I have logged into your website and saw that you are using some third party plugin to display the categories links in the mega menu.

Screenshot for Clarification: https://ibb.co/CM73JsG

Please Go to Appearance >> Menu >> Edit Categories menu. Remove all the third party plugin categories you added to the menu and then add the categories to the menu using the product categories.

Screenshot for Clarification: https://ibb.co/DQrzCfh

Then deactivate the third party plugins. Clear cache and check back.

Best Regards.

But why would it work for some of the categories and not others? Changing it will not fix the problem, because the problem isn’t with the third party plugin. It is to do with your mega-menu setup.

If it was the third party plugin then ALL the menu dropdowns would not be working, which is not the case. It is only a select few that aren’t working.

I did as you asked, and as my above messaged noted, it had no affect. It is definitely something to do with the way in which you are structuring your `<div class=”categories-menu-dropdown vertical-navigation woodmart-navigation”>
<?php
wp_nav_menu(
array(
‘menu’ => $params[‘menu_id’],
‘menu_class’ => ‘menu wd-cat-nav’,
‘walker’ => new WOODMART_Mega_Menu_Walker(),
‘items_wrap’ => ‘<ul id=”%1$s” class=”%2$s”>%3$s’ . $html . ‘</ul>’,
)
);
?>`

Something must be causing a fatal error between id=2 & id=6

You have set the “Stretch row” option for the first dropdown that overlaps other menu items https://gyazo.com/c8a7f26fcec4666c1482b7f880fa4872
Please, disable all “Stretch rows” for those dropdowns.

Thank you that worked, but now my HTML Block (which has 5 columns in it) is not showing correctly.

So what must I set it to in order to showcase the items inside the HTML Block?

So I see if I set it to full width in the menu options it shows the full width of the menu. So that is now sorted. Thank you for your support in this matter.

Try to set full width design for each menu item https://gyazo.com/59b3d033af8891a34eae3e42fcd9d917

I just have two more issues in terms of the menu.

1. I would like focus to remain on the dropdown when you hover over the last two items in the menu. However when you hover closer to the left of the menu on the last two items, the menu disappears as it thinks you are trying to select the button on one of the products I have showcased. How would I focus the hover to the two last items without that interferance.

2. On scrolling down the page on the private link I have indicated, the sticky bar area with the “Post Free Ad” button ends up being unable to be selected as the items inside the sidebar end up interfering with it, what can I do about this?

Could you please explain in a bit more details and provide some screenshot? We don’t quite understand your issues.

It’s best explained when you psychically see for yourself what is happening, due to the issue not being able to be captured on a screenshot.

For Number 1. Please go to the link in my private section. When you move your mouse down the “Browse Categories” Tab you will see that you can’t get past Menu item=4 without the menu disappearing.

This is pretty much happening all over our website.

If we can sort out this issue for number 1. Number 2 may be solved in the process as well.

It happens because of styles in the plugin you use on that page https://gyazo.com/04d061aafdc0c6d8e27c464334345295
They have z-index higher than our theme’s menu.

Thank you for noticing that, is there anyway I can increase your z-index to be higher with some css code? I don’t want to mess too much with the .php files

Try to add the following code snippet to the Custom CSS area in Theme Settings to fix this issue.

.whb-main-header {
  z-index: 1001;
}

That worked! And it fixed my second question as well!

So thank you so much for the support! Sorry if I caused you to want to pull out your hair 😛 but I really appreciate all your support!

No problem 🙂 We are glad that your issues are sorted out. Feel free to contact us when you will have any questions.

[Author]

Posts