Menu Not Working On Smartphone And Tablets - Question | JoomShaper
SP Page Builder 6 is Here! Learn More →

Menu Not Working On Smartphone And Tablets

JK

Jan Korshavn

Helix Framework 1 month ago

We experience problems with the menu on www.basketballdommer.com.

When using a smartphone (vertically) the main menu (appearing on the right side) disappears at once when you try to use one of the menu items (top level) and because of this the sub menu items are not available. This was working fine until recently.

Also, if you try a table (iPad) in the vertical position, the «hamburger menu» is not visible at all.

Could you please advice on this issue?

0
18 Answers
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 month ago #202733

Hello,

Please, use this css in your custom code css section, You can check this documenation also:https://www.joomshaper.com/documentation/helix-framework/custom-code-css-js-meta

@media (max-width: 991px){
header#sp-header div#sp-logo {
    width: 30%;
}
header#sp-header div#sp-menu {
    width: 70%;
}
.burger-icon>span {
    background-color: #ffffff;
}
}

Thanks

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202734

You mean the css inside the template setting?

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 month ago #202740

Yes, You can check the documentations, Where you have found how to add custom code in template options.

Thanks

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202752

Code is added, but stil does not work on Apple's browser Safari. Testet Firefox for iPhone, and it works fine. It should not be necessary to use custom css for the menu items and sub menu items to work properly.

Please advice further for a solution that works.

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202754

Maybe sone of the code already placed in the custom css is in conflict with your suggestion? Please log on and check the total custom code in the template.

In Safari I see the that the menu item presently showins is not blue as it is in Firefox. These colors were fixed by custom code after at suggestion from Joomshaper in an earlier support case.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 month ago #202760

Please, add screenshot of your issues.

Thanks for your cooperations.

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202801

https://drive.google.com/file/d/1Dx8g-8u4cKss6Rp0gZirkGJGmRZM8ZTx/view?usp=sharing (Firefox)

https://drive.google.com/file/d/13CpjSBuQ8sc78u3OCjphCf3MjWJPVeIE/view?usp=sharing (Safari)

You should test this with an iPhone and Safari browser, you will find that the menu (and sub menus) don't work. However it works on Firefox for iPhone.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 month ago #202842

Please, check my screenshots, I take them from Mac Safari and iPhone safari browser.

Thanks,

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202872

OK, but that still doesn't explain why we can't use the menu on our iPhones. It's not only me.. When trying to click on a menu item, the whole menu area disappears..

And, this worked fine intil recently so something has changed.. What can we do?

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 month ago #202876

Could you please check again now? Before check, please clear your Joomla and Browser cache.

Thanks

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202877

The off-cancas menu still doesn't work on Safari. But now the menu item Arkiv is blue and not the Hjem (Home) as before. It should be the present page/menu that is blue. Have you done any changes that could affect that? Works on Firefox for iPhone

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202879

I updated the Helix plugin and reinstalled the template, still the same issue with Safari on iPhone.

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202881

Checked also the Safari on vertical iPad and that works perfectly now. Hamburger is also visible now.

So then this issue only appears on a vertical iPhone using standard Safari browser.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 month ago #202898

I believe your issue has been resolved. Previously, the parent menus that had submenus were assigned system links as the menu heading, but they should have used the system URL instead.

Check from incognito mode.

I’ve fixed all the menus—please check and confirm.

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202900

It's still the same. As soon as you touch an item on the offcanvas menu, it disappears.. Have you testet using iPhone/Safari?

And why is the menu item "Arkiv" in blue when I'm on the "Hjem" (Home) page?

Update: I cleared the browser cache, and it now works. Also the color problem is gone. Looks like it's all good.

Have you done something other than changing the system URL in the menus?

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 month ago #202901

Yes, All good.

Please, clear your Joomla and browser cache then check, Or try form different device with incognito mode.

Thanks

0
JK
Jan Korshavn
Accepted Answer
1 month ago #202902

Now there's suddenly no image when I share our URL to Facebook... could something have affected that feature?

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 month ago #202905

No, Check your url from here: https://developers.facebook.com/tools/debug/

Thanks

0