Mobile Menu not displaying correctly

[Seltsyrk]

Hi I am using your theme (amazing by the way) and thank you, but the menu is not working on a mobile device, everything else is perfect but that. It displays what looks to be a dropdown version of the horizontal menu with ‘contact’ and an arrow pointing down to the far right of the ‘contact’ text, however when tapped it does not proceed to dropdown showing any other pages. I there a way to correct this? Cheers again!

[Towfiq I.]

You could display the word “Menu” instead of always displaying the last menu item. to achieve this, open up zenon.js and replace this:

jQuery("#topmenu ul.menu").tinyNav();

with this:

jQuery("#topmenu ul.menu").tinyNav({active: 'selected', header: true});

If you dont know how to access the zenon.js file, Install this plugin
http://wordpress.org/plugins/solid-code-theme-editor/
and Then Go to Appearance> SC Theme Editor and click the “zenon.js” link from right to edit it.

[John]

Hi Towfiq,

I have noticed this too, the mobile menu always adds the selected tag to the last menu item. I could use the above fix to always show the word “menu” though a good alternative would be to always show the name of the current menu item depending on which part of the site the use was on.

Can you think of a way to have the current menu item selected?

Thanks
John

[John]

Sorry but the fix didn’t work for me. My theme is actually Zenon (sorry for posting in the wrong forum) but the fix should still be valid. I changed the line above and the mobile menu still defaults to “Testamonials” on the mobile version.

http://www.dynamosuk.com

Thanks

[Towfiq I.]

please clear your browser cache to see the change. I just checked your site and I am seeing the change.

[John]

Yes! Working now thank you. How can I buy you a coffee?

[Towfiq I.]

its ok. I already drank coffee knowing the issue was fixed 😉

[Sofie Olofsson]

Hi,

I just did the instructions above. My menu in is showing the word: Navigation. Is there a way to change this? The name of the menu is “Meny”.

Thanks!

[Towfiq I.]

replace this:

jQuery("#topmenu ul.menu").tinyNav({active: 'selected', header: true});

with this:

jQuery("#topmenu ul.menu").tinyNav({active: 'selected', header: 'Meny'});

[Sofie Olofsson]

Hm, still showing ‘Navigation’ 🙁

[Towfiq I.]

@Sofie whats your site address?

[Sofie Olofsson]

http://www.opcommunication.se

[Christina]

Using Zenon Pro on a clients website – menu does not show up on any mobile device.
Please advise.
Thank you.

[Towfiq I.]

@sofie I am not seeing that line of code in your zenon.js file:
http://www.opcommunication.se/wp-content/themes/zenon/zenon.js?ver=3.8.1

@Christina Please setup your Menu from Appearance> Menus to display the mobile menu.

[Christina]

The menu is setup, however there seems to be no wording about mobile menus in this section. Here are some screen grabs of what my options look like in the dashboard. What am I missing here? Thank you.

[Towfiq I.]

there shouldn’t be any. the mobile menu automatically shows up when you setup the menu Whats your site address?

[Christina]

moriahbrandons.com

[Towfiq I.]

hmm…. Add this to the very bottom of your mobile.css:

.tinynav, .tinynav1 {
display: block!important;
margin: 20px auto 0px auto;
width: 90%;
padding: 3px 0;
}

[Christina]

Thank you Towfiq – that worked. It made it a drop down menu which is perfect! Thank you very much for your help. Your support in this forum is extraordinary. Thanks again.

[Sofie Olofsson]

Hi!

I once again put the code:jQuery(“#topmenu ul.menu”).tinyNav({active: ‘selected’, header: ‘Meny’}); in zenon.js. It’s not working. I’m sure the code is there.. What do I do wrong?

[Towfiq I.]

Open up other.js file and replace this:

.text("Navigation")

with this:

.text("Meny")

[Sofie Olofsson]

Thanks, now it works 🙂

[Julia]

Hi Towfiq. We continue to enjoy the Zenon Pro template for our site confidentrunner.com. For some reason the contact page does not appear when “contact” is selected on a mobile device (iPad and desktop are fine). And, contact seems to be the default page, even after another page is selected. What should I do to ensure the contact page is accessible?

[Towfiq I.]

Julia see my first reply of this thread.

[Julia]

The jQuery change was made, the browser cleared, but the menu drop down has not changed. The menu defaults to “Contact” but there is no contact page. I would like to do what John requested; what did you recommend for him?