Skip to main content
Open

Cleaning up the main Mega Menu dropdown

Related products:CC Customization
  • November 16, 2021
  • 6 replies
  • 77 views

anirbandutta

I would like to hide the first few default options before the actual Nav items for the ‘Registered users’ who comprise 90% of my audience experience and only make it available for the ‘Moderators’ or admins.

cc @Marion Frecaut - How to make it available only for the moderators and not for all reg. users?

 

6 replies

  • Helper ⭐️⭐️⭐️
  • 732 replies
  • November 16, 2021

Hello @anirbandutta thanks a lot for your question. This is not currently possible. However that is an interesting use case so I converted it to an idea so it can gather some votes.

I have a follow up questions: Why do you want to hide those defaults options to your registered users? We see them as valuable to give them quick access especially for Super users. For example super users have an easy way to see all questions without a best answer and can help to reply


DannyPancratz
Forum|alt.badge.img+7
  • VIP ⭐️⭐️⭐️⭐️⭐️
  • 976 replies
  • November 16, 2021

Hi, @anirbandutta. We wanted to do something similar and found a work around for now (more below). So, in general, I like the idea of being able to customize the mega menu drop downs. You’ve got my vote!

As our immediate solution, we’re using CSS to hide those quick links. I believe it’s this, but I’m out of my expertise there. 

.header-navigation .main-menu-list--quiclinks {
  display:none;

Note: I think this might also hide the Knowledge Base quicklink the KB drop down portion. The code doesn’t seem to specify the community module and I’m seeing the KB overview quicklink hidden in that part of the menu as well. 


anirbandutta
Forum|alt.badge.img+2
  • Author
  • Expert ⭐️
  • 1804 replies
  • November 18, 2021

Thank you @Marion Frecaut .

@DannyPancratz glad to know the idea resonated w you and Thank you so much for sharing the css hack.

I will check it out on our Staging. The second main menu item for us is a static link, ‘Events’, the imact of this .css line on which I’ll keep an eye on.

Thanks again!

 


  • Helper ⭐️⭐️⭐️
  • 732 replies
  • November 19, 2021
Updated idea statusNewOpen

SmartlyGreg
Forum|alt.badge.img
  • Helper ⭐️⭐️⭐️
  • 201 replies
  • January 21, 2022
'

@anirbandutta @DannyPancratz there is a script based way of doing it more selectively.
So if you wanted to remove only the very top link for example:

<script>
  var dropDownLinks = document.getElementsByClassName("main-menu-list__item");
  dropDownLinks[0].setAttribute(''class'', ''dont-show'');
</script> 

Then if you wanted to remove the second one too, you’d just repeat the second line with dropDownLinks[0], as you’d want to remove the new top item. 

But if you wanted to remove only the second one you’d have to replace the “0” by “1”… and so on…

This relies on my usual trick of the dont-show class which is also a display none style like @DannyPancratz only targeted to a specific occurrence rather than all items of a class via the script.

.dont-show {
  display:none;
}

 

I still feel very limited by the Mega Menu and am getting close to going full custom HTML for such reasons as the above and the limitation to a single dropdown with all categories. Hence the idea: 

 

'

Gabolino
Forum|alt.badge.img
  • Helper ⭐️
  • 163 replies
  • January 21, 2022

Ive been talking to InSided about this for a few weeks :) 

You have my vote and sympathy! 


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings