Main Side in Menu not available

Hey There,
I’m able to open the Main Side “Transport” via Laptop on my Website
http://neu.stroma-logistik.com
BUT NOT via Mobile Device - (only the sub Side “Referenzen”)
Would you please check that, and tell me what’s the issue.
Thanks so much!
Susanne

Hi Susanne,

Thank you for writing in, the Navigation Dropdown element is not designed for mobile, as you can see on small devices the Dropdown is cut off.

For mobile menu, please use either the Navigation Collapsed or Navigation Layered instead, and set the Sub Menu Trigger to Sub Indicator so you can navigate the parent menu item.



Hope it helps,
Cheers!

Hi friech,
first thanks to you a lot! I joined the Navigation Collapsed, and it works! -
BUT-
Now, on my mobile device “Referenzen” is not shown, and on the tablet once I can open “Referenzen” but not a second time…
What wrong???
Thanks for help!
Susanne

Sorry I forgot: the site is now online:
www.stroma-logistik.com

Hello Susanne,

I have checked your site in my mobile phone and I am seeing this:

Please increase the content max width of the off canvas so that there is enough space to click around. At the moment, it is to tiny space that you cannot tap on the arrow to display the submenu.

Hope this helps.

Hi RueNel, and thanks for the answer but -
I’m desperate and confused…
I increased from 10 to 15 - no submenu!
I changed to navigation layered, - no submenu… I cannot seperately tap on the arrow.
It must be possible to have a submenu!
Whats wrong???
Please help!

Thank you Susanne

Hi Susanne,

Would you mind clarifying what you are trying to achieve?

I can see it is the same for me here. Logistik has 2 submenu on both desktop and mobile view. After you give us more details, please share credentials inside a secure note so we can see your setup to avoid much back and forth. Thank you.

It works perfect on the desktop as you tryed it, but not on a mobile device! Sometimes the first time - yes but not a second time!
What happens is the following:
I visit the --> logistik - site then the --> Referenzen , then I go to --> Home, back to --> logistik, try to open “Referenzen” again - Logistik will open but not Referenzen. - after 3-4 repeats it works…
Sometimes Referenzen will get open, sometimes it will not…
and
have a look when you tap on logistik: a blue frame will appear for a second, that shows that you can’t tap on the arrow seperately. In the frame is both: logistik AND the arrow. usually you should join one of them as it is on the desktop - device.
Hope you understand …
Thanks
Susanne

Hi Susanne,

Please add a fix width to the sub-indicator so the indicator will have a wider space to tap on mobile.

Also, add this on your Navigation Layer’s Element CSS area to make sure the sub-indicator has a higher z-index than the text label.

$el i.x-anchor-sub-indicator {
	z-index: 10;
}

Hope it helps,
Cheers!

Hey friech,
thanks al lot, but nothing really changed…

The Process:
On the homesite I open the main menu, and then in the main menu I tap on “Logistik” - I’m now NOT able to open "Logistik (L)"but “Referenzen” ®…
It’s now the same Situation as when I opend the thread - I cannot open the main menu (only after I go to Referenzen first, after that I can open the main Menu L!
What I need is - as usual - to open the main menu and then have the joice to open either the mainsite L or the sub menu - to open the subsite R.

I’m only able to tap on both simultaniously, the logistik (“L”) AND the arrow. I cannot seperately tap on either the Logistik or the arrow. I think THAT is the Problem.

It’s really urgent, please help! - I send You the secure note to enter my site and look for the issue…
Tanks a lot - Susanne

Hello Susanne,

You have forgotten to send out the username as well.

Anyway, to resolve your issue, please edit your header and then in your navigation layered element, go to the element Settings > Set Up and then make sure that the sub menu trigger is set as “Sub Indicator”.

Hope this helps. Please let us know how it goes.

…that´s what friech suggested 12 days ago, and I did! - But it didn’t help. Please read the whole conversation… I send you my user-Name next to that message in the secure Note…
Thanks a lot! Susanne

Hey Susanne,

I went to your WP Admin but it won’t load.

I could tell the issue even without logging in though. The issue is that you have different headers. I could see that you have 2 different Navigation Layered setup that’s why the behavior is different when you visit different pages.

So you won’t get confused, delete all of the other headers or only use 1 header for your site and assign it globally. If you wish to stick to your current setup, make sure you apply the same settings to all of your headers including the elements inside it like the Navigation Layered.

In the Sub Menu Trigger option, you can then choose the Sub Indicator to Trigger the Sub Menu as my colleagues suggested and it will open the page when you click on the menu text and open the sub-menu if you click on the sub-indicator. You can’t have both like the desktop version because, in desktop, the trigger is through hover and that’s only available in desktop.

Please watch the explanation in the secure note.

If you still have issues with this, please fix the WP Admin login.

Thanks.

Thanks Christian,
I saved both menus (inline and layered) as a preset and applied them in each headers. It should be now the same menu on each Site.
Now the problem is that I can’t reach the subsite. :frowning:
I send you the enter to my dashboard in the secure note again. Please try it again!
Thanks Susanne

Hello Susanne,

I have logged in and edited your headers (all of it). I added the custom css suggested by @Friech at each of the navigation layered element. You can now click the arrow or submenu indicator in mobile device screen.

Please check your site in your mobile phone now.

Hi RueNel,
Thanks for your work on my website! Unfortunately it stil doesn’t work.
Please try it twice a time to reach logistik and then Referenzen. It needs severalt times tapping on logistik to get on Referenzen.
What can we do?
Susanne

Hi Susanne,

After several rounds of tests together with @friech we found that the ultimate solution was the one he suggested previously which was to change the width of the Sub indicator to 40px. The width of the sub-indicator was making it impossible to get touched on the phone.

If you look at the homepage now and try it on a phone, the issue should no longer be there. I’ve tested it on a phone both before the solution and after it and the difference is easily experienced.

Can you confirm it’s fixed on your end as well?

Just an FYI, we only updated the Header that’s assigned to the homepage named Stroma_H_2. Once you confirmed it’s working, you can apply it to the other headers.

Now, we’ve thought about why it was not working the first time around. It’s important to know why so that we can be sure it’ll work on the other headers when you apply it to them. We figured that perhaps the width adjustment was not applied to the SUB INDICATOR SETUP.

To do that, when inspecting the Off Canvas element, make sure to click the Links tab first, then the Sub Indicator tab. Please see the underlined items on the screenshot below:

This should do the trick.

Lastly, just to be get ahead of possible issues, if you feel that the “clickability” of the sub-indicator, though it has improved, can still be improved, you can play around with the LEFT margin under the SUB INDICATOR MARGIN field group. You can change its value to auto.

All the best,
Ben

It works! Thank you so much!
Susanne

Glad to hear it’s sorted, Susanne.

Have a nice week ahead.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.