mobile menu strange behavior | PenciDesign Support

radofurianin replied

5 years ago

Customer Reply

Thank you this helped

PenciDesign Supporter replied

5 years ago

Staff Reply

Hi,

Please go to Appearance > Customize > Custom CSS, then add following custom CSS code:

#navigation .button-menu-mobile {
    float: right;
    margin: -2.5px 0 0 10px;
}

.open-sidebar-nav #close-sidebar-nav,
.open-sidebar-nav #sidebar-nav {
    right: 270px;
    left: auto;
}

.penci-menu-hbg, #sidebar-nav {
    left: auto;
    right: 0;
    transform: translateX(270px);
    -webkit-transform: translateX(270px);
    -moz-transform: translateX(270px);
}

.open-sidebar-nav #close-sidebar-nav {
    left: 0;
    right: 270px;
}

Best Regards,
PenciDesign.

radofurianin replied

5 years ago

Customer Reply

OK Vertical Mobile Navigation has been turn on from the beginning and it is working for different menus but it is displaying from left to right and hamburger three lines are on the left site.
Is there a way to move all to the right side ?

PenciDesign replied

5 years ago

Staff Reply

Hi,

I said with you use the "Vertical Mobile Navigation" - not "Vertical Navigation" - It's different

You can check option for vertical mobile navigation via Customize > Logo & Header > Vertical Mobile Navigation.

If you want to select the custom menu for vertical navigation, please send me your WordPress site admin URL and admin account ( username and password ) - in a PRIVATE REPLY. I will take a look at this to help you.

Best Regards,

PenciDesign

radofurianin replied

5 years ago

Customer Reply

ok but now when I have enabled vertical Navigation it is showing me only one menu.
Where I can set up a different menu for each page?

PenciDesign replied

5 years ago

Staff Reply

Hi,

If you're using a custom menu for each page, you can't use the menu hamburger.. Because the menu hamburger just displayed one menu.

So, I recommend you use the "Vertical Mobile Navigation". To do that, please remove the code I sent and remove the menu hamburger icon on mobile via Customize > Vertical Navigation & Menu Hamburger > General > and check to "Hide Menu Hamburger Icon Display on Horizontal Navigation on Mobile"

Best Regards,

PenciDesign

radofurianin replied

5 years ago

Customer Reply

thank you it worked, but different menus which I had set up for each site now do not work (but only on mobile).
Do you have any ideas why? and where for mobile I could set up for only one page and categories set up different manu ?

PenciDesign replied

5 years ago

Staff Reply

Hi,

Yes, there are different menu items.

One is "Vertical Mobile Navigation" ( on the left side and settings for it via Customize > Logo & Header > Vertical Mobile Navigation ) and one is "Menu Hamburger" ( on the right side and settings for it via Customize > Vertical Navigation & Menu Hamburger )

If you want to get the Menu Hamburger display on the mobile instead of "Vertical Mobile Navigation", please add more this code to Customize > Custom CSS:

@media only screen and (max-width: 960px){
    #sidebar-nav, #navigation .button-menu-mobile{ display: none; }
    .penci-menuhbg-wapper{ float: left; }
}

Best Regards,

PenciDesign

radofurianin started the conversation

5 years ago

Conversation Start

I would like to edit the mobile menu to have on the right side a hamburger button and a menu sliding from the right side.
I've found in the "Vertical Nav & Hamburger Menu" option to enable Menu hamburger and when I am clicking it new hamburger button is appearing on the right side but I still have the same on the left.....
How I can turn off this menu on the left or edit it to be on the right side?

The menu on the right side is placed strangely.
And how to edit it after that.

Attaching explaining print screens.