Group navigation sidebar menu sections

:information_source: Summary Displays custom navigation menu sections for specific groups
:hammer_and_wrench: Repository https://github.com/Lillinator/group-menu-sections
:question: Install Guide How to install a theme or theme component
:open_book: New to Discourse Themes? Beginner’s guide to using Discourse Themes

Install this theme component

This theme component allows displaying Discourse custom navigation (sidebar) menu sections to only specific user groups (including trust levels and default groups). The component allows for up to eight custom menu sections to use, and as many groups as you decide for each specified section. Use lowercase group section names separated by dashes (ie: "Superuser Menu = superuser-menu, Staff Menu = staff-menu). The groups are selected from your available groups via drop down selection fields.

Note that the custom sections specified in this component must be setup as public and visible to everyone. To create a new group navigation menu section, make a public one as usual then include it in the settings of this component along with the groups you want it to be visible to. You can specify the section in the component settings before you setup your custom section as long as use the correct section name - this will prevent the section from being displayed to all before you restrict it with the component.

Although this component is intended for custom sections, it can also be used for any existing sections of the navigation menu (ie: categories, tags, channels, personal chat, and even the now deprecated “community” top section). For example you can show custom menus to superuser and staff groups, and also hide tags and channels from a new user group (trust_level_0) at same time. If you want to display a specific menu section for only forum members (hide from anonymous) you can set it to display for the trust_level_0 group.

:arrow_right: Group visibility must be set to “Everyone” in the group interaction settings for any groups you wish to use for this component.


Settings:

List of settings
Name Description
menu 1 Navigation menu section 1 to show to group(s) in setting below. User lowercase slug names.
display menu 1 for these groups only Drop down selector of available groups for menu 1. Group visibility must be set to Everyone in the group interaction settings.
menu 2 - 8 Menu sections to show to group(s) in respective groups setting .
display menu 2 - 8 for these groups only Drop down selectors of available groups for menus 2 - 8.
hide custom menus globe icon Hide the globe icon for staff (not applicable to non-staff)

Screenshots:

Required group visibility settings

Screenshot showing first settings with group selector

Globe hider setting


Please note that this component is generally intended for the navigation menu in sidebar mode, but does also function in header drop-down for now. Also works for both desktop and mobile views.

20 Likes

Wow, I really needed this,Very uselfull, thank you so much. I love your work and your components for discourse.

2 Likes

thank you Tiago! :blush:

1 Like

Hi, thanks for sharing!

Can this component be used for add a custom link only visible to specific groups on top default section?

no this component is for sections only, not links. you can make a custom section with one link in it though.

1 Like

I may add this feature at some point I think. If you really want this I can make a specific component for you or show you how to do it.

3 Likes

How would I do the opposite, only show a section to Anon users? I want to create separate sections for Anon users and Forum members (logged in users).

Oh good question. This is how I would do it:

Step 1:

Create a new custom navigation menu section, called say “Anon Menu” (you can call it whatever you want, but remember the name) and make it a public section (check box at bottom of the modal).

Step 2:

Then in the Common-CSS of a theme or theme component that you create, insert this CSS code. Replace “anon-menu” with the section name-slug of the menu section name you created in step 1 (ie: Custom Section = custom-section).

.sidebar-section-wrapper.sidebar-section[data-section-name="anon-menu"] {
        display: none;
}

.anon .sidebar-section-wrapper.sidebar-section[data-section-name="anon-menu"] {
        display: block;
}

In fact, I like this idea as a use case scenario and will add it to the component when I update it next. I’m building a JSON schema modal for the component’s settings so it’s a bit more intuitive to configure.

1 Like

Thanks. This is more complex than I expected simply from a maintenance perspective I wouldn’t remember what I had done a few months down the line.

EDIT: My attempt to create an anonymous users group does NOT work because that’s only for the Anonymous feature, i.e. when a logged in user changes to Anonymous mode after logging in and not for truly anonymous users (users who don’t have an account).

Oh my apologies I misunderstood you - I didn’t realize you were referring to anonymous mode, I thought you meant not-logged-in users. :woman_facepalming:t2:

Another suggestion, it would be great if it can read the list of groups and offer a dropdown to select from a list of available groups so one doesn’t have typo’s while writing the name of groups

1 Like

Yes that’s correct, I’m referring to not-logged-in-users, people who land the website and haven’t logged in or don’t have an account.

I tried something above but it didn’t work because that’s a completely different feature (it caused more confusion that it should and I’m sorry about that).

If you use my method above it should work. without using that other anonymous mode feature :slight_smile:

But I will add some options specifically for anonymous users next time I update this component, which should be soon.

1 Like

I will wait for your theme update, not comfortable customizing themes manually and it becomes a maintenance nightmare for the “uninitiated” :slight_smile:

Just posting a link to my other reply and solution here for anyone else who might read your question here.

I will add this to feature to an upcoming navigation menu modifier component update.

1 Like

I have updated this component with group drop-down selection boxes that populate with available groups. Also increased the number of menu sections to eight and added a globe icon hider.

2 Likes

Greetings!
I just installed this awesome theme component :ballot_box_with_check:

While setting up I had a question:

  1. In the instructions above, you gave an example of the name of the menu section, such as Sectionname Menu=sectionname-menu

image


In my case, the name of the menu section is written in Russian, for example, “Сотрудники” (English: Staff).


How should I write this section name in the menu 1 line? Russian letters or Latin?
Maybe so:

image

or so

image

Is the word “menu” a required attribute in the text? :sweat_smile:

I’ve tried all the methods, but still nothing works.

I made all groups public, as you prescribed in the instructions.

  1. It seems like I can’t set the visibility of the “Community” section for certain groups using this theme component?
1 Like

Oh no it’s not, I just had that as part of the example menu name. For example, if the menu name is “User Info” then it would be “user-info”. The best way to do it is when you create the menu section, use the name in the Section title field and convert it to slug format with lowercase and dashes for spaces.

Then in the theme component settings, have this:

Russian I think? Whatever is in the Section title field I marked with an arrow in the first screenshot but with lowercase and dashes for spaces.

I just tested that configuration in my screenshot and it works.

Did you rename the community section in russian at any point? if not then using “community” should work (I’m assuming you mean the top unnamed default menu section).

1 Like

If I write the section name in Latin letters, then everything works fine:


And if I write the section name in Cyrillic (Russian), it doesn’t work.