https://www.reddit.com/r/csshelp/comments/m59kf/user_flair_tutorial_7_easy_steps_to_enable/
created by adremeaux on 08/11/2011 at 21:32 UTC*
36 upvotes, 15 top-level comments (showing 15)
[removed]
Comment by [deleted] at 08/11/2011 at 23:43 UTC
2 upvotes, 1 direct replies
thank you! Ill impliment this asap to my subreddit, thanks again.
Comment by bLizTIc at 29/02/2012 at 15:25 UTC
2 upvotes, 1 direct replies
When I upload is it supposed to popup another tab or window showing me the link? Because I know in the CSS code where it says "background: url(%%spritesheet%%)" that I am supposed to put the url in between the parentheses but it just says uploading in red when I click the button and I never get anything else...
Comment by MeGustaTortugas at 04/05/2012 at 18:11 UTC
2 upvotes, 1 direct replies
So I want to have user selected CUSTOM text but I want MOD assigned images? This seems odd, can't seem to get both, I can either have me select it, or have the users select it.
In one situation, they assign the text, then I can add the right image, if needed, but if they change the text again, the image goes away since it is no longer in the template that has the right image.
Comment by MendelssohnSansHats at 15/11/2011 at 02:27 UTC
1 upvotes, 1 direct replies
Thanks for the tutorial! As someone who knows absolutely zero CSS, I managed to get it right first try with your easy to follow instructions (:
Comment by lukemcr at 27/11/2011 at 22:31 UTC
1 upvotes, 1 direct replies
This sprite generator also worked well for me:
http://spritegen.website-performance.org/
Comment by AlienJ at 09/12/2011 at 13:26 UTC
1 upvotes, 0 direct replies
very well done! i know nothing of css, but i am able to follow instructions. i need to fix my images, but i used this on r/Solidworks
Comment by tensaibaka at 16/12/2011 at 08:14 UTC
1 upvotes, 0 direct replies
Thanks to your help, and the help of gavin19[1], I was able to set up 135 different images with hover text showing the team names over in r/japansports[2]! Thanks!
1: http://www.reddit.com/user/gavin19
2: http://www.reddit.com/r/japansports/
Comment by [deleted] at 21/12/2011 at 23:12 UTC
1 upvotes, 1 direct replies
I think I may have screwed up somewhere.
I'm unclear about the saving the image output, does that mean download it?
Comment by TexanAtheist at 28/12/2011 at 21:00 UTC*
1 upvotes, 0 direct replies
How can I regulate the flair, making them all the same height?
Comment by AllWrong74 at 12/01/2012 at 13:30 UTC
1 upvotes, 1 direct replies
What about when I don't want sprites? My subreddit is about a series of books. There are different kinds of magic, and I want to enable the users to select any of the warrens (the name of magic in the series) to show up as text next to their name.
Anyway, when I just want it to be text, what changes, here?
And thanks for the tutorial!
Comment by WolfandAngel at 01/05/2012 at 14:00 UTC
1 upvotes, 1 direct replies
Not sure I did it right gives me a 502 error( http://d.thumbs.redditmedia.com/gYyUcBBD9C7bDQj3.png[1]):
1: http://d.thumbs.redditmedia.com/gYyUcBBD9C7bDQj3.png
.flairselector .customizer { display: none !important; }
.flair { border: none !important; top:20px; padding:0px; background: url(%%spritesheet%%); display:inline-block; }
.flair-Elementalist{ background-position: 0 0; width: 45px; height: 45px; } .flair-Engineer{ background-position: 0 -95px; width: 45px; height: 45px; } .flair-Guardian{ background-position: 0 -190px; width: 45px; height: 45px; } .flair-Mesmer{ background-position: 0 -285px; width: 45px; height: 45px; } .flair-Necromancer{ background-position: 0 -380px; width: 45px; height: 45px; } .flair-Ranger{ background-position: 0 -475px; width: 45px; height: 45px; } .flair-Thief{ background-position: 0 -570px; width: 45px; height: 45px; } .flair-Warrior{ background-position: 0 -665px; width: 45px; height: 45px; } .flair-guild{ background-position: 0 -760px; width: 45px; height: 45px; }
Comment by [deleted] at 02/05/2012 at 14:55 UTC*
1 upvotes, 1 direct replies
Hi there, I am a mod over at /r/theclutch and we have a tournament coming up and I thought it would be cool if I could use images like these 1st place[1] 2nd place[2] 3rd place[3] to show the winners. I really like the flair style on /r/jrpg.
1: http://www.fasttrackracingteam.com/Trophy-Case/IMAGES/1st_Place.gif
2: http://www.fasttrackracingteam.com/Trophy-Case/IMAGES/2nd_Place.gif
3: http://www.fasttrackracingteam.com/Trophy-Case/IMAGES/3rd_Place.gif
My question to you is how can I control who has the image in there flair. (So nobody can assign themselves 1st place)
Comment by killerDLS at 03/05/2012 at 03:02 UTC
1 upvotes, 1 direct replies
Thanks, I did this and it worked. But how do i add another spritesheet in? I want more flairs.
Comment by MeGustaTortugas at 03/05/2012 at 16:02 UTC
1 upvotes, 2 direct replies
5 month old post, but worth a try:
I'm trying to implement flair like the r/jrpg but with Flair text as well. /r/NAE3TestingGround is where I'm testing, you can see that it's got the image up, but the text flair is also on the left, this causes an issue. We want to have fancy logos that come from the game we play, but we also need to have our Gamertag listed.
Any help?
Comment by MeGustaTortugas at 04/05/2012 at 18:26 UTC
1 upvotes, 1 direct replies
What about adding a tool tip when you highlight an image so people know what it is?