Wie man OP-Avatar in der neuesten Spalte der Kategorie anzeigt

I want to display OP avatar in latest column of the category.
Here


I had read some docs about how2create a component and tried to do it by imitating Mobile OP avatars.

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

Thanks for your help.:heart:

1 „Gefällt mir“

I’m commenting on this because I want this tooooo!!! It’s been driving me nuts that I can’t make this change…

You can try this CSS:

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

You can target other columns and set their order as well as long as they have display: flex; (if you want for example put the avatar between the last activity and the topic’s name).

3 „Gefällt mir“

@Canapin It moved the avatar images to the right, but is still displaying the avatar of the most recent poster, as oppose to the original poster…

There is a theme-component that shows Topic Author instead of the most recent poster.

2 „Gefällt mir“

Sorry, I misunderstood What you were asking for.

1 „Gefällt mir“

If you only want to change that in the Category page and don’t want the other changes that the Discourse Topic Author will make you can override the components/latest-topic-list-item

With something like below in your theme:

<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>

But you will be overriding a template so if it ever gets changed in the core, it is up to you to keep it updated.

4 „Gefällt mir“

@Moin @saquetim Thank you!!