• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.
  • This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Professional Clean User Ranks (and PSD)

Jonathan

Active member
#1
Professional clean user ranks.

Ranks:

--special--
Administraor
Affiliate
Banned
Beta Tester
Team Leader
Community Team
Podcaster
Restricted
Unverified
VIP

--member--
New Member
Member
Senior Member
Great Member
Elite Member
King Member
Uber Member
No life Member

example:
administrator.png

affiliate.png

PSD and all ranks attached, PSD very easily editable
 

Attachments

Vincent

Well-known member
#7
Would you mind making a 'Global Mod.' and 'Moderator' instead of the 'Team Leader' and 'Community Member', that would complete the package :D
 

Brogan

XenForo moderator
Staff member
#8
I've seen quite a few of these user rank icons popping up.

Can I just ask where they're intended to be used?
Are people going to be editing the postbit template to add them in?

If so, wouldn't it make more sense to make them the same width as the postbit to avoid any resizing?
 

Jonathan

Active member
#9
Vincent,





Quick edits.

Brogan, fair points. The user ranks may have to be cut down or postbit info extended a little for them to fit in. They can also be used for your current vBulletin or IPB websites. People will most likely have to edit the template to put them in unless there is a feature in XenForo for user rank images.

That probably would make more sense, thanks for mentioning! I'll ensure all future user ranks stick to the default postbit info width, thanks for letting me know & improve

Thank you everyone for the lovely comments ;)
 

Brogan

XenForo moderator
Staff member
#11
That probably would make more sense, thanks for mentioning! I'll ensure all future user ranks stick to the default postbit info width, thanks for letting me know & improve
My comments weren't meant as a critique, I was just genuinely interested as to where these icons would be used.
 

Shadab

Well-known member
#13
Anyone have an idea how to implement something like this?
This can be easily done via minimal HTML (see below). Mostly CSS would be required (especially for the upward pointing arrow on the top). Just did this via firebug:

User_Title.png

HTML:
<div class="messageUserBlock">
    <!-- Extra markup for the arrow -->
    <div class="arrow"><span></span></div>

    <!-- The user image, 140px wide -->
    <img src="http://trollin.info/i/13495979494c8a86cdef8ef9.65660002-gmod.png" />
</div>
 

EQnoble

Well-known member
#14
This can be easily done via minimal HTML (see below). Mostly CSS would be required (especially for the upward pointing arrow on the top). Just did this via firebug:

View attachment 1822

HTML:
<div class="messageUserBlock">
    <!-- Extra markup for the arrow -->
    <div class="arrow"><span></span></div>

    <!-- The user image, 140px wide -->
    <img src="http://trollin.info/i/13495979494c8a86cdef8ef9.65660002-gmod.png" />
</div>
now that is frigging cool. What css doc are you refrenceing with that html , or are you doing it from a save page source ... I can't figure out how you did that and it would be awesome to so I can get a kick start on learning all the classes.
 

EQnoble

Well-known member
#16
If you use Firefox you can install Firebug and edit web pages directly on the fly.

Like this:

View attachment 1823
well I use firebug when testing pages I make for flowplayer just to check errors in running code but I was not aware I could on the fly edit pages...how does that work..is this saved to like a temp directory I mean it can't possibly save it to the site? I would have to assume that this is just editing how I see it, right?
 

Brogan

XenForo moderator
Staff member
#17
This is going off topic now, apologies Jonathan, but yes, you can edit pages and the edits are stored locally.

Refreshing the page will remove the edits.
 

Brogan

XenForo moderator
Staff member
#19
Where ideally do you see user ranks placement? I hadn't put to much thought in it and would like to hear how you envisioned it when you created them.
Personally I would put them in the postbit directly below the user title.

rank.PNG

I've highlighted the css for you so you can see how I did that.