# Discourse Popular Tag Sidebar
**URL:** https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853
**Category:** Theme component
**Created:** [1월 29, 2019, 6:07오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853 "2019-01-29T18:07:12Z")
**Posts on this page:** 20
**Page:** 1
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [1월 29, 2019, 6:07오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/1 "2019-01-29T18:07:12Z")
This theme component displays a category’s most popular tags in a sticky sidebar on screens wider than 767px (most tablets and desktop devices).
⚠ You must enable the `show filter by tag` setting on your site for this theme component to work.
## What can I do with this theme component?
- Display 3-30 Popular tags in a sidebar for each category
- Set the sidebar side to left or right
- Prevent the sidebar from appearing in certain categories
- Change the “Popular tags” header text
## Custom CSS
Each sidebar is wrapped with a class that contains the category name, so for the UX category that would be `.ux-sidebar`. You can use these classes to style individual sidebars.
The html tag on pages with sidebars also has a class added so you can use `html.custom-sidebar` to apply styles on all pages that have a sidebar.
| | | |
| --- | --- | --- |
| 🛠 | **Repository** | [github.com/awesomerobot/discourse-popular-tag-sidebar](https://github.com/awesomerobot/discourse-popular-tag-sidebar) |
| 📖 | **New to Discourse Themes?** | [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) |
Install this theme component
---
### Author:  [@Andy02](https://meta.discourse.org/u/Andy02)
#### Post date: [9월 15, 2019, 7:23오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/6 "2019-09-15T19:23:27Z")
this would make an incredibly powerful navigation tool if it showed the most common in each category and tag-page and it was positioned in a banner, or other item at the top of the page.
---
### Author:  [@AnkitJain](https://meta.discourse.org/u/AnkitJain)
#### Post date: [10월 2, 2019, 3:58오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/7 "2019-10-02T03:58:49Z")
정말 잘하셨네요.
현재 카테고리 목록에서 첫 번째 카테고리 페이지에서만 사이드바가 표시됩니다.
모든 카테고리에 사이드바를 활성화하려면 어떻게 해야 하나요?
---
### Author:  [@dax](https://meta.discourse.org/u/dax)
#### Post date: [10월 4, 2019, 2:33오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/8 "2019-10-04T14:33:56Z")
부모 카테고리에 표시되는 태그 사이드바에는 부모 카테고리 태그와 자식 카테고리 태그가 모두 포함됩니다. 모든 카테고리와 하위 카테고리에 이 기능을 활성화하려면 다음 링크의 코드를 수정해야 합니다: [discourse-popular-tag-sidebar/desktop/header.html at master · awesomerobot/discourse-popular-tag-sidebar · GitHub](https://github.com/awesomerobot/discourse-popular-tag-sidebar/blob/master/desktop/header.html).
---
### Author:  [@AnkitJain](https://meta.discourse.org/u/AnkitJain)
#### Post date: [10월 8, 2019, 11:35오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/12 "2019-10-08T11:35:32Z")
현재 카테고리 페이지에서 첫 번째 카테고리에만 표시됩니다.
그래서 어떤 부분의 코드를 수정해야 하며, 모든 페이지에서 작동하게 하려면 어떻게 해야 하나요?
자세히 도와주시면 감사하겠습니다. 죄송하고 감사합니다.
> [@dax](#):
>
> 모든 카테고리 및 하위 카테고리에 활성화하려면 여기의 코드를 변경해야 합니다. [discourse-popular-tag-sidebar/header.html at master · awesomerobot/discourse-popular-tag-sidebar · GitHub](https://github.com/awesomerobot/discourse-popular-tag-sidebar/blob/master/desktop/header.html).
이 변경 사항에 대해 도와주실 수 있나요? 코딩을 많이 이해하지 못합니다. 도와주세요.
> [@awesomerobot](#):
>
> 특정 카테고리에서 사이드바가 표시되지 않도록 방지
카테고리 목록의 첫 번째 카테고리에서만 표시되고 다른 곳에는 표시되지 않습니다. 도와주세요.
---
### Author:  [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [1월 23, 2020, 12:16오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/13 "2020-01-23T12:16:19Z")
그 대신 주제 목록 위에 표시할 수 있는 방법이 있을까요?
---
### Author:  [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [1월 23, 2020, 12:37오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/14 "2020-01-23T12:37:44Z")
알고 계셨을지 모르겠지만, 이미 바닐라 디스코스에 옵션 태그 드롭다운이 존재하며(위 이미지 참조), 토픽 목록 위에 표시됩니다.
---
### Author:  [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [1월 23, 2020, 1:20오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/15 "2020-01-23T13:20:38Z")
이해는 하지만, 제 용도에는 목록이나 일종의 태그 클라우드를 표시하고 싶습니다.
---
### Author:  [@swamidass](https://meta.discourse.org/u/swamidass)
#### Post date: [4월 19, 2020, 1:32오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/17 "2020-04-19T01:32:47Z")
> [@AnkitJain](#):
>
> > [@](#):
> >
> > 특정 카테고리에서 사이드바가 표시되지 않도록 방지
>
> 카테고리 목록의 첫 번째 카테고리에서만 표시됩니다. 다른 카테고리에서는 전혀 표시되지 않아요. 도움을 주세요.
네, 저도 같은 문제를 겪고 있습니다. 해결 방법이 있을까요?
카테고리 페이지에서는 이제 정상적으로 작동하는 것을 확인했습니다. 하지만 최신 스레드(Latest thread)에서도 작동하게 하는 방법이 있을까요?
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [5월 12, 2020, 11:06오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/18 "2020-05-12T23:06:36Z")
> [@AnkitJain](#):
>
> > [@](#):
> >
> > 특정 카테고리에서 사이드바가 표시되지 않도록 방지
>
> 카테고리 목록의 첫 번째 카테고리에서만 표시되고, 다른 카테고리에서는 표시되지 않습니다. 도움을 주세요.
이 문제를 조금 더 자세히 설명해 주실 수 있을까요? 사이드바가 한 개의 카테고리에서만 표시되고 다른 곳에서는 표시되지 않는다는 말씀인가요?
시도 중인 모든 카테고리에 태그가 3개 이상인 토픽이 있나요? 특정 카테고리 내에서 태그가 3개 미만이면 사이드바가 표시되지 않습니다.
> [@swamidass](#):
>
> 이제 카테고리 페이지에서는 작동하는 것을 확인했습니다. 하지만 최신 스레드(Latest thread)에서도 작동하도록 하는 방법이 있을까요?
네, 다른 페이지에 대한 지원도 추가할 수 있을 것 같습니다.
---
### Author:  [@manchestermania](https://meta.discourse.org/u/manchestermania)
#### Post date: [5월 12, 2020, 11:26오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/19 "2020-05-12T23:26:46Z")
질문이 하나 있습니다. 사이드바의 태그에서 태그를 클릭하면 URL이 [https://www.example.id/tags/c/sub-categoriy/Tags-name](https://www.example.id/tags/c/sub-categoriy/Tags-name) 으로 표시됩니다.
같은 페이지에서 직접 클릭할 때는 문제가 없지만, 마우스 우클릭으로 새 탭에서 열면 "_Oops! That page doesn’t exist or is private._"라는 메시지가 나타납니다.
왜 URL 형식이 일반적인 태그 URL인 [https://www.example.id/tags/tag-name처럼](https://www.example.id/tags/tag-name%EC%B2%98%EB%9F%BC) 되지 않을까요?
또 다른 질문은, 텍스트(태그) 사이의 간격을 1 또는 1.5(정확하지는 않음)가 아닌 2로 설정하는 방법입니다.
감사합니다.
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [5월 13, 2020, 12:03오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/20 "2020-05-13T00:03:21Z")
최상단 메뉴 페이지(최신, 인기, 신규 등)에서 태그 사이드바를 선택적으로 표시하는 기능을 추가했습니다. 기본적으로 비활성화되어 있으며, 테마 구성 요소 설정에서 활성화할 수 있습니다.
>
>
> FIX: correct urls for subcategories
> [@manchestermania](#):
>
> 직접 클릭할 때(같은 페이지)에는 문제가 없지만, 우클릭하여 새 탭에서 열면 “ _Oops! That page doesn’t exist or is private._ ”라는 메시지가 표시됩니다.
>
> URL 형식이 일반 태그 URL([https://www.example.id/tags/tag-name](https://www.example.id/tags/tag-name))과 다른 이유는 무엇인가요?
제 실수였습니다. 하위 카테고리를 고려하지 못했기 때문에 URL을 맞게 재구성했습니다. 이제 수정되었습니다.
> [@manchestermania](#):
>
> URL 형식이 일반 태그 URL([https://www.example.id/tags/tag-name](https://www.example.id/tags/tag-name))과 다른 이유는 무엇인가요?
해당 URL은 모든 카테고리의 모든 태그를 표시합니다. 카테고리 내부에서 사이드바의 태그를 클릭할 때, 현재 카테고리의 컨텍스트 내에서 해당 태그를 보는 경험을 제공하고자 했습니다.
> [@manchestermania](#):
>
> 또 다른 질문인데, 텍스트(태그) 사이의 간격을 1 또는 1.5(확신은 없는데)가 아니라 2로 설정하는 방법이 궁금합니다.
정확히 어떤 말씀인지 잘 모르겠습니다. 구체적인 예를 들어 주시겠어요?
---
### Author:  [@manchestermania](https://meta.discourse.org/u/manchestermania)
#### Post date: [5월 13, 2020, 12:27오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/21 "2020-05-13T00:27:08Z")
> [@awesomerobot](#):
>
> 최신, 인기, 신규 등 상단 메뉴 페이지에서 태그 사이드바를 선택적으로 표시하는 기능을 추가했습니다. 기본적으로 비활성화되어 있으며, 테마 구성 요소 설정에서 활성화할 수 있습니다.
와… 새 탭에서 열면 이제 작동하네요. 정말 감사합니다…
> [@awesomerobot](#):
>
> 정확히 무슨 말씀이신지 잘 모르겠는데, 구체적인 예시를 주실 수 있나요?
영어가 서투러서 죄송합니다 😀
"Add space"는 _줄 간격_(MS Word 같은)을 2로 변경하는 것을 의미합니다. 현재는 1 또는 1.5처럼 보이며, 이렇게 하면 태그 사이의 공간이 더 넓어집니다.
또한, 태그 텍스트 색상을 변경할 수 있나요? 파란색에서 회색으로요.
한 가지 더 질문이 있는데, 인기 태그를 항상 볼 수 있나요?
아래로 스크롤하면 '인기 태그’라는 글자는 보이지 않고, 태그 목록만 보입니다.
다시 한번… 도움 주셔서 정말 감사합니다
---
### Author:  [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [5월 13, 2020, 1:09오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/22 "2020-05-13T01:09:39Z")
> [@manchestermania](#):
>
> "여백 추가"는 _줄 간격_(MS Word와 유사하게)을 현재 1 또는 1.5로 보이는 값에서 2로 변경하는 것을 의미하므로, 태그 사이의 공간이 더 넓어집니다.
아, 알겠습니다. 테마에 다음과 같은 CSS를 추가할 수 있습니다(관리자 \> 사용자 지정 \> 테마):
```css
.tag-sidebar a:nth-of-type(2) {
margin-top: 5px;
}
```
텍스트 색상도 비슷하게 설정할 수 있습니다.
```css
.tag-sidebar a {
color: red;
}
```
> [@manchestermania](#):
>
> 아래로 스크롤하면 "인기 태그"라는 단어가 보이지 않고, 태그 목록만 보입니다.
이것은 아마도 현재 사용 중인 테마의 문제일 것입니다. 다음과 같이 사이드바의 상단 위치를 조정할 수 있습니다:
```css
.topic-list.with-sidebar > .tag-sidebar {
top: 120px;
}
```
이 모든 것은 일반적인 CSS 변경 사항입니다… 이러한 스타일 변경을 더 많이 하려면 몇 가지 CSS 튜토리얼을 따르는 것을 권장합니다. [CSS styling basics - Learn web development | MDN](https://developer.mozilla.org/en-US/docs/Learn/CSS/First_steps) 은 좋은 무료 자료입니다!
---
### Author:  [@Bcat](https://meta.discourse.org/u/Bcat)
#### Post date: [5월 13, 2020, 5:10오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/23 "2020-05-13T05:10:34Z")
안녕하세요, 31번째 줄에서 문제가 발생하고 있습니다: [discourse-popular-tag-sidebar/desktop/header.html at master · awesomerobot/discourse-popular-tag-sidebar · GitHub](https://github.com/awesomerobot/discourse-popular-tag-sidebar/blob/master/desktop/header.html)
이 오류를 확인하는 데 도움을 주실 수 있나요?
---
### Author:  [@Zup](https://meta.discourse.org/u/Zup)
#### Post date: [9월 22, 2020, 2:38오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/24 "2020-09-22T02:38:04Z")
최대 30개 태그 제한의 이유는 무엇인가요?
---
### Author:  [@Benjamin\_D](https://meta.discourse.org/u/Benjamin_D)
#### Post date: [3월 1, 2021, 12:14오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/25 "2021-03-01T12:14:06Z")
크리스님 안녕하세요!
이 커밋으로 `number_of_tags` 옵션이 사라진 건 아닌지 궁금합니다. 🤔
>
---
### Author:  [@Zup](https://meta.discourse.org/u/Zup)
#### Post date: [3월 20, 2021, 12:42오전 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/26 "2021-03-20T00:42:47Z")
태그 최대 수를 100개로 늘리고, 알파벳 순서로 정렬된 버블 텍스트 클라우드 형태로 반응형 높이로 표시되면 정말 좋겠습니다. 다시 말해, 태그가 인기 있을수록 글자 크기가 더 커지는 방식이죠. “탑 100” 태그를 말하는 겁니다.
또한 모바일에서는 카테고리 목록 위에 가로로 배치되면 좋겠습니다. 모바일에서 이 기능이 정말 필요합니다. 🤩
---
### Author:  [@Kumar\_Karuppaiah](https://meta.discourse.org/u/Kumar_Karuppaiah)
#### Post date: [12월 27, 2021, 12:51오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/27 "2021-12-27T12:51:22Z")
안녕하세요,
헤더 아래에 인기 태그 목록을 표시하려면 어떻게 해야 하나요? 제안을 주시면 감사하겠습니다.
감사합니다
---
### Author:  [@mattdm](https://meta.discourse.org/u/mattdm)
#### Post date: [12월 28, 2021, 6:26오후 UTC](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853/28 "2021-12-28T18:26:35Z")
불행히도 이 컴포넌트는 [Discourse Tag Sidebars](https://meta.discourse.org/t/discourse-tag-sidebars/111114) 와 충돌합니다. 두 가지를 모두 활성화하면 태그가 모두 한 줄로 뭉쳐서 다음과 같은 모습이 됩니다:
그리고 태그 사이드바는 아예 표시되지 않습니다.
이것은 안타까운 일입니다. 왜냐하면 이 두 기능은 \_상호 보완적\_이어야 하기 때문입니다. 즉, “모든 태그” 보기(그리고 아마도 “태그 없음” 보기에도)에 대한 태그 목록과 _특정_ 태그에 대한 사이드바 말이죠. 사실, 이 둘을 하나의 단일 컴포넌트로 통합할 수도 있지 않을까요?
[다음 페이지](https://meta.discourse.org/t/discourse-popular-tag-sidebar/107853.md?page=2)