Extra menu in Primary menu bar

[Caetlyn]

I have an interesting question. I have an extra menu with sub-menus in the right html of the primary menu bar which is changeable depending on membership of my site. If the user is logged out, there is just one menu item. However, once the user logs in, they have access to the submenus from that one item.

My question is – is it possible to display the extra menu without the hamburger icon in mobile view? At the moment, it’s displaying hamburger icons for both primary menus and the extra menu, making the site look rather unprofessional and confusing as can be seen here – https://craftylion.com

Ideally, I would like to have the primary menu bar look similar to this site in the mobile view – https://www.daz3d.com

[scrambler]

Try using the style horizontal instead of standard in the shortcode

[Caetlyn]

Unfortunately, the menu then no longer becomes a dropdown menu which is the ideal style for my site. I have 5 submenu items and it takes up too much space in the mobile view.

[scrambler]

All I can think of, is that we could replace the hamburger Icon by the account icon.

But right now I cant see your menu anymore

[Weaver]

I don’t really understand your issue – like which menu item has the extra menu. Are you using Weaver’s extra menu shortcode?

So, are you seeing two hamburgers?

My thought would be to redirect to another page that uses the secondary menu to show the additional options for members.

I don’t think the extra menus were ever designed to work as a part of the primary or secondary menus, so I’m not optimistic of finding a solution. I it possible there could be some custom CSS to sort of handle this.

 

[Caetlyn]

I am using Weaver’s extra menu shortcode and used the accordion style rather than the horizontal style as Scramble suggested. It seems to have done the trick for now and I only see one hamburger icon but it’s not entirely ideal. I would like visitors to see the account icon first instead of having to expand the menu bar to reveal it.

How do you replace the hamburger icon with the account icon?

 

Edit: I’ve reverted back to the Standard style so you can see what my original issue.

[scrambler]

You have bigger issue with this setup on mobile:

First, the menu in the HTML are a only shows up if you open the main menu from the hamburger.

If you don’t mind that (account icon wont show up before they open the left hamburger), then we can simply Hide the hamburger menu in the HTML area with the rule below

#menu-options-x1-x .wvrx-menu-button {display:none;}

 

 

 

[Author]

Posts