# How to customize the user dropdown menu?

**URL:** https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257
**Category:** Development
**Created:** [2 maart 2017 om 21:48 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257 "2017-03-02T21:48:50Z")
**Posts on this page:** 12
**Page:** 1

<div class="post-metadata">

### Author: ![tophee](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tophee/32/73406_2.png) [@tophee](https://meta.discourse.org/u/tophee)
#### Post date: [2 maart 2017 om 21:48 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/1 "2017-03-02T21:48:50Z")

</div>

I would like to add a direct link to the users activity page to the user dropdown menu, either as an icon:

 ![](https://global.discourse-cdn.com/meta/original/3X/8/9/899773cab379f4107d9a43b0b84a981a835c5d04.jpg)  
Or as text.

How do I do it?

---

<div class="post-metadata">

### Author: ![zogstrip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/zogstrip/32/512781_2.png) [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [3 maart 2017 om 09:04 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/2 "2017-03-03T09:04:45Z")

</div>

Create a new CSS/HTML customization, and put this in “`</head>`”

```html
<script type="text/discourse-plugin" version="0.4">
    api.addUserMenuGlyph({
        label: 'awesome.label',
        className: 'my-class',
        icon: 'your-icon',
        href: `/some/path`
});
</script>

```

---

<div class="post-metadata">

### Author: ![tophee](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tophee/32/73406_2.png) [@tophee](https://meta.discourse.org/u/tophee)
#### Post date: [3 maart 2017 om 09:31 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/3 "2017-03-03T09:31:14Z")

</div>

How do I write the href path if it includes the username (as in `/users/username/activity`)?

Note to anyone wanting to use this: if you use an fontawesome icon, you give the icon name without the leading `fa-`

---

<div class="post-metadata">

### Author: ![zogstrip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/zogstrip/32/512781_2.png) [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [3 maart 2017 om 09:31 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/4 "2017-03-03T09:31:59Z")

</div>

You can cheat and use “`/my/activity`” 😉

---

<div class="post-metadata">

### Author: ![tophee](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tophee/32/73406_2.png) [@tophee](https://meta.discourse.org/u/tophee)
#### Post date: [3 maart 2017 om 09:45 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/5 "2017-03-03T09:45:04Z")

</div>

And how do I compose the label properly (so that I can draw on existing localizations)?

And what about the mobile version? There is no `<\head>` in the mobile version…

---

<div class="post-metadata">

### Author: ![zogstrip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/zogstrip/32/512781_2.png) [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [3 maart 2017 om 09:49 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/6 "2017-03-03T09:49:39Z")

</div>

> [@tophee](#):
>
> And how do I compose the label properly (so that I can draw on existing localizations)?

You can have a look at the [`client.en.yml`](https://github.com/discourse/discourse/blob/master/config/locales/client.en.yml) file if you want to use existing localizations.

> [@tophee](#):
>
> And what about the mobile version? There is no `</head>` in the mobile version…

“`</head>`” works for both.

---

<div class="post-metadata">

### Author: ![tophee](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tophee/32/73406_2.png) [@tophee](https://meta.discourse.org/u/tophee)
#### Post date: [3 maart 2017 om 09:59 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/7 "2017-03-03T09:59:34Z")

</div>

> [@zogstrip](#):
>
> You can have a look at the client.en.yml file if you want to use existing localizations.

Excellent! Based in what I saw in `client.en.yml`, I tried `label: 'activity_stream'` but it didn’t work. `label: 'activity'` works.

---

<div class="post-metadata">

### Author: ![zogstrip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/zogstrip/32/512781_2.png) [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [3 maart 2017 om 10:00 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/8 "2017-03-03T10:00:58Z")

</div>

That’s because “`activity_stream`” is under “`user`” and should thus be referenced as “`user.activity_stream`” 😉

---

<div class="post-metadata">

### Author: ![tophee](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tophee/32/73406_2.png) [@tophee](https://meta.discourse.org/u/tophee)
#### Post date: [3 maart 2017 om 10:03 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/9 "2017-03-03T10:03:15Z")

</div>

You are a great teacher. Thank you very much!

---

<div class="post-metadata">

### Author: ![bekircem](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bekircem/32/44582_2.png) [@bekircem](https://meta.discourse.org/u/bekircem)
#### Post date: [23 juli 2018 om 18:56 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/10 "2018-07-23T18:56:28Z")

</div>

Same method for that?

> [@How can I add custom hamburger menu](https://meta.discourse.org/t/how-can-i-add-custom-hamburger-menu/92282):
>
> Hi. I want to create new menu like Discourse’s hamburger menu and add some links to in it. What is the best way to do this? Thanks.

---

<div class="post-metadata">

### Author: ![mentalstring](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mentalstring/32/168934_2.png) [@mentalstring](https://meta.discourse.org/u/mentalstring)
#### Post date: [8 oktober 2020 om 09:35 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/11 "2020-10-08T09:35:33Z")

</div>

Is there a way to do this but for the profile quick access menu?

 ![Screenshot 2020-10-08 at 10.30.40](https://global.discourse-cdn.com/meta/original/3X/3/6/367edc7ab61ae6bf5c2ba958dc312535cdee70da.png)

How would one go about adding a link there?

Sorry for reviving an old topic, but this seems related.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [8 juni 2024 om 12:36 UTC](https://meta.discourse.org/t/how-to-customize-the-user-dropdown-menu/58257/12 "2024-06-08T12:36:56Z")

</div>

This topic was automatically closed after 2654 days. New replies are no longer allowed.