[Support request] Change the hamburger icon of the secondary menu

[Rafal]

Hi Tom,

hope all well,

How to change the icon on the secondary menu mobile view please?

thanks

R

[David]

Hi there,

will this icon be different to the Primary Navigation icon ?

[Rafal]

yes the plan is to have two different icons – one for the off-canvas menu and a different one for the secondary menu, the primary menu is set to empty – you can check it out here – https://malacukierenka.dev.tradik.com/

[Fernando]

Hi Rafal,

I see. Thank you for clarifying!

What you can do is to create two Block Elements with an Image Block within both of them. The Image Blocks would be your logos.

Then, one Block Element should be hooked to inside_slideout_navigation and the other to inside_secondary_navigation.

Example: https://share.getcloudapp.com/12uLEKZD

Hope this clarifies!

[Rafal]

hi guys,

here is what we are after:

https://pasteboard.co/FD5x22zSSVsr.png

with the solution you provided – we got the image displayed inside the off-canvas menu list,

thanks

[Fernando]

I see. One way to do it is through adding this CSS code in Appearance > Customize > Additional CSS:

.secondary-navigation .menu-toggle:before {
    content: '\2192';
}

button.secondary-menu-toggle span.gp-icon.icon-menu-bars {
    display:none;
}

You may replace \2192 with the icon/symbol you wish to use:https://www.toptal.com/designers/htmlarrows/arrows/

Kindly let us know how it goes.

[Author]

Posts