Mobile menu not working in certain pages

  • Resolved samuelmartin

    (@samuelmartin)


    5 years, 10 months ago

    Hi:

    When I test the mobile menu in any of the product pages of the site I am building, the menu doesn’t work when on an actual mobile phone. However, when I test it on the browser’s developer section, it does. Naturally, I am interested in the menu working on mobile phones and I just can’t figure out what the issue is and how to correct it.

    Could anyone please let me know what might be going on and how I can resolve this?

    Thanks a lot in advance.

    • This topic was modified 5 years, 10 months ago by samuelmartin.

    The page I need help with: [log in to see the link]

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Author Rui Guerreiro

    (@takanakui)

    Hi @samuelmartin

    I’m seeing it working fine in the browser and mobile. The only thing I notice is a javascript error that isn’t from the plugin and also some extra padding in the body element.

    Add the code below to adjust it.

    
.mobmenu-push-wrap, body.mob-menu-slideout-over {
    padding-top: 0px!important;
}
    Thread Starter samuelmartin

    (@samuelmartin)

    Hi Rui:

    thanks for your email. I apologise, I had provided you with the incorrect link. The mobile menu does not work when you land on any actual product page, not category.

    Example – https://www.site2.samamartin.com/product/dhb-30

    But you can browse the site and once you go into any individual product page, the mobile menu does not work. Only the logo will allow you to click and take you to the home page. Can you shed any light that can help?

    Plugin Author Rui Guerreiro

    (@takanakui)

    Thanks. Can you get rid of this code that is creating an error in the javascript?

    $("here_put_menu_selector").append('
    https://cl.ly/6b8bc872273d

    All the Html of the menu is there but something is preventing the click of the button. I think it’s something related to the JPanel that is placing the Html of the mobile menu in a different level of depth.

    https://cl.ly/6b8bc872273d

    Try this custom JS

    jQuery( document ).ready( function($) {
     jQuery('body').append(jQuery('.mob-menu-header-holder' ).detach());
});
    • This reply was modified 5 years, 10 months ago by Rui Guerreiro.
    • This reply was modified 5 years, 10 months ago by Rui Guerreiro.
    • This reply was modified 5 years, 10 months ago by Rui Guerreiro.
    Thread Starter samuelmartin

    (@samuelmartin)

    Hi Rui:

    I deleted the code you pointed out to and added your custom JS into the custom JS window within your plugin’s general options but when I do that not only it hasn’t corrected the issue in the product pages, but now, in every page, the logo section remains over (on top of) the flyout menus, making impossible to select the upper categories/ salections.

    I have left the code you gave me on so you can see for yourself. When you use a computer to preview, it shows fine, but when you use an actual mobile phone to view the site, the issue is there.

    Can you advise, please?

    Plugin Author Rui Guerreiro

    (@takanakui)

    @samuelmartin

    Need to ask something in private.
    Can you send me an email to [support AT wpmobilemenu DOT com]

    Thanks

    Thread Starter samuelmartin

    (@samuelmartin)

    Hi Rui:

    Email sent to you. I hope to hear back from you soon.

    Plugin Author Rui Guerreiro

    (@takanakui)

    @samuelmartin

    Just replied, let’s continue the conversation there.
    Thanks

    Thread Starter samuelmartin

    (@samuelmartin)

    After just a few hours, you came up with a solution and solved the problem. Top dog!! And top customer support!! Actually, quite impressive..

    Thanks, Rui!!

    Plugin Author Rui Guerreiro

    (@takanakui)

    @samuelmartin Thanks for the kind words. I’m just doing my best.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Mobile menu not working in certain pages’ is closed to new replies.