Looking for nice additional menu for mobile

Ok have made something, but, not to happy about it.

How best to make website more mobile friendly is the general question,

How do I make nice menu for mobile is the second!

How do I make sure both desktop and mobile menus look great?

• This reply was modified 1 year ago by amazone2.

Hey amazone2! The easiest way to improve the menu on mobile would be to use a dedicated mobile menu plugin. Most such plugins will automatically load on smaller screens, and replace the main menu you have set up.

Thanks @properlypurple

So I have been trying to use a plugin for menu,

But I find it does not really do what I want yet.

(tried WP Mobile Menu)

I want it to replace the navigation menu in my header, not my header totally.

My header is too complicated for that.

I simply want another navigation block that works on mobile,

or a menu block, one of the 2.

I don’t like what I have done now with navigation in header, that does not work when it’s collapsed and people cannot find the menu.

I made a temporary menu below the header made by a list block so people can read and find the menu.

More ideas? Does anyone know a specific plugin that can do what I want.

• This reply was modified 1 year ago by amazone2.

Hey @amazone2!

I simply want another navigation block that works on mobile,

It looks like your navigation block does work on mobile, but the menu items are set to have white color, so they’re not visible.

Can you try taking a screenshot of the settings for the navigation block in the site editor, something like the one shown below?

yes its white that is a the problem only shows on mobile deviced with dark background…

this is the screencap I made.

https://flic.kr/p/2pgby4B

https://flic.kr/p/2pgarw3

• This reply was modified 1 year ago by amazone2.
• This reply was modified 1 year ago by amazone2.
• This reply was modified 1 year ago by amazone2.
• This reply was modified 1 year ago by amazone2.

Thanks for the screenshots @amazone2! Can you try setting the color for ‘Submenu and overlay background’ and ‘Submenu and overlay text’ to colors that would work well with each other? I think this should solve the issue of the menu items not appearing on mobile.

Thanks @properlypurple

that is a major improvement and I removed the extra menu.

I have removed the temporary ugly menu from the website

I will still have to work a little on the header though

The header still could look better on mobile, for some reason the image is somehwat stretched (because it is too big for phone?)

Hey @amazone2! It looks like you have a custom width and height set for that image, which means it can’t auto-adjust on smaller screens. the best way is to actually resize the image to the size you want, and remove any custom width/height that you’ve set.

hello @properlypurple. thanks I at least found a solution while trying this out/

I tried that but it did not help, and it broke my CSS setting as well.

SO I put back the old image and it worked again, I found an error in the size it was 3 pixels to high, so it strectched at least the stretching is gone ??

I only don’t think the text and website flavicon come out well but that is probably be because of the header choice, and hard to do something about it.

Hey @amazone2! I’m glad it’s in a better state than it was. It’s most likely always going to be improving, so I wouldn’t worry too much about having it “perfect” the first time around. ??

Thanks!

Got one more question, is it possible to completely disable the header on mobile devices?

I was looking to disable parts of the header on mobile but that is probably too hard .

In that case my mobile menu plugin can completely take over the header job.