• GNU/Linux

    How to make a dropdown in nodebb navigation?


  • What was the solution?

  • GNU/Linux

    @Jey-Cee-0 @Evgeniy-Onegin We were able to do it via this technique.

    Take the markup and css for the Secondary Nav menu https://codepen.io/kuus/pen/MwXzNm

    Place it in the Global Widgets as an HTML widget.

    This way you'll not be changing templates and can get the benefits of the new updates in the theme.


  • @fais3000 Sorry for digging up an old thread, but I'm curious to know if adding a dropdown into the stock header bar supplied with NodeBB is possible ? The real issue here is the limitation of screen estate on some devices, and having sub items in a dropdown would be a good way to combat this.

  • GNU/Linux

    @phenomlab No worries, this is still a pain point for me.

    I have been using above technique on a couple of forums via widgets but it is not ideal. It works well for desktops and larger screens but for mobile we have to push the secondary menu items into the top default menu (stock menu) via JS due to the real estate issue. So yes it is possible, but not ideal as it doesn't load sometimes for mobile users if there is a js error in any of the third party services (like ads).

    I also tried updating the stock header via persona tpl files, but i've been burned as the theme structure updates frequently with new releases. I've learned to avoid overwriting the templates.

    The best approach would be to have this ability in the core to handle either multi level navigation or a better responsive setup which can hold relatively larger number of menu items.

    Mega menus are pretty common in majority of websites these days and if nodebb team supports them it would solve the issue. e.g https://geedmo.github.io/yamm3/

    May be @baris or @PitaJ know of better solutions.

Suggested Topics

| |