Photo by Luciana Lambert from Pexels
If you're ready to dig into custom badges (and automatically awarded badge presets) for your Forem, Community Success are right here with you.
Video
A few months back, I channeled my inner riot grrrl and recorded a short tutorial for badge making, but... Let's just say that one of the things I love most about Forem is that it remains a constant work in progress, and so a few months later that tutorial is already outdated. Here's a newer version with way more words:
click the image above to play the video
Step-by-step
Whilst we always recommend consulting the Forem Admin Docs for the latest information, this post will run you through the key steps as they are at the time of pubishing.
-
Navigate to
your-forem-url/admin/content_manager/badgesor click your way there through the Admin Portal: -
You'll see a list of your current badges:
-
Click on Create Badge to open form with the following fields:
Title: name of badge (a badge's link is auto-generated based on the title, e.g. the title Slug of Badge would generate the link /badges/slug-of-badge)
Description: the description that appears when a user is awarded the badge
Badge Image: upload an image of your badge
Credits Awarded: number of credits awarded to a user after they were awarded the badge -
Go ahead and fill out your fields:
-
Click Create Badge to confirm your choices and view your new badge in the list:
Congratulations! You have a new badge!
Remember to keep an eye on the Forem Admin Docs pages for the latest instructions.
Top comments (8)
Another awesome tutorial! Thank you very much for creating this @ellativity
In this comment @michaeltharrington explained how Top Post by Tag Badges work. He mentioned that these are based on a weekly time frame. Is this customizable? The admin docs say: various badges are awarded for the author with the most popular article in a specific tag.
Few more questions:
Wondering about the best size/dimensions for badges. I'm not sure if there are any specific recommendations?
Is there a link where we can see a full list of all the dev.to badges that are available?
If we dont plan to use the marketplace/credit system, can we leave Credits Awarded field empty?
I answered my own question about the link of all dev.to badges 🥳 It's here: dev.to/badges/
It's on your own Forem, too, @ildi !
You can see the badge I added in the video on forem.dev/badges
I would love to know how to set all these up to be issued automatically, simple stuff first like getting a badge for your first comment and your first article.
As it stands now @lee , only the following badges can be issued automagically on your Forem:
This helpful thread from Michael and Dan details some of the logic of badges, and if the video skims over the instructions too quickly, more info on creating automatically-awarded badges can be found in the Forem Admin Docs.
'automagically' 😇
🪄
I should have added that I would 100% welcome a Feature Request for customizable badges, if anyone wants to bite 😉