Problem With Menu

Hi Support,

I am having a problem with a sub menu where it wont appear. The site is http://www.spineplus-woodford.co.uk/ and the menu with an issue is the About Us - Our Clinics its the only sub menu i have but i am having this issue on this site and another that is very similar.

I have tried to rebuild the menu and i have turned off many plugins but it seems to have occurred during the last one or two updates i think.

Can you advise please?

Kind Regards

Mario

Hi there,

I checked your website with Google Chrome browser and it shows the submenu normally:

If you encounter a case that the submenu is not showing it might be a Javascript error caused by another 3rd party plugin or a customization code. Try to deactivate the extra plugins or remove the customization and test the case.

The reason submenu does not show when there is another javascript error is that the submenu itself uses Javascript, and when a Javascript error occurs the whole system went down and nothing works.

Thank you.

Hi Support,

Thank you for your quick response. The issue is when you roll over the Our Clinics menu and the menu on there does not appear.

I had tried turning off all the 3rd party plugins and the issue still remained but i then found code i added some time agao to give a slider on the menu and that seems to be the issue. Can you advise if there is a problem in the code that was supplied to me by a support team member here 6 -12 months ago that seemed to work fine for ages.

The code is:

.desktop .sub-menu {
max-height: calc(100vh - 80px);
overflow-y: scroll;
}

could i change or add anything to that to fix the problem?

The site has all plugins turned off right now except cornerstone and slider revolution.

Thank you

Mario

Hi there,

It works okay in my view, tried it on multiple browsers.

Have you tried clearing your browser cache?

Thanks!

Hi Rad,

Thanks for the reply, thats not what i was asking for support with.

Currenty the code to give a slide bar function in the menu is removed from the site, it was:

.desktop .sub-menu {
max-height: calc(100vh - 80px);
overflow-y: scroll;
}

Is the code i removed to get the page working as it is now, ok, or should it be amended to prevent the issue occurring again?

Thank you

Mario

Hi there,

Hmm, it’s a bit confusing. You said I am having a problem with a sub menu where it wont appear, then The issue is when you roll over the Our Clinics menu and the menu on there does not appear.

Perhaps you can fill more information of what we should expect to see, like the mockup design. Should the sub-menu appear full-height? That’s the CSS is about.

Thanks.

Hi Rad,
The fault as i have explained in my messages since then have explained, my issue is with the menu from Our Clinics wasnt working. I call it sub menu not sure what you may call it. When you go on to the menu now and place your cursor on Our Clinics the menu expands / opens up and you see the pages: Spineplus Chigwell - Spineplus Bow, Spineplus Harley Street & Spineplus Waterloo.

When the menu wasnt working you could only open the About Us & the when you tried to expand the Our Clinics part of the menu it wouldnt open.

So as i explained i turned off the Plugins, and it still didnt work and then i removed the code for the menu slider that i was given by a support team advisor in your company a while ago.

The code that was removed was:

.desktop .sub-menu {
max-height: calc(100vh - 80px);
overflow-y: scroll;
}

the code was to add a slider in the menu, so you could scroll to see the whole menu.

Not sure what you mean by “That’s the CSS is about” but is the code that i have removed ok, as it worked fine originally when i added it some 8-9 months ago. But obviously it isnt working now, so can i edit it or should i add different code? If so what is that?

Kind Regards

Mario

Hi there,

Ah, you mean that’s when that CSS is added, the 3rd level menu is not opening? That’s not really going to work, this overflow-y: scroll means it will only add vertical-scrollbar, the rest will be hidden. Plus, this .desktop .sub-menu means apply the styling to sub-menus regardless of level, hence, since it’s also applied to the second level, then the 3rd level will be hidden due to overflow-y: scroll of the second level. In summary, if you follow the logic/pattern of that CSS, it will not really display the 3rd level menu.

Perhaps you can provide a URL where this menu is working with that CSS?

Thanks!

Hi Rad,

I havent said that it was inside that 3rd line. The scroll code was for the “Treatments” tab of the menu where the number of items in the menu is longer and where on some screen sizes you cant see the whole list for threatements.

The menu slider is working on the “Treatments” tab on http://www.spineplus-chigwell.co.uk/ when you reduce the screen size down so you cant see the full list of treatments.

Kind Regards

Mario

Hi there,

I know, but your CSS affects all menu levels, hence, the issue started in the second level affecting the 3rd, so thus 4th and so on. What I’m saying is, your CSS itself is the issue, which makes me wonder, how does it work before when itself is faulty?

And thanks for providing another information, it’s very helpful. It’s the Treatments that you wish your CSS be applied for, right on the spot. I was confused about what’s not opening or not appearing :slight_smile:

The CSS you need is this to prevent it from affecting other menu levels.

.desktop #menu-item-10406 .sub-menu {
max-height: calc(100vh - 80px);
overflow-y: scroll;
}

Hope this helps.

Hi Rad,

Thanks for that. I have added it to the site and its not fixed it. There is no slide bar.

For now i have added the clinics to the sub menu as the site needs to be live.

Can you advise anything else to fix the slider issue?

Thanks again

Mario

Hi there,

The CSS works okay and tested, but will only work for Treatments. But I checked your site and yes I see what you mean and it targets both Treatments and About Us. How about staying on that setup since it works? That’s because it’s only good for 2 level menu. And it’s not gonna work on 3rd levels such as Our Clinics.

In summary, it’s not doable in the 3rd level menu (second sub-menu).

Thanks!

Hi Rad,

Sorry i dont know what you mean youre saying things i dont understand. The reason its working now is because it has the old code in it, as i need the site working today as its a very busy week for the clinic as you can imagine. With the new code you sent me it didnt work so i had to rearrange the menu but i would prefer not to have it that way.

Kind Regards

Mario

Hi Rad,

Also can you advise what may be wrong on this page as the content has all shifted to the left?

http://www.spineplus-chigwell.co.uk/

I have checked the template and the page settings but i cant see anything wrong with it to make such a change.

Thanks

Mario

Hi there,

The problem is simple here, you either can have that scrolling effect or the submenu in clinics. You can not have both. So you’d better decide to show the menus for the clinic in another way than having another submenu for the clinic.

The scroll code prevents any other sub-menus inside the main sub-menu.

Thank you for your understanding.

Please kindly do not add additional questions in the same thread as it prevents us to give you a quality support as we need to read all through the top to bottom to finally see the issue is completely different.

For each additional question kindly open up a separate thread and we will be more than happy to give you support with the focus to the matter.

Thank you.

Hi there,

It works now because there is no 3rd level menu which was the Our Clinics. Please check the provided screenshots :slight_smile:

What I’m saying is, your CSS doesn’t work on the 3rd level menu, of course, it will work now because there is no 3rd level menu like Our Clinics.

Please compare it from the previous screenshots. I think it’s best to provide visual guide :slight_smile:

Thanks!

Hi There Christopher,

I only want one menu to scroll, thats all i have been asking for. Its the treatments menu i would like to scroll. The Our Clinics doesnt need to scroll as there isnt enough pages that require it to scroll.

Thanks

Mario

Hi Rad,

Not sure what site you are looking at as i have changed the menu and you seem to be looking at a cached copy. The old code has been placed back on the site, as the code you sent didnt work. I change the menu there is no 3rd menu for the our clinics as the all appear in the second menu.

As you can see from the screenshots, i am seeing something different to you at the moment.

Many thanks

Mario

I checked your website and the Our Clinics does not have any submenu at all rendered in the HTML:

So at the moment even if we can isolate the code for that specific menu it will have no use. Kindly get back to us with the URL/User/Pass of your website using the Secure Note to check ourselves how you added the submenus of the Our Clinics and test the case first hand.

Thank you.