How to customise the dropdown menu

[sofi.pocketful (Sofi)]

Hi there, I have the Discourse theme Minima, and I have been looking for ways to customise my dropdown menu.

However I can not find anywhere to customise/delete/add the options in the dropdown menu. Could someone help me?

[Jonathan5]

They call it a hamburger menu, so that’s something to search here for. Here’s one post that could be useful: Customizing the Hamburger Menu - #2 by JimPas

Also search for the American “customize”

[awesomerobot (Kris)]

This theme component makes it easy to add links to existing sections:

Custom Hamburger Menu Links

Summary Custom Hamburger Menu Links will allow you to easily add links to the hamburger menu. Preview Preview on theme-creator.discourse.org Repository Link https://github.com/discourse/discourse-custom-hamburger-links New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component Samples Desktop [Capture] Mobile [Capture2] Settings You add links via comma delimited values in…

The easiest way to remove options is to hide them with CSS, for example:

.hamburger-panel .top-topics-link {
    display: none;
}

[sofi.pocketful (Sofi)]

Thank you Kris!

Where should I paste the code? I’m not able to edit a theme CSS and when I try do it in an active component it doesn’t seem to do anything…

[meghna (Meghna Jalan)]

Hi Sofi,

@sofi.pocketful

Where should I paste the code?

To customize the hamburger menu via CSS, you can fork the Minima theme and paste the code in your fork.

@sofi.pocketful

when I try do it in an active component it doesn’t seem to do anything…

What are you trying to do? I verified that the theme component is working fine. I was able to add new links via the Custom Hamburger Menu Links component.

[sofi.pocketful (Sofi)]

Hi Meghna,

I can add links to my hamburger menu, but I can not add or delete items to it.

I would like to customise the shape and what is written inside my hamburger menu. For instance my hamburger menu looks like this:

But I would like it if it could look something like this:

I want to take things out such as “Cakeday, “Tags”, etc. And make the shape more square-like rather than rectangular-long. Is there a CSS code for it and I can create a new component to edit it?