Site logo

Archived topic

Change the hamburger icon of the secondary menu

5 replies · Started by Rafal on June 5, 2022

Viewing posts 1–6 of 6

Hi Tom,

hope all well,

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

thanks

R

Hi there,

will this icon be different to the Primary Navigation icon ?

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/

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!

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.

This archived topic is closed to new replies.