# 주제 목록 미리보기 (TLP)

**URL:** https://meta.discourse.org/t/topic-list-previews-tlp/209973
**Category:** Theme component
**Created:** [11월 23, 2021, 12:25오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973 "2021-11-23T12:25:59Z")
**Posts on this page:** 20
**Page:** 8

<div class="post-metadata">

### Author: ![keith1](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/keith1/32/178982_2.png) [@keith1](https://meta.discourse.org/u/keith1)
#### Post date: [6월 16, 2022, 2:21오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/142 "2022-06-16T14:21:05Z")

</div>

불행히도, 새 브라우저나 시크릿 모드에서도 여전히 존재합니다.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [6월 16, 2022, 2:38오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/143 "2022-06-16T14:38:45Z")

</div>

감사합니다. 재현했습니다. 나중에 수정해서 되돌려 올리겠습니다. 피드백 감사합니다.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [6월 25, 2022, 9:48오전 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/144 "2022-06-25T09:48:10Z")

</div>

## 중요: 테마 컴포넌트 및 사이드카 플러그인의 이름 변경 및 이동.

사이드카 플러그인을 다음 위치로 이동했습니다:

[사이드카 플러그인이 이제 Pavilion GitHub 조직으로 복귀](https://github.com/paviliondev/discourse-topic-previews-sidecar): `https://github.com/paviliondev/discourse-topic-previews-sidecar`

기존 TC(테마 컴포넌트)에 다음 기능이 추가됨을 다시 한번 알려드립니다:

- ‘actions’ (토픽 목록에서 북마크 및 좋아요)
- 토픽 메타 에디터의 썸네일 선택기
- 발췌문의 링크를 선택적으로 숨겨서 훨씬 더 보기 좋게 표시

올바른 코드는 이제 master 브랜치에 있습니다. **이름 변경에 유의하세요**

이 **테마 컴포넌트** 는 이제 다음 위치로 이동했습니다: [paviliondev/discourse-tc-topic-list-previews: 토픽 목록의 콘텐츠와 레이아웃을 풍부하게 만듭니다 (github.com)](https://github.com/paviliondev/discourse-tc-topic-list-previews): `https://github.com/paviliondev/discourse-tc-topic-list-previews`

**이동과 함께 이름도 변경되었음을 다시 한번 강조합니다!!**

설정 이름이 변경되지 않았으므로 플러그인 백엔드는 설정을 유지해야 합니다. 프론트엔드 TC도 마찬가지입니다: TC 프론트엔드를 재설치하거나 변경할 필요가 없어야 합니다. GitHub가 자동으로 리다이렉트할 것입니다.

이 TC로 이동하는 프로젝트는 실험적인 사이드 프로젝트로 시작했지만 결국 원래의 pavilion 코드를 대체(deprecated)하게 되어, 제가 이를 교체했습니다.

더 이상 원래 위치에서 이들을 유지보수하지 않을 것입니다. GitHub가 브랜치 이동을 제외하고 변경 사항을 매핑해 줄 수 있으므로, 적어도 `-b` 옵션은 제거하세요.

@Canapin

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [6월 25, 2022, 9:56오전 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/145 "2022-06-25T09:56:31Z")

</div>

북마크 API의 [핵심 브레이킹 체인지](https://github.com/discourse/discourse/commit/fcc2e7ebbf3fa5f17c24c70149a949850f29a5f3)에 대한 호환성을 추가했습니다:

> <https://github.com/merefield/discourse-tc-topic-list-previews/pull/19>

[https://github.com/paviliondev/discourse-topic-previews-sidecar/commit/56291299430b8c12fced5cb62c346e45cec08ad2](https://github.com/paviliondev/discourse-topic-previews-sidecar/commit/56291299430b8c12fced5cb62c346e45cec08ad2)

이제 토픽 목록에서 다시 북마크를 추가할 수 있습니다(사이드카 플러그인 필요).

또한 @Canapin의 변경 사항을 병합하여, 발췌문에 링크 텍스트 내용을 선택적으로 포함하는 동시에 긴 링크가 발췌문을 손상시키지 않도록 했습니다:

> <https://github.com/merefield/discourse-tc-topic-list-previews/pull/18>
>
> Prevent long words from the excerpt from bleeding outside their container or str…etching the table.
> \`word-break: break-word\` is already used in tiles display, but not in list display.

[https://github.com/merefield/discourse-topic-previews/pull/2](https://github.com/merefield/discourse-topic-previews/pull/2)

@Canapin 감사합니다!

---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [6월 25, 2022, 4:58오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/146 "2022-06-25T16:58:56Z")

</div>

“NB the name change”라는 표현은 무슨 뜻인가요?  
내 설정을 유지하면서 새로운 저장소 URL을 어떻게 사용하나요?

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [6월 25, 2022, 5:08오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/147 "2022-06-25T17:08:04Z")

</div>

해당 주제에 대해 더 명확하도록 게시물을 업데이트했습니다.

---

<div class="post-metadata">

### Author: ![ipoopfool](https://avatars.discourse-cdn.com/v4/letter/i/d78d45/32.png) [@ipoopfool](https://meta.discourse.org/u/ipoopfool)
#### Post date: [7월 1, 2022, 6:36오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/148 "2022-07-01T18:36:52Z")

</div>

“데스크톱 카테고리 페이지 스타일” 설정에서 썸네일을 표시할 수 있는 방법이 있을까요? 홈이나 카테고리 페이지에서는 최신 게시물이나 인기 게시물을 표시할 수 있지만, 썸네일이 없습니다.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [7월 1, 2022, 6:40오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/149 "2022-07-01T18:40:23Z")

</div>

최근 @Canapin이 나에게 이렇게 질문했습니다: [Topic List Previews (TLP) - #104 by Canapin](https://meta.discourse.org/t/topic-list-previews-theme-component/209973/104?u=merefield)

제 답변을 확인하실 수 있습니다. 현재는 지원되지 않습니다.

---

<div class="post-metadata">

### Author: ![Stephane\_Roy](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stephane_roy/32/222598_2.png) [@Stephane\_Roy](https://meta.discourse.org/u/Stephane_Roy)
#### Post date: [7월 7, 2022, 2:50오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/150 "2022-07-07T14:50:18Z")

</div>

Graceful 테마를 기본 테마(단, Graceful 색상 스킴 적용)로 변경했습니다.

렌더링이 좋습니다.

 ![image](https://global.discourse-cdn.com/meta/original/4X/8/3/2/8324746fec23a26d9b96731f5df12fea6ba1e94a.jpeg)

빠른 도움 주셔서 감사합니다.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [7월 7, 2022, 2:52오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/151 "2022-07-07T14:52:10Z")

</div>

아, 그 부분은 빠져 있었군요 👍

네, 많은 테마 개발자들이 TLP 기준으로 테스트를 하지 않는다고 생각됩니다. 구매자는 스스로 알아서 해야 합니다. 호환성을 항상 보장할 수는 없으니까요.

---

<div class="post-metadata">

### Author: ![thaidb](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/thaidb/32/68488_2.png) [@thaidb](https://meta.discourse.org/u/thaidb)
#### Post date: [7월 10, 2022, 9:32오전 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/152 "2022-07-10T09:32:37Z")

</div>

안녕하세요,  
모바일에서 효과를 비활성화하는 방법이 있을까요? “topic list thumbnails topic lists” 설정에 lasted-mobile을 입력하지 않았는데도 불구하고 모바일 인터페이스에서 섬네일이 여전히 표시되고 있습니다.

 ![image](https://global.discourse-cdn.com/meta/original/4X/b/3/f/b3f7c7d58677ca5ce5e153b4996a7723cc852599.jpeg)

동시에 MD Topic List Mobile 컴포넌트를 사용하고 있습니다.  
감사합니다!

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [7월 10, 2022, 10:33오전 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/153 "2022-07-10T10:33:41Z")

</div>

두 개의 주제 목록 테마 구성 요소를 동시에 사용하는 것이 항상 안전하지는 않습니다.

다른 구성 요소와의 호환성을 보장하지 않습니다. 함께 작동한다면 좋겠지만요.

다른 구성 요소를 비활성화하면 문제가 해결됩니까?

설정을 변경한 경우 페이지를 새로고침하는 것을 잊지 마세요.

---

<div class="post-metadata">

### Author: ![MattiaB](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mattiab/32/262975_2.png) [@MattiaB](https://meta.discourse.org/u/MattiaB)
#### Post date: [7월 10, 2022, 6:43오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/154 "2022-07-10T18:43:49Z")

</div>

로버트님, 이 컴포넌트 감사합니다. 특정 카테고리에서만 활성화했는데, 모바일에서 이상한 문제가 보입니다:

컴포넌트 비활성화 상태:

 ![image](https://global.discourse-cdn.com/meta/original/4X/1/9/7/1973389b4434b996353643b6223bbc59c24b3bb1.jpeg)

컴포넌트 활성화 상태:

 ![image](https://global.discourse-cdn.com/meta/original/4X/3/a/a/3aa1d0c97b23106912b7a79a12e33188b752126a.jpeg)

아바타와 스레드 이름 사이에 왜 이상한 여백이 생기는 건가요?  
말씀드린 것처럼 해당 카테고리에는 컴포넌트와 관련된 기능이 아무것도 활성화되어 있지 않습니다.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [7월 10, 2022, 7:19오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/155 "2022-07-10T19:19:32Z")

</div>

그 공간은 보통 아바타보다 가로 폭이 넓은 섬네일(미리보기 이미지)을 표시하기 위해 사용되므로, 모바일에서 섬네일 표시를 활성화하고 원포스터(OP)가 사진을 첨부한 경우 해당 사진을 확인할 수 있습니다.

섬네일이 있든 없든 발췌문에 일관된 세로 경계를 유지하여, 토픽 목록을 아래로 스크롤하며 볼 때 눈이 어지럽지 않도록 하자는 것이 아이디어였습니다.

이 주제가 매우 적절하네요. 커뮤니티 멤버와 이 문제를 어떻게 처리할 수 있을지 논의하고 있었거든요 …

---

<div class="post-metadata">

### Author: ![MattiaB](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mattiab/32/262975_2.png) [@MattiaB](https://meta.discourse.org/u/MattiaB)
#### Post date: [7월 10, 2022, 7:40오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/156 "2022-07-10T19:40:25Z")

</div>

음, 알겠습니다. 하지만 저는 특정 카테고리 하나에만 썸네일과 발췌문을 사용하고 있고, 주제 목록에는 사용하지도 않습니다. 이 여백을 비활성화하는 방법이 있을까요? CSS를 사용하는 것도 괜찮고요. 감사합니다.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [7월 10, 2022, 7:43오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/157 "2022-07-10T19:43:14Z")

</div>

브라우저 인스펙터를 활용해 직접 확인해 보시는 건 어떨까요? 맞춤 설치를 지원할 여유가 없습니다.

다만, 이 기능이 조정될 경우 이 점을 염두에 두겠습니다. 특정 뷰에 썸네일이 지정되지 않은 경우, 여백을 덜 사용해야 합니다.

---

<div class="post-metadata">

### Author: ![MattiaB](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mattiab/32/262975_2.png) [@MattiaB](https://meta.discourse.org/u/MattiaB)
#### Post date: [7월 10, 2022, 8:26오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/158 "2022-07-10T20:26:13Z")

</div>

여러 번 시도해 본 끝에 수정할 CSS를 찾았습니다.  
CSS Mobile에 아래 코드를 추가하면 마진이 95px에서 55px로 줄어듭니다.

```plaintext
.mobile-view .topic-list .right {
    margin-left: 55px;
}

```

---

<div class="post-metadata">

### Author: ![MattiaB](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mattiab/32/262975_2.png) [@MattiaB](https://meta.discourse.org/u/MattiaB)
#### Post date: [7월 10, 2022, 8:33오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/159 "2022-07-10T20:33:06Z")

</div>

다시 한번 죄송하지만, 해당 구성 요소가 활성화된 상태에서 브라우저 콘솔에 이 오류가 표시되는 것을 확인했습니다:

```plaintext
XHRGET https://radixtalk.com/tag/.json
[HTTP/1.1 404 Not Found 0ms]

Uncaught Error: Not Found
    Ember 3
    trigger rsvp.js:197
    _onError rsvp.js:1030
    invoke backburner.js:351
    flush backburner.js:241
    flush backburner.js:447
    _end backburner.js:1001
    end backburner.js:731
    _run backburner.js:1056
    run backburner.js:775
    u Ember
    error ajax.js:149
    jQuery 6
    g ajax.js:175
    x rsvp.js:522
    x rsvp.js:1023
    m ajax.js:188
    n topic-list.js:31
    getAndRemove preload-store.js:32
    x rsvp.js:522
    x rsvp.js:1023
    getAndRemove preload-store.js:31
    find topic-list.js:39
    findFiltered store.js:98
    setFeaturedTopics aa9f823743044249955a7b22e35bc2f20fa52fcc.js:915
    _findCategoriesAndTopics aa9f823743044249955a7b22e35bc2f20fa52fcc.js:938
    b rsvp.js:495
    g rsvp.js:478
    invoke backburner.js:353
    flush backburner.js:241
    flush backburner.js:447
    _end backburner.js:1001
    _boundAutorunEnd backburner.js:650
    promise callback*n/< backburner.js:28
    a Ember
    _scheduleAutorun backburner.js:1220
    _ensureInstance backburner.js:1208
    schedule backburner.js:807
    Ember 6
    <anonymous> start-app.js:4
    <anonymous> discourse-boot.js:31
    <anonymous> discourse-boot.js:32

```

이 404 오류를 유발하는 구성 요소 설정이 있을까요?

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [7월 10, 2022, 8:38오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/160 "2022-07-10T20:38:11Z")

</div>

무료 지원 기간이 종료되었지만, 다음 지원 단계에서 해당 문제를 확인해 드릴 수 있습니다.

그동안 해당 문제를 재현할 수 없는데, 대표 이미지 기능이 활성화되어 있나요?

---

<div class="post-metadata">

### Author: ![MattiaB](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mattiab/32/262975_2.png) [@MattiaB](https://meta.discourse.org/u/MattiaB)
#### Post date: [7월 10, 2022, 8:44오후 UTC](https://meta.discourse.org/t/topic-list-previews-tlp/209973/161 "2022-07-10T20:44:07Z")

</div>

그렇지 않은 것 같습니다. 제 설정은 다음과 같습니다:

 ![image](https://global.discourse-cdn.com/meta/original/4X/2/b/1/2b14acf2ebab58f48c7435a6ad281d578bea2851.png)  
 ![image](https://global.discourse-cdn.com/meta/original/4X/3/f/a/3fa69528673b37680923a3b4e817d5688a3fb8bb.png)  
 ![image](https://global.discourse-cdn.com/meta/original/4X/3/5/a/35a01db8c102ff8b49d9b4dc8ddfc887aa75bf29.png)

나머지는 모두 기본 설정입니다.

> 무료 지원 기간이 종료되었지만, 다음 지원 단계에서 나중에 확인해 드릴 수 있습니다.

감사합니다, 서두를 필요 없습니다! 중요한 버그가 아니거든요.

[이전 페이지](https://meta.discourse.org/t/topic-list-previews-tlp/209973.md?page=7)

[다음 페이지](https://meta.discourse.org/t/topic-list-previews-tlp/209973.md?page=9)
