Adding text below avatar or next to username

UX
1

I’m trying to customize the template where the avatar is shown. I’m able to overwrite many other templates, but for some reason post/poster-avatar.raw doesn’t work for me.

I tried e.g. the following code and tried to add it in “before /head” and in “header” and it simply doesn’t appear.

<script type='text/x-handlebars' data-template-name='post/poster-avatar.raw'>
  <h1>LOL</h1>
</script>

Any ideas?

I would also like to add some text to the template where the username, full name and usergroup is displayed but can’t find the correct template, could someone point me into the right direction?

2

I think that after the vdom rewrite of topics, templates don’t work anymore on that page.

2 Likes
3

Aaargh, just when I thought I understood it :wink: Thanks for the quick reply @Falco, much appreciated. I guess something new to dive into!

1 Like
4

Yes the post.hbs file is no more.

With it’s removal, 5 plugin-outlets are gone with it.

discourse/templates/post.hbs (5)
{{plugin-outlet “poster-avatar-bottom”}}
{{plugin-outlet “poster-name-right”}}
{{plugin-outlet “post-after-cooked”}}
{{plugin-outlet “topic-after-cooked”}}
{{plugin-outlet “post-bottom”}}

AFAIK (I haven’t tried yet) custom_fields and Widgets need to be used now

2 Likes
5

You can add text below avatars pretty easily, at least (no plugin outlet required). There’s an empty div poster-avatar-extra right underneath avatars, just use that with some CSS.

e.g.

.poster-avatar-extra {
    display: inherit;
}

.poster-avatar-extra:after {
     content: "LOL";
}

The first bit is because the poster-avatar-extra div has display: none by default. Just style it up with some more CSS and you’re good to go. :slight_smile:

Oh, I’ll go ahead and put this here as well. If you want to use groups to decide what text goes under the avatar (wrapping the above in .group-GroupName{}, needs to be user’s primary group to show up), you’ll want to toss this in as well (or something else to handle the issue):

.embedded-posts {
    .poster-avatar-extra:after {
        content: none !important;
    }
}

The embedded posts’ poster-avatar-extra (from the reply indicator expansion) has the same group membership as the main post, which means the text below the avatars will be applied incorrectly if you’re doing it by group. Only caveat I can think of off the top of my head, though.

3 Likes