[Resolved] Primary menu disappears on mobile when off canvas activated

[cigilovic]

Hi there, me again! 🙂

I have tried to activate off-canvas menu while still using the primary menu. Set it up all, but on mobile view, I can not see the primary menu.

I use Autoptimize and WP Fastest cache, cleared cache and minimized files many times but doesn’t work for me.

https://drive.google.com/file/d/1r808eohr0BJMGMl5MAYCi3eX4DVmO-yK/view?usp=sharing

Is there a workaround for this?

Thank you

Osman

[Leo]

Hi there,

Doesn’t look like the off canvas is activated currently.

Can you activate it so I can see the issue?

Thanks 🙂

[cigilovic]

Hi Leo,

Thanks for your reply. Yeah, I had left it unactivated since it wouldn’t show up.

Now I have activated off-canvas and chosen of it in the layout section as my 2nd menu.

Desktop and Tablet are both OK, but when I choose mobile, there’s only off-canvas now. Since over 50% of my visitors are on smartphones this means they can not see the primary navigation.

Can you please check?

Thank you

Kind regards

[David]

Hi there,

In Appearance > Menus – Edit the Menu you have set to Display as your Primary Menu, under Display location also check Off Canvas Menu

[cigilovic]

Hi David,

I’m afraid this is not a solution.

I have already set it up as advised. I’m almost 100% sure there’s something wrong with it.

My primary menu and off-canvas have been all set up and pointed to correct locations.

And on my website, you can see I have the primary menu and off-canvas active visible.

But the problem is that when I shrink down the view to smartphone level, the primary menu disappears.

I went through them again, published and cleared the cache but doesn’t work.

Thanks

[cigilovic]

I have tried disabling my caching plugins, tried going through all the menu and layout options, cleared browser cache.

I’m afraid it doesn’t work, it only display off-canvas on smartphones. There’s no primary navigation. :/

[David]

aah ok – when you enable Off Canvas and include Mobile it replaces the normal primary navigation mobile menu.

What you could do is:

1. Remove the the Menu from the Off Canvas.
2. Then in Appearance > Widgets add a Navigation Menu to your Off Canvas and select the correct menu.
3. Now add your Primary Menu to the Off Canvas as well.

The off canvas will now display your 2 menus. Then we can add some CSS to hide the Primary menu within the Off Canvas on Desktop:

@media (min-width: 769px) {
    .slideout-navigation .slideout-menu {
        display: none;
    }
}

[cigilovic]

Thanks David, but this is overly complicated. So I basically have to recreate all my primary menu items for off-canvas as well manually.

And when I added my primary menu to off-canvas one, the items don’t look like menu items but plain links.

I think I’m fed up with that man sorry. Spent hours on this trying, but way too overly complicated.

This was one of the reason I went for premium :/

[David]

Sorry to hear that.

You should not need multiple menus.
You can assign a Menu to the Primary Menu and the Off Canvas Menu.

And i can take a look at the menu items looking like plain links (?) if you want.

Let me know.

[cigilovic]

Hi David,

What I understand from the instructions you provided is that I am able to add multiple menus. So in this case, I can add both primary menu and another menu to off-canvas while also having my primary menu.

So when I have a mobile user, the page will shrink and they will be left with an off-canvas menu which contains my primary and another menu. That’d solve my problem. But this doesn’t allow me to add 2 menus.

Can you please check? I think the instruction is wrong. Also, just a criticism, this should be a very basic feature. Promoting multiple menus on premium version but limiting usage of them doesn’t really make sense Kinda misleading to me.

Thanks

[David]

My approach for Mobile – based on your current setup of Primary and Secondary navs – would be:

1. Primary navigation set Display Location to: Primary Menu and Off Canvas Menu.
2. Secondary navigation set Display Location as is, and then add it to the Off Canvas Menu as a Navigation Widget.

This means there are only two menus to maintain.

It may take a little CSS to tweak things which we’re happy to provide.

Sorry if you feel its misleading – its not our intention and the three Navigation locations and the various options provide what most users require. But your comments and feedback are something we will take on board.

[Author]

Posts