Looking for a way to change the look of the default hamburger menu icon in the navbar widget, but so far I’m stumped. Is this possible?..
Hi @Bulleit,
There are a few different things you can do to customize this, what did you have in mind?
Basically the icon that is in there right now is the default, but the icon itself isn’t what is causing the menu to open/close (it’s the container that it is in called “Menu Button”). For example, you could design your own icon if you wanted and upload it (png/svg/jpg) into the “Menu Button” container, then delete the icon that’s in there. Your new icon will take its place! Don’t want to design your own icon? There are some great ones here: 21,203 menu icons - Iconfinder or other design sites online.
If you just wanted to change the color and/or size of the icon, all you need to do is click on the ‘Icon’, give it a class, then change the styles (color, size, etc) in the ‘Typography’ section of the ‘Style’ tab on the right panel.
Hope this helps!
Mat
7 Likes
@matvogels, I was just looking to change the color of the icon - that worked! Thanks!
Great! Glad I could help.
Hi Mat,
Could you tell me exactly how to do this? I can’t figure out how to replace the Hamburger icon. Do I have to find a folder, or can I replace using the css background?
Thanks,
Stu.
Hi Stu,
If you just wanted to change certain properties with the icon that is there (i.e. color, size, add a border, etc), then all you need to do is add a class and play around with the CSS in the Typography section.
What I was also referring to was the ability to replace this icon with a new image/graphic altogether. To do this simply drag in an Image element and upload your own graphic. Like this: http://quick.as/wqj0tgb4
Let me know if this helps!
Mat
2 Likes
That’s great, thanks Mat.
And if I wanted to have an X icon as closing icon? 
Thanks
2 Likes
Very well explained. thanks a bunch!
Perfect! Just what I need… Thanks Mat!
Did you ever figure this out?
1 Like