Category Icons

커스터마이징 테마 컴포넌트
, ,
87

네, 올바른 접두사를 항상 설정하는 것이 최선의 방법이라고 생각합니다. FontAwesome Pro 플러그인은 코어 아이콘을 사용자가 선택한 스타일로만 교체하며, 변환된 아이콘 목록은 이 파일을 참고하세요:

comments는 해당 목록에 포함되어 있지 않으므로 기본적으로 코어 아이콘이 사용됩니다.

4개의 좋아요
88

이벤트 플러그인의 캘린더 뷰에 아이콘을 추가하기 위해 테마 컴포넌트를 만들었습니다.

이 컴포넌트는 category-icon 위젯을 사용하는데, 이 위젯은 하위 카테고리에는 아이콘을 표시하지 않습니다. 그래서 다음과 같은 "강제 표시 모드(force mode)"를 추가해야 했습니다:

  api.createWidget("category-icon", {
    tagName: "div.category-icon-widget",
    html(attrs) {
      let iconItem = getIconItem(attrs.category.slug);
      let force_display = ('force_display' in attrs);
      if(iconItem && (!attrs.category.parent_category_id || force_display)) {
        let itemColor = iconItem[2] ? `color: ${iconItem[2]}` : "";
        let itemIcon = iconItem[1] != '' ? iconNode(iconItem[1]) : "";
        return h("span.category-icon", { "style": itemColor }, itemIcon);
      }
    }
  });

이런 해킹 없이 동일한 결과를 얻을 수 있는 방법이 있을까요?
만약 없다면, 이 기능을 코드에 추가해 주실 수 있을까요?

미리 감사합니다.

2개의 좋아요
89

Penar님, 안녕하세요. 이 컴포넌트가 카테고리에서 이상한 정렬 문제를 일으키고 있습니다. 재현 방법은 다음과 같습니다:

  1. 카테고리의 정렬을 '생성일 > 내림차순’으로 설정하면 카테고리가 올바르게 정렬됩니다.
  2. 해당 카테고리 내의 주제(Topic)를 방문합니다.
  3. 브레드크럼을 클릭하여 카테고리로 돌아갑니다.
  4. 이제 카테고리가 '생성일’이 아닌 '최신순’으로 정렬되어 있습니다. 페이지를 새로고침하면 올바른 정렬이 다시 적용됩니다.

이 TC(테마 컴포넌트)가 문제의 원인임을 파악하는 데 상당한 조사가 필요했는데, 매우 이상합니다!

실제로 작동하는 모습을 녹화한 영상이 있습니다.

주제 1은 먼저 생성되었지만 답변이 있습니다.
주제 2는 두 번째로 생성되었고 답변이 없습니다.

‘생성일’ 정렬을 적용하면 주제 2가 목록 상단에 위치해야 하는데, 처음에는 올바르게 그렇게 표시됩니다. 하지만 주제를 방문한 후 브레드크럼을 클릭하면 주제 1이 목록 상단에 위치하게 됩니다.

2개의 좋아요
90

@davidkingham, 자세한 리포트 감사합니다. 아주 교묘한 버그였네요. 수정 사항을 게시했습니다.

2개의 좋아요
91

오늘 업데이트 이후로 이 기능을 꺼야 했습니다. 시작 페이지와 카테고리를 망가뜨리거든요. 스크린샷을 여기에 올리고 싶지만, 제 포럼은 19세 이상 이용 가능이라 @pmusaraj 님께 개인 메시지로 스크린샷을 보내겠습니다.

2개의 좋아요
92

@zooy0rk, 보고해 주셔서 감사합니다. 해당 문제도 이제 수정되었습니다.

5개의 좋아요
93

새로운 업데이트가 내 사이트 전체의 UI를 깨뜨리는 것 같습니다

asdasdasdasd
asdasdasdasd1455×702 15.3 KB

2개의 좋아요
94

콘솔에 오류가 있나요? 어떤 버전의 Discourse를 사용 중인가요?

1개의 좋아요
95

네, 최신 2.6.0.beta1 릴리스로 업데이트했는데, 그로 인해 문제가 해결된 것 같습니다.

4개의 좋아요
96

문제를 해결하는 데 도움을 받고 싶습니다… 이 테마 구성 요소를 사용하여 카테고리 잠금 아이콘을 별 아이콘으로만 변경하려고 하는데, 결과가 들쭉날쭉합니다.

최근 주제 목록의 아이콘은 변경됩니다:

Latest
Latest816×792 33.4 KB

카테고리 드롭다운 메뉴의 아이콘도 변경됩니다:

Dropdown
Dropdown464×914 28.8 KB

하지만 카테고리 목록 홈페이지(/categories)의 카테고리 옆 아이콘은 변경되지 않고 여전히 잠금 아이콘입니다:

Lock
Lock1317×514 106 KB

무언가를 놓치고 있는 걸까요? 뭔가 빠뜨리고 있는 것 같은데요…

테마 설정은 다음과 같습니다:

Theme Settings
Theme Settings1200×492 83.5 KB

왜 그 잠금 아이콘이 그대로 남아 있는지에 대한 수수께끼를 풀어주는 도움이 있다면 정말 좋겠습니다!! 감사합니다!

3개의 좋아요
97

아이콘 이름은 단순히 “star” 대신 far-star를 사용해 보세요.
"far"은 일반 아이콘을, "fab"은 브랜드 이름 아이콘을 나타냅니다.

98

이것은 해당 컴포넌트의 한계로, /categories 페이지에 연결되지 않습니다. 이 문제를 수정하는 방법을 찾아보겠습니다. 아마도 먼저 코어에서 변경이 필요할 것입니다.

3개의 좋아요
99

모든 잠금 아이콘을 별 모양으로 변경하려는 경우, 새로운 테마 컴포넌트를 생성하고 헤더 섹션에 다음을 추가할 수 있습니다:

<script type="text/discourse-plugin" version="0.8">
      api.replaceIcon('lock', 'star');
</script>
4개의 좋아요
100

@davidkingham 감사합니다, 정말 훌륭합니다! 고민해 본 결과, 모든 자물쇠를 별표로 바꾸는 데 동의합니다. 그리고 당신의 코드가 완벽하게 작동합니다. 정말 감사드립니다 :clap:

3개의 좋아요
101

기록을 위해 말씀드리면, core와 해당 컴포넌트도 업데이트되었으며, 이제 컴포넌트가 /categories 페이지에서 잠금 아이콘을 업데이트합니다.

5개의 좋아요
102

https://github.com/discourse/discourse-category-icons/pull/6

Category Icons - #50 by md-misko 에서 설명된 하위 카테고리 아이콘 표시 문제도 함께 수정해 주시면 좋겠습니다.

3개의 좋아요
103

@ScammerRevolts @zooy0rk 하하, 저도 같은 문제가 있었어요. 문제가 더 심각하지 않아서 정말 다행이에요. 재빌드 중에 다른 PostgreSQL 관련 오류들이 있어서 이게 원인인 줄은 절대 몰랐을 거예요. :sweat_smile: 백업을 복원할 새 인스턴스를 이미 준비 중이었거든요. 해당 컴포넌트를 업데이트한 후 완전히 정상화되었는데, 기억이 맞다면 약 4개 리비전 정도 뒤처져 있었던 것 같아요.

안전 모드(Safe mode)가 문제를 좁히는 데 정말 도움이 되었어요: Using Safe Mode to troubleshoot issues with themes and plugins

2개의 좋아요
104

@md-misko 님, PR 감사합니다! 이제 병합되었습니다.

또한 /categories의 하위 카테고리 포함 박스 레이아웃에서 해당 아이콘이 표시되도록 core에 작은 수정 사항도 추가했습니다.

2개의 좋아요
105

하위 카테고리 목록 스타일이 추천 주제 포함 상자로 설정되어 있을 때는 하위 카테고리 아이콘이 표시되지만, 상자만 선택하면 표시되지 않나요?

1개의 좋아요
106

네, 해당 수정은 코어에 포함되어 있으므로 사이트를 다시 빌드해야 합니다.

3개의 좋아요