카테고리의 최신 게시물 열에 OP 아바타 표시하는 방법

지원
1

카테고리의 최신 게시물 열에 OP(원글 작성자)의 아바타를 표시하고 싶습니다.
여기서

图片
图片2526×1378 327 KB

컴포넌트 생성 방법에 대한 문서를 몇 가지 읽어보고, 모바일 OP 아바타를 참고해 시도해 보았습니다.

https://github.com/scvoet/discourse-desktop-op-avatars

도와주셔서 감사합니다.:heart:

2

이걸 너무너무 갖고 싶어서 댓글 남깁니다! 이 변경을 할 수 없다는 게 정말 스트레스입니다…

3

다음 CSS를 시도해 볼 수 있습니다:

.latest-topic-list-item .topic-poster {
    order: 3;
    text-align: right;
}

image
image1134×899 83.8 KB

display: flex;가 적용된 다른 컬럼을 대상으로 order를 설정할 수도 있습니다(예: 아바타를 마지막 활동과 토픽 이름 사이에 배치하고 싶은 경우).

4

@Canapin 아바타 이미지를 오른쪽으로 이동시켰지만, 원래 게시자가 아닌 가장 최근 게시자의 아바타가 여전히 표시되고 있습니다…

Screen Shot 2022-01-25 at 1.45.56 PM
Screen Shot 2022-01-25 at 1.45.56 PM2412×1326 302 KB

5

최근 게시자가 아닌 Topic Author 을 표시하는 Customization > Theme component 가 있습니다.

7

죄송합니다. 요청하신 내용을 잘못 이해했습니다.

8

카테고리 페이지에서만 해당 사항을 변경하고, Discourse Topic Author 플러그인이 적용하는 다른 변경 사항들은 원치 않는 경우, components/latest-topic-list-item을 오버라이드할 수 있습니다.

https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/templates/components/latest-topic-list-item.hbs

테마에 아래와 같은 코드를 추가하면 됩니다:

<script type="text/x-handlebars" data-template-name="components/latest-topic-list-item">
    {{plugin-outlet name="above-latest-topic-list-item" connectorTagName="div"}}
    <div class="main-link">
      <div class="top-row">
        {{raw "topic-status" topic=topic}}
        {{topic-link topic}}
        {{#if topic.featured_link}}
          {{topic-featured-link topic}}
        {{/if}}
        {{topic-post-badges unreadPosts=topic.unread_posts unseen=topic.unseen url=topic.lastUnreadUrl}}
      </div>
      <div class="bottom-row">
        {{category-link topic.category}}{{discourse-tags topic mode="list"}}{{! intentionally inline to avoid whitespace}}
      </div>
    </div>
    <div class="topic-stats">
      {{raw "list/posts-count-column" topic=topic tagName="div"}}
      <div class="topic-last-activity">
        <a href={{topic.lastPostUrl}} title={{topic.bumpedAtTitle}}>{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a>
      </div>
    </div>
    <div class="topic-creator">
      {{#user-link user=topic.creator}}
        {{avatar topic.creator imageSize="large"}}
      {{/user-link}}
      {{user-avatar-flair user=topic.creator}}
    </div>
</script>

다만 템플릿을 오버라이드하는 것이므로, 코어에서 해당 템플릿이 변경될 경우 업데이트를 유지하는 것은 사용자 책임입니다.

9

@Moin @saquetim 감사합니다!!