Hi @Blocs_User no problem. Thanks for your answer …
tom
Change Hamburger Icon
Hi @MDS you did not want to confuse me ??? I think this is okay
But I have another question… In blocs2 there was a class called nabber-toggle .icon-bar ( choose from the dropdown menu ) With this class I could change the with of the hamburger menu …But I don’t find that class in blocs 3 …
When I use the nabber-toggler-icon class I can’t change the with of the menu , it change only the position …
Any ideas for me ?
tom
Hi @Tom2
Blocs 3 is based on Bootstrap 4 and as a consequence the hamburger icon is now a svg file. If you want to change the size or/and color of the hamburger then you need to modify the svg data. There exists already a number of posts in the forum that provide the necessary information regarding the svg and how to modify it.
For instance: Hamburger Menu and horizontal lines changes
You will need to change the view box specifics.
MDS
@MDS I’ve been playing around with your examples of adding the word menu and toggle color. I did look through the hamburg code and was wondering how/where I could get the info on changing the svg hamburg icon. My version seems like a two column hamburg would look good.
Thanks
Casey
Here’s a live version.
https://battlecreeksteelheaders.com/index.html
Hi @casey1823
I am not sure what you mean by a two column hamburger would look good. Can you clarify ?
Do you want it to be smaller ?
MDS
No I can change the size but your code uses a standard 3 line icon. Is there a way to use a 2 line icon or configure a different one?
Casey
Hi @casey1823
Try to replace with this:
url(“data:image/svg+xml;charset=utf8,%3Csvg viewBox=‘0 0 20 20’ xmlns=‘http://www.w3.org/2000/svg’%3E%3Cpath stroke=‘rgba(0, 0, 0, 1)’ stroke-width=‘2’ stroke-linecap=‘square’ stroke-miterlimit=‘1’ d=‘M4 7h22M4 15h22M4 23h22’/%3E%3C/svg%3E”)
Result:
Let me know if it works.
MDS