들여쓰기/중첩 사이드바 카테고리 또는 하위 카테고리

:warning: 이 테마 컴포넌트는 Discourse Indented Subcategories를 대신하여 비추천(deprecated)되었습니다. 훨씬 더 간단하고 사용하기 쉬운 해당 테마로 전환해 주세요. 이 저장소는 더 이상 유지보수되지 않으며 2026년 2월 20일경에 아카이브 처리될 예정입니다.

:information_source: 요약 사이드바에서 선택된 카테고리 또는 하위 카테고리를 들여쓰기/중첩합니다
:hammer_and_wrench: 저장소 https://github.com/Lillinator/discourse-nested-categories
:eyeglasses: 미리보기 Discourse Theme Creator에서 미리보기
:question: 설치 가이드 테마 또는 테마 컴포넌트 설치 방법
:open_book: Discourse 테마를 처음 사용하시나요? Discourse 테마 사용 입문가 가이드

이 테마 컴포넌트 설치

이 간단한 테마 컴포넌트는 두 가지 방식으로 사용할 수 있습니다. 사이드바에서 들여쓰기(또는 중첩)할 카테고리 또는 하위 카테고리를 선택하는 방식이거나, 특정 카테고리 목록을 제외하고 모든 카테고리를 들여쓰기하도록 허용하는 방식입니다. 대부분의 사용자는 중첩된 모양을 보이도록 하위 카테고리만 들여쓰기를 원할 것입니다. 하지만 목록에 있는 카테고리 중 어떤 것이든 들여쓰기할 수 있습니다. 데스크톱 및 모바일 뷰, 그리고 헤더 드롭다운 메뉴에서도 작동합니다. 일부 코드에 도움을 주신 @dax님께 감사드립니다.

설정은 총 3가지가 있으며, 수행하려는 작업에 따라 첫 번째 설정만 사용하거나 두 번째와 세 번째 설정을 함께 사용해야 합니다.

설정 설명
indent only select categories 들여쓰기할 선택된 카테고리 또는 하위 카테고리 목록.
indent all categories except the following 아래 목록 설정에 포함된 카테고리를 제외하고 모든 카테고리를 들여쓰기하려면 이 설정을 활성화하세요. 위의 목록 설정은 비워 두어야 합니다.
categories not to indent 들여쓰기하지 않을 카테고리

사이드바의 설정 및 결과 스크린샷

선택된 카테고리만 들여쓰기

요약

설정:

결과:


지정한 카테고리를 제외하고 모든 카테고리 들여쓰기

설정:

결과:


참고: 위 스크린샷과 같이 비공개 카테고리의 카테고리 항목에서 잠금 아이콘을 숨기고 싶다면 이 컴포넌트를 사용할 수 있습니다.

29개의 좋아요

네!!! 드디어 사이드바를 사용할 수 있게 된 한 걸음이에요!

3개의 좋아요

잘하셨네요, @Lilly!

다만 제 인스턴스의 필요와는 좀 맞지 않네요. 제 인스턴스는 하위 카테고리가 많고 상위 카테고리는 적은데, 하위 카테고리 구성이 꽤나 동적으로 변합니다.

저희 인스턴스에는 모든 카테고리 및 하위 카테고리가 기본적으로 들여쓰기되고, 들여쓰지 않아야 할 카테고리 목록만 따로 관리되는 방식이 더 적합할 것 같습니다.

3개의 좋아요

음, 한번 생각해보자 - 무슨 말인지 이해가 가네. 좀 만져볼 테지만, 어쨌든 네가 말한 사용 사례는 처리할 거야 (별개의 컴포넌트로든, 추가 설정 몇 개로든). 부류(하위 카테고리)의 불릿을 포맷하거나 숨길 수 있는 설정도 포함하는 걸 고려하고 있었어. :thinking:

5개의 좋아요

컴포넌트를 업데이트하여 들여쓰기된 카테고리를 반대로 구성할 수 있도록 했습니다. 즉, 선택된 목록을 제외한 모든 항목을 들여쓰는 방식입니다. 이 기능이 사용 사례에 도움이 되기를 바랍니다. :slight_smile:

6개의 좋아요

우리 커뮤니티에서 정말 잘 어울리네요. 감사합니다!

2개의 좋아요

이 컴포넌트를 업데이트해 주세요. 오늘 ‘모든 카테고리’ 버튼이 다음 카테고리 제외하고 모든 카테고리 들여쓰기 설정이 사용될 때에도 들여쓰기가 되는 문제를 수정하기 위해 사소한 업데이트를 푸시했습니다.

4개의 좋아요

Lilly, 이 TC를 양방향으로 사용하는 재미를 느끼고 있어요!

하지만 한 가지 바보 같은 질문이 있어요:

왜 기본적으로 모든 하위 카테고리(상위 카테고리는 제외)를 들여쓰기하도록 하지 않을까요?

훌륭한 작업이었어요 @Lilly!

서브서브카테고리(Sub-Sub-Categories)에서도 작동하도록 조정할 수 있는 방법이 있을까요?

즉, 2단계의 들여쓰기가 가능해지도록요.

예를 들어:
Learning이라는 카테고리가 있고, 그 안에 서브카테고리(Learning Tools & How To’s)가 있으며, 다시 그 안에 Games & Best Practices라는 서브서브카테고리가 있는 경우입니다.
(Learning - learning tools - games) & (Learning - How To’s - Best Practices)

이처럼 games와 best practices를 중첩할 수 있으면 좋겠습니다.

2개의 좋아요

그렇게 불안해 보이진 않나요?

1개의 좋아요

안녕하세요 @Jagster,
말씀하신 게 무슨 뜻인지 잘 모르겠네요. 죄송합니다 :frowning:

눈은 직선이 아닌 것에 끌리기 마련입니다. 그래서 텍스트나 툴바 등에서 간격 등을 최대한 일정하게 유지하려고 합니다. 그런데 동시에 아이콘과 색상도 계속 변합니다. 메인 카테고리의 아이콘은 어떤 정보 가치를 지니지만, 나머지는 그렇지 않습니다. 이는 내비게이션을 더 쉽게 만드는 것이 아니라 오히려 방해합니다. 그리고 이러한 것들이 바로 서적이든 웹이든 깊은 중첩이 나쁜 아이디어인 주요 이유입니다. 게다가 귀중한 공간을 낭비하게 되고, 카테고리 이름도 더 이상 이름이 아닌 것이 되어버립니다.

만약 정말로 특정 주제가 방대해서 여러 개의 메인 카테고리와 적어도 그만큼의 하위 카테고리를 사용해야 하고, 그 아래에 수많은 하위-하위 카테고리까지 있는 경우(그리고 메인 및 1차 하위 카테고리는 다른 카테고리를 표시하는 헤더에 불과한 상태), 사이드바가 너무 길어져서 실제로 이를 사용할 사람이 하나도 없을 것입니다.

크게 소리 내어 말하고 싶지만, 이것은 로직 구조인 중괄호 { } 쌍을 표시하는 데 인텐트가 사용되는 CSS 스니펫과 완전히 똑같아 보입니다. 읽기 위해 설계된 것이 절대 아닙니다.

2개의 좋아요

@Jagster 님, 여기에 생각을 자세히 말씀해 주셔서 감사합니다. 피드백을 진심으로 감사드립니다.

특히 사이드바를 지나치게 길게 만들지 말아야 한다는 점과, 색상과 아이콘이 자연스럽게 어우러지지 않는다는 지적은 매우 좋습니다.

중첩된 카테고리를 아코디언처럼 펼칠 수 있다면 좋겠습니다. 그러면 짧은 사이드바를 유지하면서도 사이트를 빠르게 탐색할 수 있어 두 가지의 장점을 모두 누릴 수 있을 텐데요.

1개의 좋아요

이 토픽을 읽어보시는 것을 추천드립니다. 특히 Wix 포럼과 카테고리 단순성에 대한 게시글을 꼭 확인해 보세요.

또한 사용자들은 자신의 카테고리 사이드바 섹션을 직접 커스터마이즈할 수 있다는 점도 염두에 두세요.

솔직히 말해서, 중첩 구조에서 하위-하위 카테고리가 어떻게 작동할지 이해가 되지 않습니다. 시각적으로 다소 어지러워질 것 같네요. 이 컴포넌트에 구현할 수 있는지도 확신이 서지 않습니다…

6개의 좋아요

이 플러그인을 인스턴스에 설치했는데, 하위 카테고리들이 들여쓰기되지 않고 있습니다…
적어도 제가 그렇게 생각했었죠. '선택한 것을 제외한 모든 항목 들여쓰기’로 설정하고 목록은 비워두었습니다.
처음에는 모든 것, 카테고리까지도 들여쓰기되고 있다는 걸 깨닫지 못했습니다.
'모든 하위 카테고리 들여쓰기’라는 간단한 체크박스 옵션을 추가해서 업데이트해 주실 수 있을까요? 원하시면 제외 목록도 추가할 수 있지만, 제 사용 사례에서는 항상 하위 카테고리는 들여쓰기하고 카테고리는 절대 들여쓰기하지 않기를 원합니다.

해당 사용 사례에서 Categories not to indent 박스에 카테고리를 단순히 넣으면 되지 않을까요?

동의합니다. 하위 카테고리만 들여쓰기하는 것이 더 깔끔할 것입니다. 다만, @Lilly가 이 TC를 개발했을 당시에는 이를 구현하는 것이 상당히 까다로웠습니다. 개인적으로, 카테고리가 비정상적으로 동적이지 않는 한 위 해결책은 매우 실용적이라고 생각합니다.

기회가 되어…

기능 요청 - 확장/축소 가능한 하위 카테고리

이 내용은 여기서 논의되고 있습니다:

이 Theme Component의 확장 기능으로 작동할 수 있을지 궁금합니다.

관심 있는 분이 힘을 합치기로 한다면, 이를 위해 예산을 일부 확보할 수 있을 것입니다.

1개의 좋아요

부연설명으로, 제가 추가한 JS(공유할 수 있는 몇 가지 추가 수정 사항이 있습니다)는 임시 대안으로 작동합니다. 기본적으로 페이지 로드 시 하위 카테고리를 접어 두고, 체브론을 주입하여 사용자가 확장하거나 상위 항목으로 이동할 수 있게 합니다. 유일한 문제는 일부 상호작용 시 내비게이션이 완전히 다시 작성되므로, JS가 하위 카테고리를 접은 상태로 유지하기 위해 클래스를 다시 적용해야 한다는 점입니다(예: 상단의 햄버거 메뉴를 상호작용하거나 모바일에서 상호작용하는 경우).

물론, 제가 지금 하고 있는 방법입니다. 다만 처음에는 바로 이해하지 못했네요.
새로운 사이트를 구축하는 단계에서는 카테고리와 하위 카테고리를 계속 추가하고 있기 때문에 지금은 좀 번거롭습니다. 개발이 끝나면 거의 정적인 상태로 유지될 것입니다.

1개의 좋아요

이 테마 구성 요소는 Indented Subcategories 을 권장하며 더 이상 사용되지 않습니다. 해당 구성 요소로 전환해 주세요. 훨씬 더 단순하고 사용하기가 쉽습니다. 이 저장소는 더 이상 유지 관리되지 않으며 한 달 내에 아카이브 처리됩니다.

3개의 좋아요

@Lilly, 감사합니다. OP를 업데이트했습니다.

1개의 좋아요