Summary | Add badge to topic owner’s posts. | |
Repository | https://github.com/VaperinaDEV/author-badge-for-topic-posts | |
Install Guide | How to install a theme or theme component | |
New to Discourse Themes? | Beginner’s guide to using Discourse Themes |
Install this theme component
Hello
With this theme component you can add badge label to the topic owner’s posts. It is really useful on larger topics because you can see clearly who is the Original Poster.
Filter
The structure of the component, it is possible to target the mobile and desktop views separately. In addition, it is possible to target each category separately and thereby customize which author badges appear in which categories and views.
It can be possible with a theme setting:
You have to add 3 parameters to make workable the component.
-
view-type
- desktop
- mobile
-
category-name
- this is the category, what you want to target e.g. “support”
-
author-label
- the badge label e.g. “Author”
Example:
Since there is usually less space in these places on mobile sometimes it’s great to add shorter version on mobile.
Now I set up an author badge to the discourse category which on desktop will shows the “Author” text and on mobile the “OP” text.
Ok, but what if I want to use different text in the other categories? Do they have to be set separately for each? Of course not.
If you leave empty it view-type
or category-name
or both…it will apply globally without override the existing ones.
Example:
I’ve added 2 more badges which uses the “Original Poster” text to the other categories on desktop and use “Director” text in videos category on both desktop and mobile view.
For this, just simply leave empty these sections with
typing semicolon without space
An other example if you want to use only the e.g. “Author” for all categories and and all view types. Use the following:
Two semicolon (without spaces) and Author
;;Author
Places
Let’s see which places you can add badges…
You can select from 3-3 places in theme settings separately for desktop and mobile view.
These two settings
Desktop
author badge location desktop
- below-user-avatar
- after-user-names
- below-user-names
below-user-avatar (limited space: it uses the topic avatar width) (sticky) better to chose a shorter label
after-user-names
below-user-names
Mobile
author badge location mobile
- below-user-avatar
- after-user-names
- above-user
below-user-avatar (limited space: it uses the topic avatar width) better to chose a shorter label
after-user-names (limited space) better to chose a shorter label
above-user
Customization
Finally let’s see some customization options.
Here you can customize the author badge like colors, font styles, corners…
For example:
This one uses the following values.
These color variables may not use the same colors on your site, it depends the color scheme you have.
It’s up to you what kind of cool author badge you make.