On the mobile theme, the list of posts show's the latest replying user's avatar, not the OP's avatar


(Marc Billow) #1

I have had several people come to me very confused why their post was attributed to another user. This is because the avatar of the latest poster is used in the mobile view and nothing else (not even an author name). The author of the post is always the left most user on the desktop theme for a reason; not carrying over this important distinction is highly confusing.


(Jeff Atwood) #2

This is by design, and has been discussed in other topics.

When there is only room for one avatar in the topic list (as in mobile), the last person to talk in that topic is the correct avatar to show for the topic, otherwise a topic with 5000 replies would show the same avatar for months.


(Marc Billow) #3

I’m sorry if my original post made it sound like this was a bug. Also, I couldn’t find any of the other posts (maybe I didn’t use the right search terms) or I would have definitely posted there.

Either way, I agree that it prevents stale post listings, but there has to be a better way that reduces user confusion.

I have put together a really quick mockup that adds usernames below the post. I don’t know if this is the correct answer (admittedly it is a little bit busy) but it maintains post attribution better than the current style.


(Rafael dos Santos Silva) #4

The topic is this one:


(Charles Walter) #5

We have some custom code to show the OP avatar on the mobile view. No complaints. Feel free to check it out at www.helloforos.com

On the site homepage, it shows the category name below the post, but if you are in a category it displays the author’s name.

In a small community, I understand the idea of showing the latest reply avatar. In a large community with lots of activity, I find it’s helpful that the community see who originally wrote the topic as it is part of the decision of whether users want to enter or not. I believe it also provides better recognition to authors of quality content


(Marc Billow) #6

Custom code as in you modified the Discourse source code or it is possible to change this in the customization option provided?


(Charles Walter) #7

@mbillow, I added the code below to the mobile header. If you haven’t read this topic on customizing Discourse templates, it is a must for Discourse community admins…

<script type='text/x-handlebars' data-template-name='mobile/list/topic-list-item.raw'>
<td>
  {{~#unless content.hasExcerpt}}
  <div class='pull-left'>
    <a href="{{content.firstPostUrl}}">{{avatar content.creator imageSize="large"}}</a>
  </div>
  <div class='right'>
  {{else}}
  <div>
  {{/unless~}}
    <div class='main-link'>
      {{raw "topic-status" topic=content}}
      {{topic-link content}}
      {{#if content.unseen}}
        <span class="badge-notification new-topic"></span>
      {{/if}}
    </div>

    <div class='pull-right'>
      {{raw "list/post-count-or-badges" topic=content postBadgesEnabled=controller.showTopicPostBadges}}
    </div>

    <div class="topic-item-stats clearfix">
{{#if controller.hideCategory}}
   <div class='category'>
          <span class="author-name">por <a href="{{content.creator.path}}" data-user-card="{{content.creator.username}}">{{content.creator.username}}</a></span>
        </div>
{{else}}
        <div class='category'>
          {{category-link content.category}}
        </div>
{{/if}}

    


      <div class="pull-right">
        <div class='num activity last'>
          <span class="age activity" title="{{content.bumpedAtTitle}}"><a href="{{content.lastPostUrl}}">{{format-date content.bumpedAt format="tiny" noTitle="true"}}</a></span>
        </div>
      </div>

      <div class="clearfix"></div>
    </div>
  </div>
</td>
</script>

Help Needed: Swap/Reorder Columns in Topic Table
(Marc Billow) #8

Thanks so much for that. I have seen the posts about modifying the templates but I haven’t had the time to really dive into it.

Thanks again for your help @charleswalter!


(Ringgit Malaysia) #9

Somewhat related: in mobile, when reading a topic and someone posted a lot of text, highly possible in a forum I frequent in which enjoys a lot of writing, it would be good if the name of the writer and his avatar floats above the post as I scroll downwards. Often I find myself needing to scroll back up after reading to see who was the person writing this post. Maybe a feature request?


#10

An option to show OP avatar vs latest reply is important for a large community. In desktop view it is apparent who posted the OP from the topics page. Currently in mobile, only the user with the last reply shows up. I am currently choosing to not display avatars at all in mobile view because @charleswalter 's script no longer appears to work. Thanks.


(Joe) #11

You can use this to show the avatar of the OP in Mobile view:

<script type='text/x-handlebars' data-template-name='mobile/list/topic-list-item.raw'>
    <td>
      {{~#unless expandPinned}}
      <div class='pull-left'>
        <a href="/users/{{topic.creator.username}}">{{avatar topic.creator imageSize="large"}}</a>
      </div>
      <div class='right'>
      {{else}}
      <div>
      {{/unless~}}
        <div class='main-link'>
          {{raw "topic-status" topic=topic}}
          {{topic-link topic}}
          {{#if topic.featured_link}}
            {{topic-featured-link topic}}
          {{/if}}
          {{#if topic.unseen}}
            <span class="badge-notification new-topic"></span>
          {{/if}}
          {{~#if expandPinned}}
          {{raw "list/topic-excerpt" topic=topic}}
          {{/if~}}
        </div>
    
        <div class='pull-right'>
          {{raw "list/post-count-or-badges" topic=topic postBadgesEnabled=showTopicPostBadges}}
        </div>
    
        <div class="topic-item-stats clearfix">
          {{#unless hideCategory}}
            <div class='category'>
              {{category-link topic.category}}
            </div>
          {{/unless}}
    
          {{discourse-tags topic mode="list"}}
    
          <div class="pull-right">
            <div class='num activity last'>
              <span class="age activity" title="{{topic.bumpedAtTitle}}"><a href="{{topic.lastPostUrl}}">{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a></span>
            </div>
          </div>
    
          <div class="clearfix"></div>
        </div>
      </div>
    </td>
</script>

(Marc Billow) #12

Here is the updated version. Modifications where made to the controller since @charleswalter initially posted that. I fixed it up awhile ago and this is still working great on our instance ( v1.9.0.beta16 +74).

<script type='text/x-handlebars' data-template-name='mobile/list/topic-list-item.raw'>
<td>
  {{~#unless topic.hasExcerpt}}
  <div class='pull-left'>
    <a href="{{topic.firstPostUrl}}">{{avatar topic.creator imageSize="large"}}</a>
  </div>
  <div class='right'>
  {{else}}
  <div>
  {{/unless~}}
    <div class='main-link'>
      {{raw "topic-status" topic=topic}}
      {{topic-link topic}}
      {{#if topic.unseen}}
        <span class="badge-notification new-topic"></span>
      {{/if}}
    </div>

    <div class='pull-right'>
      {{raw "list/post-count-or-badges" topic=topic postBadgesEnabled=showTopicPostBadges}}
    </div>

    <div class="topic-item-stats clearfix">
{{#if hideCategory}}
   <div class='category'>
          <span class="author-name"><a href="{{topic.creator.path}}" data-user-card="{{topic.creator.username}}">{{topic.creator.username}}</a></span>
        </div>
{{else}}
        <div class='category'>
          {{category-link topic.category}}
        </div>
{{/if}}

    


      <div class="pull-right">
        <div class='num activity last'>
          <span class="age activity" title="{{topic.bumpedAtTitle}}"><a href="{{topic.lastPostUrl}}">{{format-date topic.bumpedAt format="tiny" noTitle="true"}}</a></span>
        </div>
      </div>

      <div class="clearfix"></div>
    </div>
  </div>
</td>
</script>

Let me know if you have any problems.


#13

Worked like a champ v2.0.0.beta3 +125. Thank you!