#129398 Menu Mobile Header Preset or Header Builder

Landing Forums Jupiter WordPress Theme Menu Mobile Header Preset or Header Builder

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • pierluigi di rollo

    Good morning
    I have to insert a menu mobile.
    Do I have to use the header builder or can I do without it and continue to use the preset headers?

    The drag and drop of the header builder does not work (even when installing a Jquery plugin).
    Can you help me?

    Amir Rather Support Team

    Hi There

    Could you please send over your site URL and administrative WordPress access(in a private reply) so we can check what might be going on in the backend? We’ll need permission to debug this.

    Regards

    Private
    pierluigi di rollo
    This reply has been marked as private.
    Tatyana Hutsol Support Team

    Hello,

     

    The mobile menu can be used with pre-built headers too. When you resize the browser, the main menu changes to the burger menu for mobile https://prnt.sc/1qfgkm5 .

    As for the Header Builder, I installed the plugin “Enable jquery migrate” and set “Legacy” version in the settings https://prnt.sc/1qfgox0 . Now the elements can be added in the Header Builder.

    Please check.

     

    Regards.

    pierluigi di rollo

    Hello
    i need to insert two different menus.
    one to be displayed in the desktop header and one in the mobile header without using the Header Builder but using the preset builders as we are doing now. It’s possible? Thanks

    Alexander Hutsol Support Team

    Hello,

     

    Unfortunately, it’s not possible to define a menu for Mobile. However, there is a workaround which I believe you can apply and get benefit from it.

    Let’s say you’re using Primary Navigation on Desktop. The workaround is, adding the mobile menu inside the Primary menu (merging) but with adding “only-mobile” classes like this: http://take.ms/nS5Vd

    Also, you have to add the following code in Theme Options > Advanced > Custom CSS:

    .only-mobile {
    display: none;
    }
    @media handheld, only screen and (max-width: 1200px) {
    .only-mobile {
    display: block!important;
    }
    }

    To hide desktop menu items on mobile, add the class “only-desktop” to desktop menu items and this code in Custom CSS:

    @media handheld, only screen and (max-width: 1200px) {
    .only-desktop {
    display: none !important;
    }
    }

    With this way, your menu item will only be visible in mobile (the ones that have .only-mobile class). As I said, this is a workaround at the moment and it’s based on merging 2 menus together and hiding/showing in different devices widths.

     

    Thank you.

    Regards.

Viewing 6 posts - 1 through 6 (of 6 total)
You must be logged in to reply to this topic.
Login