[Support request] How to pimp the mobile menu

[Karsten]

Hi Guys,

I am unhappy with my mobile menu. Please check out here.

I would like to see my menu looking similar like this one here.

Could you please help me with good advise and fresh CSS?

Thank you very much

Karsten

[Leo]

Hi there,

Can you try the off-canvas menu first?
https://docs.generatepress.com/article/off-canvas-panel-overview/

Make sure you are using the latest GP Premium 1.8.1.

Then we can help with some styling.

Let me know 🙂

[Karsten]

Thank you, Leo.

I have updated to GP Premium 1.8.1 und activated off-canvas as you can check here.

I would like to see my menu looking similar like this one here.

Could you please give me some styling CSS?

Thank you very much

Karsten

[Leo]

Can you set it to Slide under style first?
https://docs.generatepress.com/article/off-canvas-panel-overview/

That will make it really similar to the example provided 🙂

[Karsten]

yes, done.

Looks already very similiar…

Please give me some CSS to make it beautiful…also for the sub menu where is too much padding below and above the items…

Thank u!

[Leo]

Ok so first, try increasing the mobile menu height for off canvas menu:
https://docs.generatepress.com/article/off-canvas-panel-overview/#menu-item-height

Then can you disable any caching plugins you might have? I can’t quite tell where the submenu padding is coming from.

Let me know 🙂

[Karsten]

I have increased the menu item height to 40px.

I don’t use any caching plugins.

Please advise what to do next.

Thank you

[Leo]

Can you specify what else you are looking for?

You can use this for the border:

.slideout-navigation.main-navigation .main-nav ul li a {
    border-bottom: 1px solid #fff;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

[Author]

Posts