[Resolved] Change Hamburger Icon in Slideout Menu

[mdgallagherdesign]

Hey!

So I have poked around on here and the solutions I found were not working.

Is there a way to change the hamburger icon to another icon from font awesome, specifically shopping-cart?

[David]

Hi there,

do you already have Font Awesome installed on your site? And if so which version 4 or 5?

[mdgallagherdesign]

Hi David!

I have Font Awesome 5 plugin installed.

[David]

Try this CSS:

.slideout-toggle a:before {
    content: "\f07a";
    font-family: 'Font Awesome\ 5 Free';
}

[mdgallagherdesign]

That didn’t work, the hamburger icon is still there. 🙁

https://cateringwebdesign.com/alt2/

[Tom]

Try this instead:

.main-navigation .slideout-toggle a:before {
    content: "\f07a";
    font-family: 'Font Awesome 5 Free';
}

[mdgallagherdesign]

PERFECT!!! THANK YOU!

[Tom]

You’re welcome 🙂

[Author]

Posts