FM Design
Would you like to react to this message? Create an account in a few clicks or log in to continue.
FM Design

Design and development for Forumotion forums.

IMPORTANT

FM Design is in read-only mode, please click here for more information.

Latest topics
» Forumactif Edge - Releases
by Ange Tuteur Tue 03 Sep 2019, 11:49

» GIFActif - Giphy Button for the Editor
by Ange Tuteur Wed 08 May 2019, 17:21

» Forum Closure
by Ange Tuteur Mon 01 Jan 2018, 01:28

» Chit Chat Thread
by Valoish Sun 31 Dec 2017, 19:15

» Font/Text background color.
by Valoish Sun 31 Dec 2017, 19:11

» Forumactif Messenger - Instant Message Application for Forumotion
by Wolfuryo Sun 31 Dec 2017, 18:24

» [GAME] Count to One Million!
by brandon_g Fri 29 Dec 2017, 18:58

» Post Cards
by manikbiradar Wed 20 Dec 2017, 07:50

» [GAME] Countdown from 200,000
by Valoish Wed 13 Dec 2017, 23:22

» GeekPolice Tech Support Forums - GeekPolice.net
by Dr Jay Mon 11 Dec 2017, 19:12

» Asking about some plugin for Forumotion
by Dr Jay Mon 11 Dec 2017, 19:10

» [GAME] What are you thinking right now?
by Van-Helsing Sat 09 Dec 2017, 14:51

» Widget : Similar topics
by ranbac Wed 06 Dec 2017, 18:11

» Change the Background of the Forum and put an image and how to make prefixs?
by Clement Wed 06 Dec 2017, 15:19

» Hello from Western Australia
by SarkZKalie Wed 06 Dec 2017, 05:34

Recent Tutorials
See more
Top posting users this month

Top Achievers
Ange Tuteur
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
SLGray
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
Valoish
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
Luffy
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
Wilson
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
Van-Helsing
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
Niko!
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
Ace 1
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
JerriLeah7
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
Rhino.Freak
Rank CSS Poll_c10Rank CSS Poll_m10Rank CSS Poll_c10 
Who is online?
In total there are 10 users online :: 0 Registered, 0 Hidden and 10 Guests :: 2 Bots

None

[ View the whole list ]


Most users ever online was 515 on Tue 14 Sep 2021, 15:24
Keywords

translations  wio_group_legend  Version  message  search  plugin  left  fa_personal_emoticons_list  Mozilla  Dutch  fa_night_container  chatBox  German  tool  fa_theme_selector  line-break  beta-testers  phpBB3  text_editor_textarea  options  js  editor  Update  French  46-0-1  FireFox  


Rank CSS

 :: Coding, Resources, and Plugins :: Learning Resources

View previous topic View next topic Go down

Solved Rank CSS

#31117
Mr_Grande
Mr_Grande

Gender : Unspecified
Age : 26
Posts : 42
Points : 2898
Reputation : 9
Language : English
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision

PostMr_Grande Mon 04 Sep 2017, 11:43

How do I make a rank CSS on Forumotion?


Last edited by Mr_Grande on Wed 04 Oct 2017, 15:44; edited 1 time in total

Solved Re: Rank CSS

#31118
Mr_Grande
Mr_Grande

Gender : Unspecified
Age : 26
Posts : 42
Points : 2898
Reputation : 9
Language : English
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision

PostMr_Grande Mon 04 Sep 2017, 14:42

Is there any Tutorial or anything.

Solved Re: Rank CSS

#31121
Mr_Grande
Mr_Grande

Gender : Unspecified
Age : 26
Posts : 42
Points : 2898
Reputation : 9
Language : English
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision

PostMr_Grande Wed 06 Sep 2017, 10:18

Still looking

Solved Re: Rank CSS

#31122
Valoish
Valoish
Graphic Designer
Gender : Female
Age : 28
Posts : 3671
Points : 7358
Reputation : 360
Location : NYC
Language : English, Russian, Hebrew
Browser : Browser : Google Chrome Forum Version : Forum Version : phpBB2
http://www.canvasforums.com https://twitter.com/Valoishx3

PostValoish Wed 06 Sep 2017, 14:11

What do you mean by Rank CSS?
Can you show an example of what you mean in a screenshot

Solved Re: Rank CSS

#31123
Mr_Grande
Mr_Grande

Gender : Unspecified
Age : 26
Posts : 42
Points : 2898
Reputation : 9
Language : English
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision

PostMr_Grande Wed 06 Sep 2017, 15:20

I found this http://help.forumotion.com/t138548-css-rank-styling something basically the same thing how do i add it? to the user groups

Solved Re: Rank CSS

#31126
Mr_Grande
Mr_Grande

Gender : Unspecified
Age : 26
Posts : 42
Points : 2898
Reputation : 9
Language : English
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision

PostMr_Grande Fri 08 Sep 2017, 09:24

Still looking @Valoish I posted a example^

Solved Re: Rank CSS

#31154
Harleen
Harleen
Member
Gender : Female
Age : 38
Posts : 24
Points : 3062
Reputation : 19
Location : Rio de Janeiro
Language : Portuguese
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Forumactif Edge
http://antenadogames.forumeiros.com/

PostHarleen Wed 27 Sep 2017, 09:34

Hi @Mr_Grande.

Create ranks in the control panel.

Code:
<div class="admin">Administrator</div>

And add the CSS topic, you will get this result:

Rank CSS GYKxb4O

Solved Re: Rank CSS

#31155
Mr_Grande
Mr_Grande

Gender : Unspecified
Age : 26
Posts : 42
Points : 2898
Reputation : 9
Language : English
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision

PostMr_Grande Wed 27 Sep 2017, 10:33

Harleen wrote:Hi @Mr_Grande.

Create ranks in the control panel.

Code:
<div class="admin">Administrator</div>

And add the CSS topic, you will get this result:

Rank CSS GYKxb4O

Thanks so much Smile is there a way of changing the colors for each rank though?

Solved Re: Rank CSS

#31181
Harleen
Harleen
Member
Gender : Female
Age : 38
Posts : 24
Points : 3062
Reputation : 19
Location : Rio de Janeiro
Language : Portuguese
Browser : Browser : Mozilla Firefox Forum Version : Forum Version : Forumactif Edge
http://antenadogames.forumeiros.com/

PostHarleen Mon 02 Oct 2017, 10:35

Yes there is, just follow what was posted in this message:

http://help.forumotion.com/t138548-css-rank-styling#938193

And to change the icon, go to font awesome and after choose the icon, select the unicode, in this case f2bd

Rank CSS QSykOgll

I created three, admin, moderator and member... just change the colors...

Code:
.admin {
  background-color: #1381BE;
  border: 1px solid #278EDF !important;
  border-radius: 3px !important;
  box-shadow: 0 0 1px #F9F9F9 inset;
  color: #FFFFFF !important;
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
  padding: 0px 4px;
  vertical-align: middle;
}
.admin:before {
  content: "\f0eb";
  font-family: "FontAwesome";
  margin-right: 5px;
  font-weight: normal;
  font-size: 110%;
}
.mod {
  background-color: #7676F7;
  border: 1px solid #7676F7 !important;
  border-radius: 3px !important;
  box-shadow: 0 0 1px #F9F9F9 inset;
  color: #FFFFFF !important;
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
  padding: 0px 4px;
  vertical-align: middle;
}
.mod:before {
  content: "\f069";
  font-family: "FontAwesome";
  margin-right: 5px;
  font-weight: normal;
  font-size: 110%;
}
.member {
  background-color: #43AEE0;
  border: 1px solid #43AEE0 !important;
  border-radius: 3px !important;
  box-shadow: 0 0 1px #F9F9F9 inset;
  color: #FFFFFF !important;
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
  padding: 0px 4px;
  vertical-align: middle;
}
.member:before {
  content: "\f2bd";
  font-family: "FontAwesome";
  margin-right: 5px;
  font-weight: normal;
  font-size: 110%;
}

Solved Re: Rank CSS

#31183
Mr_Grande
Mr_Grande

Gender : Unspecified
Age : 26
Posts : 42
Points : 2898
Reputation : 9
Language : English
Browser : Browser : Google Chrome Forum Version : Forum Version : Invision

PostMr_Grande Wed 04 Oct 2017, 15:43

Harleen wrote:Yes there is, just follow what was posted in this message:

http://help.forumotion.com/t138548-css-rank-styling#938193

And to change the icon, go to font awesome and after choose the icon, select the unicode, in this case f2bd

Rank CSS QSykOgll

I created three, admin, moderator and member... just change the colors...

Code:
.admin {
  background-color: #1381BE;
  border: 1px solid #278EDF !important;
  border-radius: 3px !important;
  box-shadow: 0 0 1px #F9F9F9 inset;
  color: #FFFFFF !important;
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
  padding: 0px 4px;
  vertical-align: middle;
}
.admin:before {
  content: "\f0eb";
  font-family: "FontAwesome";
  margin-right: 5px;
  font-weight: normal;
  font-size: 110%;
}
.mod {
  background-color: #7676F7;
  border: 1px solid #7676F7 !important;
  border-radius: 3px !important;
  box-shadow: 0 0 1px #F9F9F9 inset;
  color: #FFFFFF !important;
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
  padding: 0px 4px;
  vertical-align: middle;
}
.mod:before {
  content: "\f069";
  font-family: "FontAwesome";
  margin-right: 5px;
  font-weight: normal;
  font-size: 110%;
}
.member {
  background-color: #43AEE0;
  border: 1px solid #43AEE0 !important;
  border-radius: 3px !important;
  box-shadow: 0 0 1px #F9F9F9 inset;
  color: #FFFFFF !important;
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  line-height: 18px;
  padding: 0px 4px;
  vertical-align: middle;
}
.member:before {
  content: "\f2bd";
  font-family: "FontAwesome";
  margin-right: 5px;
  font-weight: normal;
  font-size: 110%;
}



Thanks so much marking this as Solved

Solved Re: Rank CSS

#0
Sponsored content

PostSponsored content

View previous topic View next topic Back to top

Similar topics
» Rank forum
» Need few Rank Badges
» Personal Rank Titles
» Rank picture for guest users
» Logo and Rank Images Request

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

FM Design :: Coding, Resources, and Plugins :: Learning Resources

 
Permissions in this forum:
You cannot reply to topics in this forum
Free forum | Computers and Internet | Internet | ©phpBB | Free forum support | Report an abuse | Cookies | Forumotion.com
Terms of service | Founder tools | Tutorials | Affiliates