This fork from a community developer has one large text area to add menu and submenu items. Old version but it still provided us what we need.
@Canapin’s fork is a result of [PAID] Header Submenus UI modification - marketplace - Discourse Meta. We also find it does what we need.
But definitely don’t try to edit the submenus text in the box. We maintain the menu in a csv file and use this procedure, which is posted in a staff how-to topic:
- Open the csv file in a spreadsheet app.
- Edit the data. Generally you can just follow the pattern.
- Save the csv file.
- Open the csv file in a text editor.
- Copy from the text editor and paste into the submenu items box.
- Upload the csv file with your changes to this topic so it stays in sync.
Also worth noting, you can use some html tags and spaces in the csv to provide more organization and sub-sub-menus, which helps cram a lot of stuff on a phone:
This (drop-down menus) can be done with straightforward HTML / CSS, not anything to do with Discourse. You can press f12 and examine how they did it yourself, via the browser tools.
after reading a couple of posts i thought that the only way you could add links to the
.d-header specifically, was with a component similar to what this component does only that this component creates an additional header above
After upgrading to latest, the header submenus “Fixed mode” (“Force the menu to be visible on top regardless of scroll - Desktop only”) does not work well. On the main page, it adds a lot of white space, and on other pages, the header submenu covers the main Discourse menu. I’m sure it’s related to:
but I don’t see that the css for this theme component is setting absolute position on d.header. Any ideas?
Which browser are you using? Can you share a screenshot of the problem?
This is what I see on the latest Discourse with “Fixed mode” enabled when I’m scrolled down the topic list:
It’s the same with Chrome or Firefox on desktop. Mobile is ok.
Main page without “Fixed mode” (normal):
Main page with “Fixed mode” has extra whitespace:
Scrolled down the topic without “Fixed mode” (normal):
Scrolled down the topic with “Fixed mode”. Logo, Topic Title, Hamburger are covered by menu:
Do you have other custom CSS? It’s possible there’s some padding/margin on
.docked .d-header or
#main-outlet that’s clashing with Discourse updates…
Is that possible to use menu items with URL without dropdown?
I would suggest Custom header links (icons) if you don’t need dropdowns- less drama and feels better integrated. I don’t know the answer to your actual question, but I’m guessing “no”.
I am currently using this plugin but since there is not enough space in the header section, I am plannig to put the dropdown menus on top. But I need to add URL’s top level menu.
Also, I couldn’t create a dropdown menu with “Custom header links”. It seems Zoom did that. I reviewed their dropdown menu via console, but I couldn’t figure out how they interfere with the html of this component for adding dropdown to any item.
I have a feature request, since the scrolling issue can’t be resolved, how about an option to turn off the text in mobile so you only see the icons? There doesn’t seem to be a way to target just the text with css or I would just hide it that way. Thanks!
When I install the “header submenus” component the component appears but overlaps my current forum header.
The Discourse version I have is 2.4.1
Please if someone can guide me how to solve it.
Have you tried updating your Discourse? It’s up to version 2.7.0.beta3.
Hi, thanks for your answer.
I have not updated the version yet.
Being a beta version I would not even dare to do it. I saw in the Discourse trial that it works.
If I take my version to 2.6 will it work?
Thank you for what you can guide me
Must be a bug. It can’t get this to work either. I just override it in css.
If I lost the plugin due to bad update, as an example, is there a way to upload only the menus that I typed instead of the entire forum?
It happened to me that I accidentally deleted the plugin but I cannot find a way to upload just the menu items from the Backup/Rollback process.
One more question, but really serious.
I found a great problem trying to hide some menus on some categories’ pages using css. The target menus contain not Latin symbols, because all menus are in different languages. And I can’t base css rules on classes in this case.
@Johani , can you add an ID number to every menu? This would solve this problem. Waiting for your reply!
Update: a simple solution would be to manually add an extra parameter with a unique id number to every menu we add in the component settings.
Update2: I solved the problem with this solution: Custom header with dropdown navigation
I have 38 sub-menus in a menu. I need Vertical scroll for Sub menus. How to add? Kindly give me suggestions.