Problem multiple columns title in menu in mobile

Dear Team,
I followed your guide on how to create multiple columns https://www.gavick.com/documentation/un ... mns-plugin

My problem, is that when I try to hide "column 1" and "column 2" using Link Type Options –> Add Menu Title No, these titles are still showing in mobile menu, while in desktop is properly hidden.
How can I hide it also in mobile menu? I tried the css:
#menu1158{
display:none;
}
but not luck in mobile. I don't even need titles "column 1" and "column 2" but following your guide looks the only way to create two columns to order the subitems, while would be bettere just order the subitems,
Best,
Baggio

Could you please post an url to your site?
Could you please clarify which element exactly you would like to hide on mobile (Screenshots will help).

Dear Cyberek,
Please look at the following screenshot, where the menu items "Company Image" and "Company Column 2" are properly hidden in desktop resolution. I can hide them also using css.

problem-multicolumn_MENU-DESKTOP.png

Now please have a look to the mobile menu in the following screenshot, where "Company Image" and "Company Column 2" are here visible. This is really bad because "company image" and "company column" should be hidden also in mobile.

problem-multicolumn_MENU-MOBILE.png

How can I hide these menu item in mobile resolution?
Best,
Marco

I guess it is not possible . You would need to change the way mobile menu is generated and it requires hacking of template core files.

Hi

I was asked to join conversation. Cyberek is right. It would require a lot of code changed to make it work like that. Try using a small manual override with removing each of the options on it's own by using a script like this in /layout/blocks/head.php

Code: Select all

<script type="text/javascript">(function($) {$(document).ready(function() {
$('#mobileMenu option').each(function(){
if( $(this) == '—— Company Column 2' ) {
$(this).remove();
}
});
});})(jQuery)</script>


Dear Teitbite,
thank you so much to provide the solution!
Unfortunately it doesn't work at this stage, I can report that I also try to replace '—— Company Column 2' with 'Home' (to check if it removes "Home"), but the code doesn't remove the item. I also try to put the code in different position of head.php but no luck.
It should be work, what we might change in the code?
Thanks in advance,
Baggio

Could you please post an url to your site? I'll check why this code desn't work.

Hi

I'll take care of that since I've been helping with this site before and had all the access.

Looks like I've missed the .html() function for option selector. Correct code should be:

Code: Select all

<script type="text/javascript">(function($) {$(document).ready(function() {
$('#mobileMenu option').each(function(){
if( $(this).html() == '—— Company Column 2' ) {
$(this).remove();
}
});
});})(jQuery)</script>


also code has to be at the bottom of /layout/blocks/head.php not at it's very top.

Dear Teitbite,
Thank you so much, your code now is perfectly working now, and you've helped me to solve a really important issue for me,
many many thanks,
Rob

Hi


Glad I could help.
---
If You were satisfied with our support please let other users know on Twitter: http://twitter.com/gavickpro or Facebook: http://www.facebook.com/gavickpro

I've done it on Twitter right now and start also to follow