[Resolved] Off Canvas Hamburger Icon in the header

[Stefan]

Hi again
Is there a way to freely position the hamburger symbol in the header? I want the icon to be right in the middle of the gray area.
Another/alternate question: how can i change the size of the menu image, so that it covers the full width of the screen (according to the header image, which i could remove then)
Thanks very much

the link is http://www.rurtalschule.de

[David]

Hi there,

quick question, will you want the same design/layout for all devices ? Mobile and Desktop.

[Stefan]

i tried it for all devices but i could`nt. so I created a secondary menu which is shown in tablet and mobile view. if it is possible, the burger should be in all views in the grey field. 🙂
Now I could get the burger somehow in the header in desktop view.

[Ying]

So you do want the layout for all devices?

If that’s the case, I would recommend trying the below steps:

1. Remove the background image from the header, disable the secondary navigation.

2. Go to customizer > site identity, upload the background image as logo, I would recommend remove the grey box from the image, as it’s better to use CSS to add background color for the Hamburger Icon.

3. Go to customizer > layout > header, tick the Use Navigation as Header box, set mobile header to off.

4. Go to customizer > layout > primary navigation, set Mobile Menu Breakpoint to 9999999, set Navigation Width and Inner Navigation Width both to Full.

Once these steps are done, we can have another look and provide some CSS.

[Stefan]

Hey to all,
thanks for your help. Unfortunately I have to recreate the layout, so this question is done 🙁

[Ying]

Alright, no problem 🙂

[Author]

Posts