Revisit hamburger color

I Need Help
1

Now that blocs 4 is here I would like to revisit how to change the hamburger colors. There used to be an appearance to change from light to dark but that no longer is there in blocs 4.

So, my first question how to change the hamburger from light to dark in blocs 4?

Secondly, I would like to pick my own color for the hamburger. I have seen some posts that read I must change the page settings like in the following post.

Hamburger Color

Is this still the case and if so do I need to add the code to all pages?

Thanks

1 Like
2

Hi, Eagle!

Here is a file that you need to unzip and attach to your project:
toggle.css.zip (847 Bytes)

Then you need to add class custom-toggler to your nav-toggle:

Screenshot 2020-12-10 at 20.35.40
Screenshot 2020-12-10 at 20.35.40778×400 46.9 KB

You can change the colour of the hamburger by editing the toggle.css file and changing highlighted values:

Screenshot 2020-12-10 at 20.38.23
Screenshot 2020-12-10 at 20.38.232952×2398 288 KB

after that you will just need to reattach the file and launch the preview mode

3 Likes
3

you are also able to customise the hamburger by changing stroke width value etc.

4

Thanks, that took care of it.

2 Likes
5

You are welcome!

6

Thanks! That was of great help. But I didn’t get it to work with the Thick Hamburger. I think I might change the number 0.5 after the RGB numbers? Am I right and in that case do you know to what number?
Thanks?

7

You need to change stroke-width value

8

Do you know what value I should use?

9

While we are on this subject - if anyone has a simile way to replace the hamburger and close icon with a custom made one please

10

I know this is an older post, but thank you for this, @EffexorXR. Instead of linking to the file, I just pasted the code into the head. It worked like a charm!

1 Like