사이드바 메뉴 섹션, 특히 전역 사용자 정의 섹션의 순서를 변경하고 싶어하는 Discourse 관리자 요청을 여러 번 확인했습니다. 현재 CSS를 통해 이를 수행하는 것은 대부분의 사용자에게 직관적이지 않고 복잡하며, 관리 및 수정이 어려운 경우가 많습니다. 이에 따라 관리자 UI에서 이 작업을 훨씬 쉽게 수행할 수 있도록 테마 컴포넌트를 제작했습니다.
개요
이 Discourse 테마 컴포넌트는 관리자가 관리자 사용자 인터페이스에서 포럼의 사이드바 메뉴 섹션 순서를 변경할 수 있게 해줍니다. 이는 기본 섹션과 전역으로 표시되는 모든 사용자 정의 섹션을 포함합니다.
이 컴포넌트는 데스크톱 및 모바일 사이드바 뷰, 그리고 헤더 드롭다운 모드 모두에서 작동합니다(다만, 사이드바 모드를 위해 최적화되었습니다).
community 섹션은 사이드바의 기본 상단 섹션을 의미하며, Topics 헤더와 More 드롭다운 하위 메뉴를 포함합니다. community 섹션 위에 기본 또는 사용자 정의 섹션을 1~2개 이상 올리는 것은 권장되지 않습니다.
설정에서 기본 섹션을 삭제하지 마세요. 삭제하면 순서가 어긋날 수 있습니다(언제든 다시 추가하거나 설정을 초기화할 수 있습니다).
이 컴포넌트를 설정하는 가장 좋은 방법은 컴포넌트 관리자 화면(순서 변경 목록 설정 포함)을 하나의 브라우저 창에서, 그리고 테스트 사용자로 포럼 사이드바 뷰를 옆에 있는 다른 창에서 확인하는 것입니다. 목록에서 메뉴 섹션 순서를 변경할 때마다 페이지를 새로고침하세요.
컴포넌트 관리자 설정에서 사용자 정의 섹션은 슬러그(slug) 명명 규칙을 사용해야 하며, 그렇지 않으면 무시됩니다(예: "Custom Menu Name"의 경우 custom-menu-name, "Useful Links"의 경우 useful-links 등).
설정
설정
설명
Sidebar menu order
기본 메뉴 섹션을 포함하는 목록 설정입니다. (community는 사이드바의 기본 상단 섹션이며 More 드롭다운 하위 메뉴를 포함합니다.) 측면의 위/아래 화살표를 사용하여 메뉴 섹션의 순서를 변경합니다. 전역으로 표시되는 사용자 정의 섹션도 추가할 수 있습니다 - 메뉴 이름 슬러그를 사용하세요(예: Test Menu라는 제목의 사용자 정의 메뉴의 경우 설정에 test-menu를 추가).
테마 컴포넌트는 기본적으로 기본 설정을 사용합니다. 관리자는 순서 목록에 혼합하려는 전역 사용자 정의 메뉴 섹션을 추가한 다음, 기본 섹션과 함께 순서를 다시 정렬해야 합니다.
아래 스크린샷은 community 섹션과 “Dev Links”(dev-links), “Toolbox”(toolbox)라는 두 개의 예시 사용자 정의 메뉴 섹션이 왼쪽의 컴포넌트 관리자 패널과 오른쪽의 일반 사용자에게 어떻게 표시되는지 보여줍니다. 컴포넌트 관리자 설정에서 메뉴 섹션을 위/아래로 이동하는 화살표는 작은 빨간색 상자에 표시되어 있습니다.
또한, 위 관리자 스크린샷에서 inbox-section이라고 표시된 섹션을 주목해 보세요. 이는 Messages section for sidebar 컴포넌트가 사이드바에 삽입하는 Messages 섹션입니다(위에서 toolbox 사용자 정의 메뉴 아래). 이 컴포넌트를 사용하여 해당 섹션의 위치도 이동할 수 있음을 보여줍니다.
sidebar_menu_order 설정에 새로운 전역 사용자 정의 섹션을 추가한 후, 포럼 사용자는 브라우저를 새로고침하거나 사이드바를 접었다 펼쳤을 때 새로운 올바른 메뉴 순서를 확인하게 됩니다.
이 컴포넌트가 활성화된 상태에서 새로운 전역 사용자 정의 메뉴 섹션을 생성하면, 사이드바가 다시 렌더링될 때까지(페이지 새로고침 또는 접기/펼치기) 관리자에게 일시적으로 중복된 섹션이 표시될 수 있습니다.
사용자가 생성한 사용자 정의 메뉴 섹션은 해당 사용자의 사이드바 하단에 항상 표시되며, 그 외에는 영향을 받지 않습니다.
Admin -> All Site Settings -> Chat Separate Sidebar Mode 설정이 Always로 설정되어 있으면, 채팅 버튼은 평소와 같이 하단에 표시되며, 컴포넌트는 기본 채팅 메뉴 섹션(chat-dms, chat-channels, chat-search)을 무시합니다.
Yes it is. The link in the “install this theme component” button is outdated, but the link at the top is still correct and you can use that for installing the component manually
oh god the return of the 2 column sidebar. i thought that thing was gone? will have a look…
edit: i can’t repro this - when i adjust the browser size on my ipad to get the 2-column compact sidebar, it is in the correct order specified by the component. when i adjust the viewport size using the dev console, the sidebar shows it in the correct order as well (regardless of the viewport size).
you should be able to do some rails commands to rename it back. if your section is indeed called the-forum, then i think this should work from the rails console:
cd /var/discourse
./launcher enter app
rails c
section = SidebarSection.find_by(title: 'the-forum', public: true)
if section
section.update!(title: 'community')
puts "Done: renamed to 'community'."
else
puts "Section not found."
end
which would verify it is section_type = community with a different title. then we can do:
# find the default community section via rails enum
section = SidebarSection.find_by(section_type: :community)
# fallback: if not found by type, then look for the specific custom title
section ||= SidebarSection.find_by(title: 'the-forum', public: true)
if section
section.update!(title: 'Community')
puts "Success: The section has been renamed back to 'Community'."
else
puts "Error: Section not found."
end
screenshot of my rails console showing the community section titled the-forum and renaming it back to Community, then verifying it was changed:
Note: i just pushed some mobile fixes for this component - it had started rendering the horizontal lines between sidebar sections that should only show on desktop/tablet views.
I’m using this lovely theme component alongside Lilly’s equally lovely Discourse Group Sidebar Menus component. My use case is creating custom menus for clients so everyone in an organization can have quick links relevant specific to them, right at the top, after the community section.
Wanted to note for future travelers (including myself) that the sidebar section name is very sensitive and has to be an exact match, with spaces in the name converted to dashes. So “Doing business” becomes “doing-business”.
This is all well and good but when I created the group sidebar section I had put a space at the end of the group name accidentally, which became “doing-business-”. It took me some troubleshooting with developer tools to discover this.
These features are so important to me that I would really appreciate them being considered for adding to core, so they can be more readily available and easy to use on any discourse site.
thanks Tobias. i actually mention to use the section name slugs in the setting description, and it is also indicated in the screenshot examples (see “dev-links” = DEV LINKS).
perhaps i should add it elsewhere besides the setting descriptions.
소개
개요
설치 및 설정
설정
스크린샷
참고 사항
