כיצד לשלוט בסדר קטעי התפריט בסרגל הצד?

תמיכה
1

Hi everyone,

I’m running into an issue with the sidebar menu in my Discourse forum. The order of the sections seems fixed — for example, when I create additional custom sections, they always appear above the “Categories” section.

For my community, it would be important to have those custom sections below the categories instead, but I can’t find any way to change or control this order.

Is there a way to manage the position of sidebar sections, or is it currently not possible to customize the hierarchy/order of these blocks?

Thanks in advance for any guidance!

image
image880×1674 121 KB

2 לייקים
2

Hi there, you can control the order of sidebar sections with CSS. Just add a new component with something like the following css code. Go to admin -> themes & compontents -> components and create a new local component

Screenshot 2025-09-20 at 7.50.50 AM
Screenshot 2025-09-20 at 7.50.50 AM1630×1166 171 KB

and add this code to the css tab, where custom-section-name is the slug name of a custom menu section:

.sidebar-wrapper { 
  .sidebar-custom-sections {
    display: contents;
  } 
  [data-section-name="community"] {
    order: -4;
  }
  [data-section-name="categories"] {
    order: -3;
  }
  [data-section-name="tags"] {
    order: -2;
  }
  [data-section-name="custom-section-name"] {
    order: -1;
  }
}
screenshot of CSS tab

Screenshot 2025-09-20 at 7.56.44 AM
Screenshot 2025-09-20 at 7.56.44 AM1186×1174 83.1 KB

You will have to change the numbers and add custom sections to the above code to suit your specific needs. It will looks something like this:

Screenshot 2025-09-20 at 7.58.17 AM
Screenshot 2025-09-20 at 7.58.17 AM538×1142 32.7 KB

4 לייקים
3

Thanks! I had just found and implemented that - but it didn’t work on mobile

https://meta.discourse.org/t/rearrange-sidebar-order/273405/2?u=aurora

6

This was apparently also an issue here - but this doesn’t work either

https://meta.discourse.org/t/how-to-sort-nav-menu-sections/289656/3?u=aurora

7

המחלקת sidebar-wrapper במובייל מוחלפת ב-sidebar-hamburger-dropdown לדעתי. לכן הוספתה אמורה לגרום לכך שזה יעבוד גם במובייל:

.sidebar-wrapper, 
.sidebar-hamburger-dropdown { 
  .sidebar-custom-sections {
    display: contents;
  } 
  [data-section-name="community"] {
    order: -4;
  }
  [data-section-name="categories"] {
    order: -3;
  }
  [data-section-name="tags"] {
    order: -2;
  }
  [data-section-name="custom-section-name"] {
    order: -1;
  }
}
3 לייקים
8

Thanks! I just tried it - unfortunately it didn’t work. :folded_hands:

9

נכון, עוד פרט אחד: הסרגל הצדדי לא משתמש ב-flex במובייל, כנראה. אז תצטרכו להוסיף גם את זה.

.sidebar-sections {
display: flex;
flex-direction: column;
}
6 לייקים
10

תודה רבה!! זה עובד!! מעולה!

לייק 1
13

The header name of my custom section contains a space e.g., “Help users.”

I tried to use `data-section-name=“help users”`, but that does not work.

How can I specify the space? Does any masking need to be done here?
Please help

EDIT:
After inspecting site using dev tools of FF I found the solution is “help-users”.

3 לייקים