Fun with flairs

Community
1

I run an international forum and thought it might be interesting/helpful if users could choose a flair that’s the flag for their country.

I can’t see a way to implement this other than creating groups for each country and getting people to join the appropriate one. It’s a non-technical forum and groups haven’t really registered with most of them so it probably wouldn’t work too well in practice. They would expect a way to do this in their user profile.

I’d also like to have the flair top-left, not bottom right, and I can’t see any way to do that other than with the Trust Level Avatar Flair theme component, which isn’t really what I’m looking for.

Would this require a new theme component to achieve, or some other solution?

1 Like
2

the user status setting can do something like this, but of course that isn’t its function.
i suspect the component could be altered for a flag status component. see my status for an example. not quite the same as a flair though.

1 Like
3

Have you seen

9 Likes
4

:point_up_2:t2: that. was just searching for that plug-in.

4 Likes
5

Aha! I spent ages searching for all sorts of variants on ‘flair’ but not ‘flags’. I’ll take a look at that later. Thank you!

2 Likes
6

Without any additional plugins (:arrow_up: that one is from 5 years ago), users can now :arrow_down: update their status (since last October):

Flag / Nationality emoji in a Custom User Status
Flag / Nationality emoji in a Custom User Status517×569 42.6 KB

5 Likes
7

Ah, I think I may have led myself up the garden path a little. :slightly_smiling_face: Is there any method to display flairs in a location other than bottom-right? That custom status is akin to an ‘away’ message you might put on IM. My use case is slightly different.

8

in common-css, use this and adjust the bottom/top and left/right properties number for fine positioning. for example this is the code if you want the flair in top right instead.

.latest-topic-list-item .topic-poster .avatar-flair {
    position: absolute;
    top: 0px;
    right: 10px;
}

while this is the default bottom right:

.latest-topic-list-item .topic-poster .avatar-flair {
    position: absolute;
    bottom: 0;
    right: 10px;
}

bottom left:

.latest-topic-list-item .topic-poster .avatar-flair {
    position: absolute;
    bottom: 0;
    left: 0px;
}

top left:

.latest-topic-list-item .topic-poster .avatar-flair {
    position: absolute;
    top: 0;
    left: 0;
}

Also, the display nationality plugin flags that Falco linked above aren’t going to be flairs.

2 Likes
9

yea that’s exactly what i pointed out in my first reply.