NamelessMC

Easy custom badges with v2 and DefaultRevamp
Started by CRUGG

CRUGG

CRUGG

Member
Joined
11 Feb 2018
Topics
6
Posts
13
IGN
CRUGG

Hey there. This will be a quick tutorial on how to make custom badges with the DefaultRevamp Theme in v2-pre6. I can not guarantee this to work with other themes/version.

First of all you have to navigate to /YourForumDirectory/custom/templates/DefaultRevamp/css/custom.css and open it with a text editor. The following does definitely work in the integrated WinSCP Text Editor, Notepad++ & Atom. Can't guarantee that for other text editors though. Press CTRL+F which should open a Search Window where you'll now search for ".badge-danger" and press Enter. You should now find and copy the following snippet of the CSS and paste it again below it:

.badge-danger {
	color: #fff;
	background-color: #dc3545;
}


a.badge-danger:hover, a.badge-danger:focus {
	color: #fff;
	background-color: #bd2130;
}

Once you copied this and pasted the exact same below, just edit the "background-color" for both to your color. You can also edit the text color if you want to. Now edit the "danger" in the text you pasted to something else. For example "owner". When you're finished, everything should look like this:

.badge-danger {
	color: #fff;
	background-color: #dc3545;
}


a.badge-danger:hover, a.badge-danger:focus {
	color: #fff;
	background-color: #bd2130;
}

.badge-owner {
	color: #fff;
	background-color: #AA0000;
}


a.badge-owner:hover, a.badge-owner:focus {
	color: #fff;
	background-color: #AA0000;
}

Now you only have to add the following HTML as the Group HTML in the group settings:

< span class="badge badge-owner" >Owner< /span >

without the spaces after and before the "<"s and ">"s. I just added them, as otherwise the forum would parse the HTML

x3
CRUGG · about 1 year ago · Last edited: about 1 year ago
Fjuro

Fjuro

Member
Joined
02 Jan 2020
Topics
0
Posts
8
IGN
Fjuro

Thank you!

Fjuro · 8 months ago
enno123

enno123

Member
Joined
14 Apr 2020
Topics
1
Posts
4
IGN
enno123

👍

enno123 · 7 months ago · Last edited: 7 months ago
Gamil

Gamil

Member
Joined
01 Sep 2020
Topics
0
Posts
1
IGN
Gxmil

Doesn't work?

 

EDIT ~ Figured it out, thanks!

x1
Gamil · 3 months ago · Last edited: 3 months ago