Post Badges

Ok, I just pushed an update that should fix the icons that weren’t working. I specifically checked it against all three of those icons and they work now. I also made the badge names case-insensitive while I was digging into the code.


Locale support will be #1 priority next time I get a chance to look at this.

5 Likes

Hmm still not showing for me I removed and re added I ended up deploying a new instance with bigger specs

1 Like

How are the icons added to your badges?

You need to prefix any fab and far icons. You can just use the name for the fas icons. The three you listed should be:

fab-linode
laptop-code
pencil-ruler
3 Likes

Ahh that’s my issue thanks man :smiley:

3 Likes

Hi Taylor,

I enjoyed your theme and used it on my forum.

I have a small problem, which is when watching on the phone, the badge is on the left of the username.

I want to transfer the badge to the right of the username. Can you help me do this?

I am very grateful for what you have contributed to the community.

3 Likes

Thanks for reporting that @Phạm_Quốc_Thiện! It should be all fixed up if you update the component.

4 Likes

This was very confusing to me, because it implies it is searching the list of site badges and not finding it. Tried a hard refresh to get it to find my new badges, etc. Glad it works, but maybe the UI can be changed to make it just a plain text box, rather than doing that non-functional search? I think that would make it less confusing to use.

Thanks for the awesome theme component.

2 Likes

Is it normal to get a “These local changes will be erased by the update. Are you sure you want to continue?” message when updating a theme component? I’m 99.9% sure I haven’t made any changes, and the git commit info looks like it is stuff related to the update, not to local changes:

diff --git a/discourse-post-badges/about.json b/discourse-post-badges/about.json
new file mode 100644
index 0000000..eb86c4b
--- /dev/null
+++ b/discourse-post-badges/about.json
@@ -0,0 +1,15 @@
+{
+  "name": "Post Badges",
+  "component": true,
+  "license_url": "https://github.com/tshenry/discourse-post-badges/blob/master/LICENSE",
+  "about_url": "https://meta.discourse.org/t/post-badges-component/114722",
+  "authors": null,
+  "theme_version": null,
+  "minimum_discourse_version": null,
+  "maximum_discourse_version": null,
+  "assets": {
+  },
+  "color_schemes": {
+  },
+  "learn_more": "https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966"
+}
\ No newline at end of file
diff --git a/common/common.scss b/discourse-post-badges/common/common.scss
similarity index 100%
rename from common/common.scss
rename to discourse-post-badges/common/common.scss
diff --git a/common/head_tag.html b/discourse-post-badges/common/head_tag.html
similarity index 100%
rename from common/head_tag.html
rename to discourse-post-badges/common/head_tag.html
diff --git a/discourse-post-badges/settings.yml b/discourse-post-badges/settings.yml
new file mode 100644
index 0000000..7e7e250
--- /dev/null
+++ b/discourse-post-badges/settings.yml
@@ -0,0 +1,21 @@
+badges:
+  type: list
+  default: ""
+  description:
+    en: 'Use the name of the badge as it appears on the
+      <a href="/admin/badges">list of badges</a>.
+      Post badges will appear in the order they are
+      added to this setting.'
+badge_link_destination:
+  type: enum
+  default: "user's badge page"
+  choices:
+    - "badge overview page"
+  description:
+    en: "Where a user will be taken when they click on a post badge."
+only_show_highest_trust_level:
+  type: bool
+  default: false
+  description:
+    en: "When including trust level badges (Basic, Member, Regular, Leader),
+      only show the highest trust level a user has earned."

Edited to add: I ran the update and it works fine. So…

The theme setting UI is common to core Discourse, so I can’t do anything to improve that setting in the component itself. It’s definitely something I’d like to see become a little more intuitive, or perhaps even have the ability to dynamically populate a searchable list at some point.

As for the local changes notice, I don’t think it should be warning you unless you have modified something using the Edit CSS/HTML button. Are you on an older version of Discourse? I believe that behavior should have been fixed in https://github.com/discourse/discourse/commit/5cf5e735361e81f5a7cad806122f6f10c28a9745 (cc @pmusaraj)

7 Likes

Yep. Older version. Thanks.

4 Likes

Thank you for your support. Now everything is perfect.

:smiling_face_with_three_hearts::smiling_face_with_three_hearts:

3 Likes

We’re using the new portfolio feature of the Topic List Preview plugin, and I hacked the Topic Badge code to have a portfolio icon link to the user’s profile instead of to the badge page:

        if(badge.url) {
            // override Bart
            if(badge.name == 'portfolio' ) {
                username = badge.url.substring(badge.url.lastIndexOf('=') + 1);
                user_portfolio_url = '/u/' + username + '/activity/portfolio';
                iconBody = dec.h("a", { attributes: { href: user_portfolio_url } }, iconBody);
            } else {
              iconBody = dec.h("a", { attributes: { href: badge.url } }, iconBody);
            }
            // end override Bart
        }

I realise this code will be lost when the component is updated, so I wonder if there’s a better way to do this? Can I override the buildBadge function somehow, for example?

Background information: we only want to show this icon for users who actually HAVE a portfolio, meaning they have created at least one topic in our Artwork category. This is easily done using a badge query, and since we’re already using the Post Badges component on our site this seemed a reasonable approach.

4 Likes

Can you add in a separate area so titles/names still work?

image

What exactly doesn’t work currently?

On my desktop and phone I still see username, name, title and badges.

2 Likes

oh good, I just checked the theme creator site and it appeared that wasn’t the case,

carry on my good man and merry Christmas!

1 Like

Ok, I’m bumbling a bit, I tried a couple and had to hit create, they didn’t appear during search

Leader does appear after that but not the locomotive breath,

image

Am I just suffering from doesn’t read enough syndrome?

also, Can they be removed from an individual that doesnt want them displayed?

and,

this one shows the url

the other shows the title

image

With the particular problem of searching for badges not working, yes. That is a known problem with the UI that i mentioned up Just a few posts.

2 Likes

I need a badge for it :pensive:

2 Likes

I noticed that trust level badges show a URL. Could be because of this.

A badge that just has a description will display OK.

2 Likes

@bartv, I’d definitely like to do an improvement/refactor pass on this component in the not too distant future. I’ll see what I can do about restructuring things in a way that will allow you to handle overrides in a separate theme component. I’m not sure when I’ll get around to looking at this, but I’ll be sure to update this topic when there’s news.


Not at this point, but I’ll keep it in mind next time I’m working on the component.


Correct, see:

When I work on updating this component, I’ll see if I can come up with a more graceful solution for this.

7 Likes