Tris20
(Tristan)
May 17, 2024, 10:00am
1
I’m trying to add the free, solid, beer icon as my discourse reactions like icon:
Unfortunately the far- prefix is added to the “beer” text
and the regular icon is not included in the free tier:
so the icon does not load:
If this is intended, is there a workaround for this?
1 Like
Firepup650
(Firepup Sixfifty)
May 17, 2024, 10:45am
2
By wild chance, does fas-beer as the icon name work?
The icon works if you can’t like it anymore, but not when you can.
Looking at the code, when you liked already:
https://github.com/discourse/discourse-reactions/blob/main/assets/javascripts/discourse/widgets/discourse-reactions-reaction-button.js#L107-L115
When you did not like yet:
https://github.com/discourse/discourse-reactions/blob/main/assets/javascripts/discourse/widgets/discourse-reactions-reaction-button.js#L130-L136
It expects a far— version, which doesn’t seem to exist for beer.
A quick solution in your case is to use the API to replace the far-beer, for example:
<script type="text/discourse-plugin" version="0.8">
api.replaceIcon("far-beer", "beer");
</script>
I don’t know if a new setting should be introduced here or add some logic to use the same non-far version if the far-version doesn’t exist.
5 Likes
Tris20
(Tristan)
May 21, 2024, 9:53am
4
Sadly not, it’s empty just like above.
Arkshine:
A quick solution in your case is to use the API to replace the far-beer, for example:
<script type="text/discourse-plugin" version="0.8">
api.replaceIcon("far-beer", "beer");
</script>
Thanks for taking a detailed look at this. Using the html above is definitely a good workaround for the forseeable future. We did this originally to replace the heart, but it completely slipped my mind that it could be used again to replace the far-beer too.
2 Likes
Moin
March 26, 2026, 10:06am
6
I think this was fixed in
main ← feature/icon-picker-ss
merged 12:57AM - 24 Mar 26 UTC
This new setting type will use an IconPicker component
instead of requiring the… admin to type in a FontAwesome icon name. This
will make it easier for admins to select icons and reduce errors from
typos.
The `discourse_reactions_like_icon` setting in reactions will be
the first to use this.
<img width="911" height="411" alt="image" src="https://github.com/user-attachments/assets/2bbadfe6-8318-4e09-b05e-00de6b7e266f" />
There is now a check if there is a regular icon with a fallback to the solid version
return icon;
}
get unlikedIcon() {
const icon = this.siteSettings.discourse_reactions_like_icon;
// Map "heart" to the d-unliked alias to follow core replacement pattern
if (icon === "heart") {
return "d-unliked";
}
// Not all icons have a far- version, so we need to check if it exists.
if (isExistingIconId(`far-${icon}`)) {
return `far-${icon}`;
}
return icon;
}
get title() {
if (!this.currentUser) {
return i18n("discourse_reactions.main_reaction.unauthenticated");
1 Like