Removing Column Headings from Integrity Mega Menu

Support
#7

Hi There,

Could you please provide us with your website URL so we can take a closer look?

Thanks.

#8

Sure. https://blogs.themantic-education.com/ibpsych/

Thanks!

#9

Hi Jamie,

Please update the CSS code provided by Christopher above to this:

@media (min-width: 980px) {
	.x-megamenu > ul > li > a {
    	display: none !important;
	}
}

You can not remove the categories headline on the mobile menu though, because those are the trigger for your sub-menus to show up.

Cheers!

#10

Thanks Friech. Your solution has partially fixed the problem. When I narrow the browser window on my laptop to resemble a smartphone, the mega menu works. However when I view the site via Safari or the Google app on my phone, the mega menu is still not fully functional; that is, the mega menu doesn’t drop down when the two down arrows are touched.

Jamie

#11

Hi Jamie,

To fix it, you can add this in Theme Options > JS

jQuery(function($) {
$('.x-sub-toggle').on('click touchstart',  function(e) {
    e.preventDefault();
    $(this).toggleClass('x-active').closest('li').toggleClass('x-active');
});
});

Hope that helps

#12

Thanks Paul. Your solution’s a little buggy. When I view the site from my phone, sometimes when I tap the two down arrows, nothing happens. I sometimes tap the icon four or five times and nothing happens. However other non-megamenu items in the nav menu such as Home, Resources and About work all the time.

Thanks,

Jamie

#13

Hi Jamie,

I don’t think the problem started with what we suggested. Please remove any code suggested to you in this thread and try the menu in the phone. If it is still not working then you should follow the steps below:

  1. Ensure everything is up to date according to our version compatibility list here. Please follow the best practices when updating your theme and plugins. Click here for more information.
  2. Test for a plugin conflict. You can do this by deactivating all third-party plugins, and see if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.
  3. Remove custom CSS and Javascript from the options and/or Child Theme and test the case.
  4. If you’re using a CDN, please clear the CDN’s cache and disable optimization services.
  5. Increase the PHP Memory Limit of your server. Click here for more detailed information and how to increase the PHP memory limit.

kindly get back to us with the result of the steps above and URL/User/Pass of your WordPress dashboard using the Secure Note functionality of the post to follow up the case if you still have problems.

Thank you.

#14

Hi Christopher,

I’ve followed all of your advice and the mega menu is still not working the way it should on mobile phones. Could you please take a look? I’ll attach the URL, username and password as a secure note.

Thanks

#15

Hey @themed,

I checked your site on my phone and when clicking on the dropdown arrows, it works fine. Could you tell us the specific version of your Safari and device?

Also, could you test if the Ethos 1 demo “Music” menu link works on your end? I’m asking because it works the same in your site.

Thanks.

#16

Hi Christian,

I’ve got an iPhone 6S running the latest version of iOS. I’ve installed the latest versions of Chrome, Safari and Firefox and the mega menu isn’t showing up on all browsers.

I tried the Ethos 1 demo Music menu through my phone and it works.

Thanks,

Jamie

#17

Hi @themed,

Are you saying that you’re expecting to see a mega menu on mobile instead of standard mobile menu? Mega menu is only applicable for the desktop. Or perhaps, please provide some screenshot of what you’re seeing and a mockup of how it should be.

Thanks!

#18

Hi Rad,

Please see the screenshot below. This is all I get at the moment. The ‘I’, ‘II’, ‘III’ and ‘IV’ submenus don’t expand on a mobile phone - but they do on a desktop. I followed all of Christopher’s advice above.

Thanks,

Jamie

#19

Hi Jamie,

I can reproduce this issue on iOS devices as well, please either disable the caching plugin or configure it, then provide us with FTP access in secure note, so we will be able to debug this issue further.

Thanks.

#20

Hi Alaa,

Sorry for the delay. I’ve disabled the caching plugin. Below I’ll provide a secure note with FTP access.

Thanks,

Jamie

#21

Hi Jamie,

The login provided doesn’t seem to work.

Kindly check again and let us know.

Thanks

#22

Hi Paul,

That’s strange. I copied just now the login information into FileZilla, clicked Connect and it worked.

Jamie

#23

Hi @themed,

I tried and it still now working, perhaps there is a security that blocks users from other countries.

Plus, how did you implemented the CSS and javascript? It’s empty when I checked and it won’t saved. For, please follow this:

  1. Please remove the above javascript if you added it.
  2. Edit your menu items ( I, II, III, IV) and make sure there is a URL, the # as URL would do.
  3. Add this CSS to your global custom CSS.
.x-sub-toggle {
    width: 100%;
    z-index: 999999;
    text-align: right;
}

Thanks!

#24

Thanks Rad. All Javascript is already removed. I followed step (2) and it’s now working. Thank you!

#25

You’re most welcome!

#26

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.