Mobile Menus Won’t Collapse

[JThorin]

Hello!

I updated my site’s TNG to version 13 and now notice that the menus on the mobile version of the site do not collapse. In fact, they start out expanded and they overlap and obscure most of the screen. 
 

Anyone else have this issue? I did have some hiccups with database tables not being the same encoding or correlation, but I was able to find the solution on this forum.

You can see what I mean here (though you must open it on mobile): https://www.thorinfamily.net/genealogy/searchform.php

Much thanks ahead of time to any who lend a hand.

[theKiwi]

It's looking like a css issue - perhaps try again to upload the contents of the css folder that was part of the upgrade to TNG 13

Roger

[JThorin]

Thanks for the response, Roger. I re-uploaded all the CSS files from the upgrade but no change.

Any other ideas?

I would be open to substituting the mobile menu with the mobile menu for my wordpress theme, but I'm not sure where that code would be. I did find in siteversions.php that I could change the mobile experience permanently to the desktop version, which does not have any problems, but that will be my last solution if all else fails since that layout is not ideal on mobile. But it would work.

[JThorin]

By the way, after reading your post's signature area I saw that I should specify what type of wordpress integration I'm using. Apologies for not stating before, but I'm fairly certain I'm using the Kloosterman method. My uncertainty comes from having done it 7 years ago. I'm not using a plugin, that much I do know.

[klooster]

I checked your source code and you are definitely using my integration method. If you switch the mobile to standerd site, then the mobile menu is oké.

PS: I do not have this problem using the latest version of TNG. I would suggest to try again to upload the contents of the JS and CLASSES folder that was part of the upgrade to TNG 13.

[JThorin]

@klooster Thank you for the reply! And thank you for confirming that I did indeed follow your setup

I attempted to reload the CLASSES from the update but no change. 

I guess for now I will set the mobile siteversion to standard since it does work in the end. 

Thank you, everyone. If Anyone has any other suggestions, please feel free to let me know and I will try it out. 

[klooster]

Did you also uploaded the JS folder that was part of the upgrade to TNG 13?

[JThorin]

@klooster - Sorry, yes, I did also try the JS folder. No change!

Thank you.

 

[PapaTango]

It is quite likely that these responsive issues come from two sources.  The first is the theme you have chosen to develop your WP front end upon.  Not all themes are the same--and TNG itself presents it's own issues on presentation.  Remember, when using Dr. K's method, TNG is sandwiched between the WP header, footer, and WP copyright bar.  What's in-between falls on the characteristics of the TNG presentation.

For mobile (responsive) presentation, the simpler one keeps formatting and content on the WP side--the better it presents to the smartphone user.  Long, involved stuff often does not collapse by default in WP--and given the displays we choose TNG for are not completely functional from a responsive viewpoint.  This is why many of us choose Avada as the theme runner.  

There is an add-on called "Chrome UA Spoofer" which can emulate phone, tablet, and desktop environments on your dev desktop.  It works for the check as to whether your theme can deliver the goods properly.