How to edit hamburger menu items?

(Aagat) #1

Is there any way to edit/delete/rearrange menu items in hamburger menu next to profile picture on top left of the screen?

(Jeff Atwood) #2

Not possible at this time, sorry.

(Spero Koulouras) #3

Is DOM manipulation from some Javascript a bad idea? I just did something like this and it appeared to work, but something could be very broken under the covers. The javacript was placed in top of pages

x.insertAfter(z);    // z contains the node to insert with my custom functionality

(Kane York) #4

Yes, it would be better to change the Handlebars templates that the dropdown is rendered from.

(Spero Koulouras) #5

I thought this was too easy … :slight_smile:

(Aagat) #6

I am kinda disappointed but I guess hacking template/rendered page is my only option here.

How does modifying templates affect my upgrade process?

(ljpp) #7

Is there an easy way to modify the Burger menu item “FAQ” into something else. I am using the FAQ page for the written forum rules, rather than questions and answers. Therefore I would like to modify the FAQ into Rules. Or maybe I can add an item to the burger?

(Logan Mathews) #8

There is a text.replace feature in the admin panel which can/should be used for renaming the faq to rules.

Sent from iPhone

(zqcolor) #9

better one to change hamburger menu found in other forum

< script type=‘text/x-handlebars’ data-template-name=’/connectors/site-map-links/shop’ >

<li><a href="" title="Some Amazing Club Shop" class="shop-link" target="_blank">Shop</a></li>

to Admin -> Customize -> CSS/HTML -> < /head >

(Jeff Atwood) #10

I believe @eviltrout added better support for this yesterday, at least as far as adding hamburger menu items.

(Robin Ward) #11

Yes you can add additional hamburger menus by adding a customize > CSS/HTML > /head like this:

<script type="text/discourse-plugin" version="0.4">
  api.decorateWidget('hamburger-menu:generalLinks', () => {
    return { href: '', rawLabel: 'evil trout' };

Quick translation for a few custom menu items?
(zqcolor) #12

great! thanks a lot for fast response

(Sebastian) #13

cool, very easy. So I added a “contact” link, but it is put into the group with links that pertain more to content in the forum, any way to put it down next to FAQ etc.?

(Robin Ward) #14

There was no way to do this, so I’ve added it:

You can add a link in a similar way, just target footerLinks instead of generalLinks:

<script type="text/discourse-plugin" version="0.4">
  api.decorateWidget('hamburger-menu:footerLinks', () => {
    return { href: '', rawLabel: 'evil trout' };

Discourse Vincent theme

If there is an uneven number of links in the section above the layout will be messy.

Before footer links I forced in links in general links and added the border myself. I solved this problem there with a dummy link to fill out the space but it could probably be fixed in a more nice way.

(Blumiere) #16

I am so happy that I found this thread. I had no idea this was possible and was previously using a rather unsightly bar of links at the top of my installation.

I have to wonder though, is there other javascript that can suppress existing menu items? That would allow full customization with this.

(Robin Ward) #17

You should be able to use CSS to hide menu items that you don’t like.

(Blumiere) #18

There we go. Thank you for that. :slight_smile:

(Vinoth Kannan) #19

flatten function added for applyDecorators of footerLinks same like generalLinks. Else custom footerLinks not working in some cases.

(Blu McCormick) #20


This code is perfect. Just what I needed. I would really like to add my links to the very top of the hamburger drop-down mobile menu in capitals where the FAQ is. Is there a way to do this? I am thinking that I just change the code [___]Links:

55 PM

The last drop-down menu section is footerLinks
The third section from the top is generalLinks
What is the top section called?

Thanks so much.