Custom sidebar sections being tested on meta

[mcwumbly (Dave McClure)]

Cool, good to hear how you are thinking of using “reorder sections”

@simon_tomes

the ability to edit category section titles.

This one in particular isn’t high on our list at the moment, but it can be done with an override:

Admin → Customize → Text ?

js.sidebar.sections.categories.header_link_text

[simon_tomes]

@mcwumbly

but it can be done with an override:

Excellent. Thanks for the tip. Looks like that’s available for all category section titles except for “Channels”. When I do the following search nothing is returned. Is that expected?

[rahim123]

@RGJ

@awesomerobot

This is now an option for admins in the custom section modal:

It’s awesome that there is now the option “Make this section public and visible to everyone”, but I do have some feedback,

Also wanted to say thanks for this progress.

It should be noted that enable custom sidebar sections needs to be enabled in the settings still, and only the groups permitted there will be able to see custom sections marked as “Make this section public and visible to everyone”. So to make certain groups see a global custom section it also requires allowing them to implement their own personal menus too.

Also, I think for globally visible sections provided by the admin to be most useful they would also need to be visible to anonymous (not logged in) visitors, which is currently not the case.

@simon_tomes

It’s not possible to reorder the sections

I definitely need this too, as well as the ability to customize the Community menu. But meanwhile don’t forget about this fantastic tip:

Rearrange Existing Hamburger Menu Items

With CSS you can do something like… .hamburger-panel .panel-body-contents { display: flex; /* Setup a flex layout so you can reorder things */ flex-direction: column; .menu-container-footer-links { order: -1; /* moves footer links to top */ .keyboard-shortcuts-link { display: none !important; /* Hide keyboard shortcut link */ } } } You might need to adjust some other things (borders, spacing), but I think this would get you 90% of the way there.

And here’s my take on it:

.sidebar-section-content {
  display: flex;
  flex-direction: column;
  .sidebar-more-section-links-details {
    order: +1;
  }
}
.sidebar-section[data-section-name="tags"] {
  display: none
}
.sidebar-section[data-section-name="categories"] {
  display: flex;
  flex-direction: column;
  order: +1;
}
.sidebar-custom-sections {
  display: flex;
  flex-direction: column;
  order: +1;
}

[mcwumbly (Dave McClure)]

@simon_tomes

Looks like that’s available for all category section titles except for “Channels”. When I do the following search nothing is returned. Is that expected?

Oh, hmm… since chat is a plugin, it’s likely injected in some other way and uses one of the strings you’ll find if you just search for “chat” – but I’m not sure which one it is. Will have to track it down.

[simon_tomes]

@mcwumbly

you’ll find if you just search for “chat”

Oh, I see what you mean. Thanks for the info.

Might it be one of these?

I won’t try it “just in case” I get it wrong.

[mcwumbly (Dave McClure)]

js.chat.chat_channels is what is shown in the sidebar and the channel list in the chat drawer. js.chat.browse.title is what is showin in the page to browse channels (e.g. when you click the edit pencil next to channels).

It’s possible they are used in other places, but I haven’t seen them.

It should be pretty safe to try overriding them. You can always find the text you’ve overridden and then revert it back to the default using the Revert button.

[simon_tomes]

@mcwumbly

It should be pretty safe to try overriding them

Thanks for your help, @mcwumbly. I’ll give it a try.

[Don]

The link ordering is not working correctly on mobile view (touchscreen).
I think it is because the user-select: none is on the .sidebar-wrapper which is only used on desktop view (non-narrow).

I’ve added it here and works great on mobile too.

.hamburger-panel .revamped {
  .panel-body-contents {
    .sidebar-hamburger-dropdown {
      @include unselectable;
    }
  }
}

[danielabc (Daniela)]

I made a new session in the left menu, with the list of options I chose, how do I make other sections defined by discourse disappear through CSS? I want to remove the community and categories section

[Moin]

@JammyDodger

if I search

That’s great! Search did not work for me. My tablet and the website could not agree to show the keyboard. As you can see it disappears without me tapping something.

That may be a problem with my tablet, but how do users of a forum know what they need to search for? Especially if the default language isn’t English.
If users want to choose an emoji they can choose one from the menu. They don’t need to search (in a foreign language). Maybe there should be something similar for the icon.

[Canapin (Coin-coin le Canapin)]

Indeed, this issue occurs my tablet as well as on phones on which the form layout isn’t optimized for:

[shyguy]

custom sidebar sections is nice, but how about editing existing ones like Community or Categories? is that planned? if so, about how far out is it?

for now, i wrote a nice script using promises and MutationObserver. if you want to try it, you can make a theme component and paste this in the head section:

https://gist.github.com/ftc2/c2e23fab9cfd3ff14972972f459e9c4e

any kind of collapsing, expanding, and refreshing should just “do it” in a performant way.

when the sidebar mutates, a promise is created for each link that is resolved when the link’s relevant section is available.

specify injections by section. kebab must be text in kebab case.

i made various ‘positioner’ options.you can append or prepend a section. you can also add a link before or after an existing link in a section.

you can also remove links. just make removals an empty array if you’re not using that.

you can remove/comment out the few console.log statements used for debugging once you’re confident it works.

please let me know if you find bugs.

is it worth posting this as an actual theme component? again, i wonder if the real feature is coming.

[mcwumbly (Dave McClure)]

@shyguy

how about editing existing ones like Community or Categories?

Allowing admins to edit the Community section is pretty high on our list now.

What kind of customization for something like Categories did you have in mind? (Aside from adding/removing categories as you can do today)

[shyguy]

i’m using tags instead of subcategories for most things. a problem with this is you have basically no control over how this is presented to users in the navigational sense. you can’t order, emphasize, or de-emphasize tags, and they don’t really appear on /categories like subcategories do.

best solution i have so far is to create a site map topic and link to it wherever it makes sense. that could include in the sidebar (atop Categories section or somewhere in the Community section).

full details in this post:

Emphasize certain tags / can't decide how to use them

my solution is converging on creating a site map topic with emphasized tags. discourse is amazing software. i love how you can invoke a category or tag with # in the post editor (and append ::tag if there is ambiguity between a category and tag with the same name). here is an example: # Site Map ## #food - #asia #europe #america - #breakfast #lunch #dinner - #noodle #soup #baking - #technique #healthy this allows me to present/emphasize a subet of tags in whatever ordering/organization i wa…

[mcwumbly (Dave McClure)]

If you have any screenshots or mockups of what you’d like the Categories section to look like on your site, I’m curious to see what you have in mind.

[rahim123]

@mcwumbly

Allowing admins to edit the Community section is pretty high on our list now.

Great to hear! Would it be possible to make those customizations apply for anonymous visitors as well?

[shyguy]

@mcwumbly

If you have any screenshots or mockups of what you’d like the Categories section to look like on your site, I’m curious to see what you have in mind.

hey dave, here are my thoughts.

imo on discourse, by default, /categories page more or less functions as a site map to browse and find topics unless you want to see a feed like /latest.

for one thing, i want the site map (whatever it may be) to be more prominently displayed than at the bottom of the Categories sidebar section. my first thought was to have the All Categories link (/categories) moved to the top of the sidebar section.

however, i am mostly using tags (with rules assigned to categories via tag groups) for structure in the place of subcategories, so /categories isn’t really working for me.

currently, my Categories sidebar section starts like this with categories below it:

that’s a link to a topic that i described in my previous post.

ideally for me, instead of a sitemap topic, the /categories page could be used if it had some features to present tags as structure. i would be able to present a list of tags inside of each category. preferably, i would have the option to order these lists of tags however i want (fixed order), but an option for ordering based on tag popularity would also be cool. these lists may be multiple rows which may or may not correspond to tag groups, but that would be logical. i.e. each category may be using multiple tag groups with different logical organization. i do not have a mockup of this, but i guess i could try if that’s unclear.

[mcwumbly (Dave McClure)]

OK, I think I am starting to get a better sense of what you’re trying to do. I don’t immediately have great thoughts about how that might be done in practice, though. If you do end up with something closer to what you want using custom sections or additional customization on top of the sidebar, I’d love to see what you come up with.

I think this other topic about using tag groups may also be of interest to you: In the sidebar, can I list the tags by group?

[mcwumbly (Dave McClure)]

@rahim123

Would it be possible to make those customizations apply for anonymous visitors as well?

Yep, that’s the plan. In the first iteration we plan to have the same customizations apply for both anonymous visitors and logged in users with the following minor exceptions:

• links whose destinations are only visible to logged in users will be omitted for anonymous visitors
• anonymous visitors will see a short site description, while logged in users will not

[rahim123]

I just updated my Discourse today, and my global custom section is visible to anonymous users as well. I could swear that it wasn’t before, is that a new change?