그룹 사이드바 메뉴

:information_source: 요약 선택된 그룹을 위한 사용자 지정 사이드바 메뉴 생성
:hammer_and_wrench: 저장소 https://github.com/Lillinator/group-sidebar-menus
:question: 설치 가이드 테마 또는 테마 컴포넌트 설치 방법

이 테마 컴포넌트 설치

:woman_technologist:t2: 개요

이 Discourse 테마 컴포넌트는 포럼 관리자가 선택된 그룹의 멤버만 접근할 수 있는 사용자 지정 사이드바 메뉴를 생성할 수 있는 기능을 제공합니다.

주요 기능:

  • 그룹 기반 메뉴 가시성 - 메뉴 섹션은 권한이 있는 사용자 사이드바에만 렌더링됩니다.
  • 객체 기반 구성 - 메뉴 생성을 위한 사용하기 쉬운 설정 UI 제공
  • 다중 섹션 - 서로 다른 그룹을 위한 무제한의 메뉴 섹션 생성 (합리적인 범위 내에서)
  • 관리자 빠른 편집 링크 - 메뉴 헤더의 연필 아이콘을 통해 관리자가 컴포넌트 설정으로 바로 이동할 수 있습니다.

:briefcase: 사용 사례 예시

  • 스태프 전용 리소스 및 빠른 링크
  • 카테고리 모더레이터 단축키
  • 사용자 지정 그룹 포털 (프로젝트 팀, 스터디 그룹, 북클럽, VIP 멤버)
  • 상위 또는 파트너 웹사이트 리소스 링크

:gear: 설정

메뉴 섹션 (menu_sections)

사용자 지정 그룹 메뉴 섹션을 구성하기 위해 객체 설정 편집기를 엽니다.

섹션 속성

속성 설명
메뉴 제목 사이드바 섹션 헤더로 표시되는 제목
허용된 그룹 이 메뉴 섹션을 볼 수 있는 그룹 (섹션당 최대 20개 그룹)
메뉴 링크 이 섹션에 표시할 링크 모음 (섹션당 최대 20개 링크)

링크 속성

속성 설명
아이콘 FontAwesome 아이콘 이름 (예: circle-info, star, user-group). Admin > All site settings > svg icon subset에 추가해야 할 수 있습니다
텍스트 링크에 표시되는 라벨
URL 링크 대상 - 상대 경로(/faq, /my/preferences)와 절대 URL(https://example.com) 모두 지원

:wrench: 설치 및 구성

  1. Installing a theme or theme component 에 따라 테마 컴포넌트를 설치합니다.
  2. Objects setting editor로 이동합니다.
  3. 첫 번째 사용자 지정 메뉴 섹션을 설정하려면 + new_menu_section 버튼을 클릭합니다.
  4. Menu title 필드에 새 메뉴 제목을 입력한 다음, 해당 메뉴에 접근할 수 있는 그룹을 선택합니다.
  5. + new_menu_section을 클릭하여 다른 섹션을 추가하거나 변경 사항을 저장합니다.
관리자 구성 스크린샷 및 예시 설정

신규 설치 - Objects setting editor로 이동합니다.

사용자 3명(관리자 1명 포함)과 사용자 지정 메뉴 2개가 있는 예시 시나리오:

  • @Catra는 고양이를 좋아하고 pink 그룹의 멤버이며, Cat Menu에 접근할 수 있습니다 :grinning_cat:
  • @HelloKitty는 개를 좋아하고 purple 그룹의 멤버이며, Dog Menu에 접근할 수 있습니다 :dog_face:
  • @Lilly는 개를 키우고 개가 더 좋기 때문에 purple 그룹의 멤버입니다. 또한 그녀는 포럼 관리자이기도 하며, 관리자는 Cat Menu에 접근할 수 있습니다. 고양이는 더 많은 감독이 필요하기 때문이죠 :dog_face: :cat_with_wry_smile:

새로운 사용자 지정 메뉴 생성 - 예시를 위해 Cat menu를 생성하고 접근할 수 있는 그룹인 pinkadmins를 추가합니다. 그런 다음 새 메뉴의 링크를 설정하기 위해 + menu_link 버튼을 클릭합니다.

몇 가지 메뉴 링크 추가 - 1. Fontawesome 아이콘 이름, 2. 링크에 표시할 텍스트, 3. 상대 또는 절대 URL. 이 메뉴에 다른 링크를 추가하려면 + menu_link 버튼을 클릭합니다.

Dog menu라는 또 다른 사용자 지정 메뉴 섹션을 생성하고, purple 그룹에만 접근 권한을 부여한 후 링크를 구성합니다:

결과 사이드바 메뉴 접근 스크린샷

사용자 @Catra에게는 Cat 메뉴가 있습니다! :grinning_cat:

사용자 @HelloKitty에게는 Dog 메뉴가 있습니다! :dog_face:

관리자 사용자 @Lilly에게는 두 메뉴 모두 있으며 편집할 수 있습니다! :smiling_cat_with_heart_eyes:

구성 예시

Menu Title: "Cat Stuff"
Allowed Groups: team-cat
Links:
  - Icon: link
    Text: Cat videos & photos
    URL: /t/cat-videos-and-photos/123
  - Icon: magnifying-glass
    Text: Cat wiki
    URL: https://en.wikipedia.org/wiki/Cat

:light_bulb: 중요 참고 사항

관리자 접근

관리자는 해당 그룹에 구성된 메뉴를 보려면 자신도 그룹에 추가해야 합니다. 관리자 상태만으로는 모든 사용자 지정 메뉴에 대한 접근 권한이 부여되지 않습니다. 이는 의도된 동작입니다. 또한, 메뉴의 허용된 그룹에 속하는 관리자는 섹션 헤더에 컴포넌트 설정으로 연결되는 연필 아이콘을 볼 수 있습니다.

그룹 구성

  • everyone 그룹은 지원되지 않습니다 - 모든 사용자(익명 방문자를 포함)를 위한 전역 사용자 지정 메뉴를 만들려면 네이티브 사이드바 푸터 UI를 사용하세요.
  • 메뉴 섹션당 최대 20개 그룹. 더 많은 그룹이 필요하면 다른 그룹 할당으로 중복 섹션을 생성하세요.
  • 여러 그룹에 속한 사용자는 접근할 수 있는 모든 메뉴 섹션을 봅니다.

테스트 및 조직

서로 다른 그룹 조합에 대한 올바른 접근을 검증하기 위해 테스트 계정을 사용하세요. 복잡성이 증가함에 따라 혼란을 피하기 위해 메뉴 구성을 추적하세요. 많은 그룹이 있는 대형 포럼의 경우 접근 권한 매트릭스 또는 유사한 문서화를 권장합니다.

보안 고려 사항

이 컴포넌트는 UI 수준의 접근 제어만 제공합니다. 리소스 접근이 아닌 메뉴 가시성을 제어합니다 - 이 컴포넌트는 실제 리소스에 누가 접근할 수 있는지를 제어하는 것이 아니라, 사이드바에 무엇이 렌더링되는지를 제어합니다.

실제 리소스를 보호하려면 항상 Discourse의 내장 권한 시스템에 의존하세요:

  • 카테고리 권한을 올바르게 구성
  • 토픽 가시성 제한 설정
  • 콘텐츠에 대한 그룹 기반 접근 제어 사용
  • 비공개 리소스가 인증을 요구하도록 보장

관리자 모범 사례:
링크된 카테고리 보안 권한과 그룹 구성원 자격을 별도로 구성하세요 - 예를 들어, 비공개 카테고리로의 메뉴 링크는 해당 카테고리의 권한이 올바르게 구성되어 있어야 합니다. 관리자는 선택된 그룹에 대해 외부 리소스로의 링크가 적절히 인증되었는지 확인하는 책임이 있습니다.


이것은 @Moin과의 협업 프로젝트였습니다 - 그녀의 의견, 영감 및 피드백은 매우 가치있었습니다.


내 다른 Discourse 관련 작업 보기
15개의 좋아요

I seem to be getting a 404 on the repo.

EDIT: All good now!

2개의 좋아요

haha try again. forgot to make it public! :laughing:

6개의 좋아요

Fabulous! I’ve been wanting this for some time. I’ve built a nice collection of useful custom sidebar menus for myself–links for moderation, for admins tasks & reference, for Discourse documentation, for external content we frequently reference in the forum, etc. One menu has links for the various periodic meetings that simply uses the tag link, e.g. /tag/comm-mgt-monthly that helps me jump to current and previous agendas and minutes quickly.

I’ve many times wished for a way to export my custom sidebar menu configs so others on my team could import–this is a far superior configuration!

And icons! Yay! AFAIK the only way to do this was to add custom CSS. This new solution is elegant.

And sustainable! All admins will be able to edit the configuration files, so not reliant on me only. Thanks @Lilly and @Moin!

2개의 좋아요

Hi @Lilly and @Moin,

Thank you for building this component.

I was using Group sidebar menu sections - deprecated on my self-hosted site and on my latest update was warned that the older theme component had been deprecated and to install this one, instead.

I’ve installed the component and created my custom group menu, but am just not seeing how to move the group menu. (I must be looking right past something obvious. :see_no_evil_monkey:) In your screenshots, your Cat Menu and Dog Menu are on the sidebar navigation above the Topics section, but my custom group menu is appearing at the very bottom of my sidebar navigation. How do I move it up above Topics?

3개의 좋아요

It’s not obvious. Lilly used Discourse Sidebar Menu Reorder to put cat-menu at the top

4개의 좋아요

Thank you so much! That was very easy to configure.

4개의 좋아요

이 컴포넌트를 사용 중이시라면 업데이트해 주세요. 여기의 핵심 변경 사항에 따라 일부 리팩토링이 이루어졌습니다: Granular group-based permissions for anonymous and logged in users

3개의 좋아요

이 컴포넌트는 새로운 아이콘 객체 유형 설정을 사용하도록 업데이트되었으므로, 최신 Discourse 버전으로 업데이트한 후 이 컴포넌트도 업데이트해 주세요. 마이그레이션이 원활하게 이루어지므로 (Discourse가 최신 상태라면) 변경할 필요가 없어야 합니다.

2개의 좋아요