[theme: mystile] mobile drop-down menu not working well with touch

I’ve decided to use a mobile menu plugin instead.

Now if only I know how to remove/hide the default mobile menu.

Hello,

I’m having the same problem. On mobile devices, the dropdown menu has to be tapped twice before the link can be accessed. Does anyone have a proper fix for this? I don’t want to change to another theme, or install another plugin over it.

Hope to get some feedback soon.

Thanks!

Subscribing to this post…

Hi man, sorry to hear you’re having the same problem.
I have recently moved on to using a different theme. I know you already said that you don’t want to install another plugin over it, but I think it’s really worth it and it’s what I did when I was still using Mystile:

Install plugin: WP Mobile Menu.
It’s free and highly customizable.

Next disable the Mystile default mobile menu by adding CSS:
.nav-toggle {
display: none;
}

You’ll probably also have to adjust in CSS at what width it should kick in.

The thing is, I’m quite a noob at this, but okay, I’ll try to install that plugin, and disable the default menu from Mystile.

However, I’m not sure what you mean by, “You’ll probably also have to adjust in CSS at what width it should kick in”. Care to guide me?

Thanks!

It’s ok, a month ago I felt hopeless too! xD
I’ll try to help you as much as my limited knowledge can.

The mobile menu plugin is responsive, and if I remember correctly it only appears when your browser is under a certain width.
You can try this by making your browser window smaller.

So you’d probably want this to happen right when your default menu disappears. If I remember correctly, by default the mobile menu plugin appears before it is necessary. The plugin has an option for it I think, if not, you’ll have to change it in CSS.

I hope this makes sense.

[edit]double posted

Thanks for your response, seayon.

I’ve just installed the plugin, but it doesn’t help me cause when I view my website on my mobile phone, I can’t expand my menus because when I tap on the menu, it loads that link, and not opens up to see the submenus.

How should I do this?

Can you post your website so I can better help you?

I already know what you mean though.

You can remove the URL from that button. Just go to Appearance > Menus. Go to that menu button and leave the URL blank. This way it will only expand when you touch it on mobile.

If you want to keep the URL link on the desktop, then you need to make a separate menu for the mobile menu in Appearance > Menus.

Then, you can go to the plugin settings and select the new menu you made for mobile.

I hope I explained it clearly enough. ??

My website is https://www.teesandsuch.com.au.

I tried creating a Custom Link that has an empty link, and put it at the top of other menus so that when users click it, it will open to the other menus. This is how it looks like: https://postimg.org/image/8pawl9jex/. However, when I tap About, it always assume I tap Tees And Such.

I tried with /#/, but when I tap About, it always goes back to https://www.teesandsuch.com.au/#/.

So, I’m still lost at this, and yes, this is only a problem in mobile devices ??

Hmm. I tried accessing your site via mobile. It responds normally. Leaving the link empty is the right way.
I also recreated it via my staging site exactly the same way. It also responds normally. (https://bit.ly/2b38aHy) Are you sure it’s not because the button is a bit too small and you accidentally press the one under it?