[Support request] Retain Off Canvas Functionality But Hide the Default Trigger

[Michael]

Currently I’m using the primary, secondary and off canvas panel. The off canvas panel is set to Desktop only but I would like to hide the default trigger (see screen capture) and replace it with a custom link I created in the secondary menu with the slideout-toggle class applied to the link. I would also like to hide the empty little square icon that seems to pop up when applying the # to the URL to trigger the slide out.

Thanks much,

Mike

[Ying]

Hi Michael,

You could use this CSS to hide the hamburger icon:

.menu-bar-item.slideout-toggle.has-svg-icon {
    display: none;
}

Then apply this CSS class to the link in your secondary menu: slideout-toggle.

And this CSS to hide the square:

.slideout-toggle:not(.has-svg-icon) a:before {
    display: none;
}

Let me know 🙂

[Michael]

Thanks Ying. The first part worked great. I had to add just a little more on the second solution and it seemed to work great.

nav#secondary-navigation .slideout-toggle:not(.has-svg-icon) a:before {
    display: none;
}

Thank you again,

Mike

[Ying]

Great, you are welcome!

Glad it worked 🙂

[Author]

Posts