Formerly “Discourse Category Sidebars” — the name of this theme component has been updated to Topic List Sidebars now that it supports both categories and tags.
 |
Summary | Topic List Sidebars takes a topic and applies it as a sidebar for a category or tag’s topic list. |
 |
Preview | Preview on Discourse Theme Creator |
 |
Repository Link | https://github.com/discourse/discourse-topic-list-sidebars |
 |
New to Discourse Themes? | Beginner’s guide to using Discourse Themes |
Install this theme component
Features
This theme component takes a topic and applies it as a sidebar for a category or tag’s topic list. These sidebars are only visible when the browser is 767px or wider (most tablets and monitors).
What can I do with this theme component?
-
Choose a topic and display its content as a sidebar for a category or tag.
-
Set a sidebar to be displayed on the /latest, /new, /unread, and /top pages by using
allas the category name in your settings. -
Choose for the sidebars to appear on the left or the right of the topic list.
-
By default a category’s sidebar will also display for all its subcategories unless a subcategory has its own sidebar defined (you can disable this by unchecking the
inherit parent sidebarsetting).
How do I configure it?
Choose your categories and tags, and add the id of the topic (e.g. example.com/t/example-topic/57) that you would like to use to populate the sidebar’s content
I recommend creating sidebar topics in their respective categories/tags, closing the topic so there are no replies, and unlisting it (so it doesn’t appear in the topic list).
Note that you cannot use a topic in a private category as a sidebar in a public category (you can technically, but users without access to that private topic will just see a empty sidebar!).
Settings
| Name | Description |
|---|---|
| sidebars | Add and remove sidebars |
| sidebar side | Choose from Left or Right |
| inherit parent sidebar | If checked subcategories will inherit their parent category’s sidebar (unless the subcategory has its own sidebar assigned). When unchecked subcategories will only display a sidebar if one is specified. |
| stick on scroll | When checked sidebar has a sticky position on scroll |
Developer Notes
Each category sidebar is wrapped with a class that contains the category slug, so for the staff category that would be .category-sidebar-staff. You can use these classes to style the individual sidebars.
The body tag on pages with sidebars also has a class added so you can use body.custom-sidebar to apply styles on all pages that have a sidebar.
Credits
Special thanks to @xrav3nz for laying the groundwork to make this component possible!
Last edited by @JammyDodger 2024-06-18T11:18:45Z
Check document
Perform check on document: