FANDOM


For information on creating modules, see UserTags/Extending.

UserTags is a script that can add, remove, modify and rearrange the tags on User pages (the "Founder", "Admin", "Blocked", etc. tags that appear next to user's names in their masthead). It allows you to add tags in addition to the Wikia default ones and to rearrange and remove them as desired. You can also invent custom tags which you can award to users for whatever reason you deem appropriate.

This script replaces InactiveUsers and UserBadges – you should only use one of these three scripts to avoid conflicts. UserTags is the newest and has the most features and customisation options.

See MessageWallUserTags for "tags" on Forum (not Discussions) and Message Walls.

Installation

Add the line below to your wiki's MediaWiki:ImportJS page:

dev:UserTags/code.js

You will also need to add the following CSS to MediaWiki:Wikia.css:

a.tag {
    color: inherit;
}

And, finally, add this CSS to MediaWiki:Monobook.css:

.tag:before {
    content: '['
}
 
.tag:after {
    content: ']'
}
 
.tag {
    font-size: 10pt;
    vertical-align: middle;
}
 
.tag-container > .tag:first-child {
    margin-left: 1ex;
}

This is sufficient for the basic functionality; however, if you want to customise it then you will need to read the Configuration section.

Configuration

This script has a lot of features so the following section is somewhat long. You don't need to use all of them; in fact you can ignore the ones you don't want. You may want to skip to the Examples then come back to read the Core Configuration section.

Core Configuration

Add this to the Common.js: (source)

window.UserTagsJS = {
	modules: {},
	tags: {},
	oasisPlaceBefore: ''
};

The first thing you need to know is that users are divided into "groups", these are things like "blocked", "sysop", "bureaucrat" or "inactive". These are internal names used by the software but they need to be displayed on the screen in the end, to do this they are converted into "tags". Tags describe what is actually shown on the screen afterwards.

Let's make a simple example, let's say you want to create 3 tags: "Editor of the Month", "Featured" and "Templates Guru". To do this, we will create the groups "montheditor", "featured" and "templates":

window.UserTagsJS = {
	modules: {},
	tags: {
		// group: { associated tag data }
		montheditor: { u:'Editor of the Month' },
		featured: { u:'Featured' },
		templates: { u:'Templates Guru' }
	}
};

When creating new groups and tags, this is generally sufficient, except these tags will be placed at the end of the row in the header. Maybe you want to place the tag at start instead, to control the order, you use the order configuration option.

window.UserTagsJS = {
	modules: {},
	tags: {
		montheditor: { u:'Editor of the Month', order:-1/0 },
		featured: 'Featured',
		templates: 'Templates Guru'
	}
};

The order parameter is a number from negative infinity to positive infinity, lower numbers are closer to the start. In this case -1/0 is negative infinity so the tag will be placed at start.

You can use any of the following parameters to design your tags:

Parameter Description Type Default
u The text to display when the [tagged] user has an unknown gender (not set in their options). Text Required
m The text to display when the [tagged] user is male Text If missing, the u value will be used instead
f The text to display when the [tagged] user is female Text If missing, the u value will be used instead
order Controls the order of tags in the row. Lower numbers are placed at the start and the biggest number at the end. Number 10100
link Allows you to turn the tag into a link to a page either on the Wiki or anywhere on the Internet. It accepts normal wiki links like "Project:Administrators" or full URLs like "http://www.google.com/". If this is not set then the tag will be displayed as plain text instead. Be aware that interwiki links (like "Wikipedia:Computer") will not work, use a full http:// URL instead. Text blank
title Sets the text displayed when the user hovers their mouse over the tag. Text blank

The male/female/unknown variants exist to support languages other than English, like Italian, that have different nouns for males/females. In English, or other languages that don't differentiate on gender, you can only need to use the u (unknown) field.

Overriding Existing Tags

Sometimes the existing tags may not be adequate for your needs; maybe you want to change the text, order or make them into a link. You can do this by simply defining your own tag for the existing group:

window.UserTagsJS = {
	modules: {},
	tags: {
		bureaucrat: { u:'Bureaucrat Tag', link:'Project:Bureaucrats' },
		inactive: { u: 'Has not edited recently' }
	}
};

This will change the bureaucrat tag to say "Bureaucrat Tag" and turn it into a link to the Project:Bureaucrats page and change the inactive tag so that it says "Has not edited recently" instead of just "Inactive". Alternatively, maybe you just want to make it a link without changing the text, or just change the order, you can do that as well:

window.UserTagsJS = {
	modules: {},
	tags: {
		bureaucrat: { link:'Project:Bureaucrats', order:1e101 }
	}
};

This will make the bureaucrat tag into a link and move it to the end without changing what it says. [NOTE: Not setting text only works with built-in groups; for your own made-up groups, specifying the text on the tag is not optional]

GOTCHA: When working with built-in groups that have a hyphen in their name, you must wrap the name in quotes for it to work:

window.UserTagsJS = {
	modules: {},
	tags: {
		// DON'T DO THIS, IT WILL NOT WORK
		bot-global: { link:'Project:Bots' }
 
		// THIS WILL WORK
		'bot-global': { link: 'Project:Bots' }
	}
};

Styling / Appearance

The script is designed to make it easy to give each tag a different appearance. Every tag has a CSS class based on the internal group that created it with 'usergroup-' added to the start. For example, the bureaucrat tag has the CSS class usergroup-bureaucrat, the inactive tag has the usergroup-inactive class and so on. Your custom tags will use the groups you picked, the "Editor of the Month" tag from earlier has the usergroup-montheditor CSS class.

To change the colors or appearance, simply add a rule to MediaWiki:Wikia.css, like this:

.tag.usergroup-bureaucrat {
	background-color: gold !important;
	color: black !important;
}
.tag.usergroup-featured {
	background-color: blue !important;
	color: white !important;
}

This will make bureaucrat tags gold and "featured user" tags blue. You can use any CSS directives you like, including changing the borders, adding background images or whatever.

.tag.usergroup-bureaucrat {
	/* Display custom background on tag with a red square border */
	background-image: url("http://site.com/image.png");
	border: 3px red solid;
	border-radius: 0;
}
.tag.usergroup-featured:before {
	/* Add a magnifying glass icon to the left side of the "Featured" tag */
	content: url("http://site.com/magnifying-glass.gif");
}

The only caveat is that internal group names will be reduced to plain English, if you have a group like 'asd%$ü@xyzüü' then you'll end up with usergroup-asdxyz but there is no reason to use non-English alphabet characters in internal groups since they aren't visible to your wiki's visitors.

All tags that are produced or managed by UserTags are contained within a span element with the tag-container CSS class. You can use this fact to move all the tags onto their own line by setting tag-container to display: block for example. You can see the effects you can try in the Examples section.

Finally, the user masthead itself has the CSS class for the first tag on the line added to it. For example, if the bureaucrat tag is at the start of the line then you'll find that #UserProfileMasthead has the 'usergroup-bureaucrat' class attached to it. You can use this fact to add different colors or background images to the masthead based on what groups the user is in. Note that Wikia tags are at the start of the line by default, locked tags like "Staff" in particular cannot be moved away from the start. This means that Staff users will always receive 'usergroup-staff' even if they hold a local admin position.

Controlling where the Tags are put

The oasisPlaceBefore option allows you to control where the tags are positioned in the Oasis header. By default, they are always placed at the end like the Wikia ones but you are free to change this by specifying a CSS (jQuery) selector for this option. For example, if you would like to place the tags after the H1 (user name), but before the H2 (real name) then you would do this:

window.UserTagsJS = {
	modules: {},
	tags: {},
	oasisPlaceBefore: '> h2' // Place tags before the H2
};

Modules

For the developer documentation for creating new modules, see /Extending.

Now that you understand the basics, we can move on to the actual features. The script is broken into modules which can be turned on and off separately. You don't need to read this whole thing, you may want to skip to the examples then come back to choose which ones you want.

The built-in modules and their configuration options are listed below. It is possible to create your own modules, or to install additional ones created by other developers as well. If you'd like to use a 3rd party module written by someone else then you'll want to read the relevant documentation provided by its developer.

Inactive

Enabled by default: Yes
Default value: 30
Associated Group/Tag: inactive
Works with Anonymous Users: Yes

This module adds the inactive group to users who have not edited within the configured interval. It takes a number specifying the number of days a user must have not edited to be considered inactive:

UserTagsJS.modules.inactive = 50; // 50 days

If you have a more stringent set of requirements then you can filter the edits by the namespace in which they were made. For example, if you only consider people who edit article pages to be "active" and everyone else is inactive even if they have edited a talk page or such recently then you can use this configuration format instead:

UserTagsJS.modules.inactive = {
	days: 30,
	namespaces: [0],
	zeroIsInactive: true // 0 article edits = inactive
};

0 is the main article namespace. The namespaces array can hold multiple values and will accept plain namespace nameslike those in the URL bar, for example:

UserTagsJS.modules.inactive = {
	days: 30,
	namespaces: [0, 'Talk', 'User talk', 'Forum'] // Edits must be to articles or talk pages or user talk pages or the forum to count, others don't count
};

MediaWiki Groups

Enabled by default: Yes
Default value: ['bannedfromchat', 'blocked', 'bot', 'bureaucrat', 'chatmoderator', 'checkuser', 'content-moderator', 'council', 'helper', 'rollback', 'staff', 'sysop', 'threadmoderator', 'vanguard', 'vstf']
Associated Group/Tag: As listed in the array you give
Works with Anonymous Users: No

This module adds the user's MediaWiki groups to the internal group list, and will automatically download tag text translations for those groups from the server. This module deals with formal groups like chatmoderator, bureaucrat, sysop, bannedfromchat, rollback, etc. The sort of things you see in Special:ListUsers. This module takes an array listing the groups you want to include:

UserTagsJS.modules.mwGroups = ['bureaucrat', 'sysop', 'rollback', 'bannedfromchat'];

Global Accounts Without Edits

Enabled by default: No
Associated Group/Tag: nonuser
Works with Anonymous Users: Yes

This module tags users who have zero edits. It's not very useful in Oasis since you can see the contributions counter in the masthead but it may be useful in Monobook. There are no configuration options, just enable it if you want it:

UserTagsJS.modules.nonuser = true; // Switch on

For more skilled users, you can freely apply custom JavaScript logic if you want to enable this, but only in Monobook:

UserTagsJS.modules.nonuser = (mediaWiki.config.get('skin') === 'monobook');

Newly Registered Accounts

Enabled by default: Yes
Associated Group/Tag: notautoconfirmed
Works with Anonymous Users: No

This module tags users who have only recently created their account; that is, they have only been a registered Wikia user for less than 4 days and have made less than 10 edits to any wiki in the Wikia network. This may be helpful for quickly recognising sockpuppet accounts. Simply enable it if you want it:

UserTagsJS.modules.autoconfirmed = true; // Switch on

Note that the length of time and number of edits are decided and controlled by Wikia; the module itself does not choose them, and you have no control over it.

New Editors

Enabled by default: Yes
Default value: { days: 4, edits: 10 }
Associated Group/Tag: newuser
Works with Anonymous Users: No

This module tags users who have not been on your particular wiki for the specified number of days or haven't made the specified number of edits. This is basically the same as the autoconfirmed module except that it applies to one wiki rather than all of them. It may be useful for recognising meat-puppets, or just new editors who may have been on Wikia for a while but don't know local policies very well. To configure it you can set any of these fields, leaving out ones that you want to keep the default value for:

UserTagsJS.modules.newuser = {
	days: 5, // Must have been on the Wiki for 5 days
	edits: 10, // And have at least 10 edits to remove the tag
	namespace: 0 // Edits must be made to articles to count
};

The parameters are:

Parameter Description Type Default
days The number of days since their first edit until the tag is removed. Number 4
edits The number of edits they must make in order to have the tag removed. Number 10
namespace The namespace number that the edits must be made in before they count. Set this to 0 to have only article edits count (ignoring edits made to Sandboxes, User, User talk, Article Comments, Message Walls, etc). Number all namespaces

This module also optionally supports a more powerful format that allows you define your own decision logic. You will need a rudimentary understanding of JavaScript to use this, but it let's you define complex relationships like Less than 3 days OR Less than 10 edits OR (Less than 30 edits AND Less than 5 days).

UserTagsJS.modules.newuser = {
	namespace: 0, // [Optional] Edits must be made to articles to count
	computation: function(days, edits) {
		// If the expression is true then they will be marked as a new user
		// If the expression is false then they won't.
		// In this example, newuser is removed as soon as the user gets 30 edits, OR as soon as they have been present for 10 days, whichever happens first
		return days < 10 && edits < 30;
	}
};

The namespace parameter here is the same as the first syntax. Note that the days and edits parameters do not do anything at all in this second form, they are only used when you do not define a computation function yourself.

Custom

Enabled by default: No
Associated Group/Tag: As specified by you
Works with Anonymous Users: Yes

This module lets you attach your custom tags to users. Custom tags are the ones you were shown how to create in the Core Configuration section. You can also attach any built-in groups if you want; it's entirely acceptable to add the inactive group to a user as a custom group if you'd like to do that (this is equivalent to a gone list). You can also do weird things like adding the founder or bureaucrat group to a user isn't actually either of those things. This module is mildly complex to configure, it maps user names to arrays of groups:

UserTagsJS.modules.custom = {
	'UserName 1': ['montheditor', 'featured'], // Add Editor of the Month + Featured
	'UserName 2': ['featured'], // Add featured
	'UserName 3': ['featured', 'templates'], // Add featured + templates guru
	'UserName 4': ['inactive'] // Always inactive
};

Note that the order of groups in the lists here has no effect on how the groups are displayed on the screen, only the associated tag's order parameter matters.

User Filter

Enabled by default: No
Associated Group/Tag: N/A, removes them not adds
Works with Anonymous Users: Yes

This module removes groups from certain specific users, such as if you wanted to remove the founder group from someone, or if you enable the inactive module but you don't want one particular user to show as inactive even when they are. The format is identical to custom above except that the effect is the opposite:

UserTagsJS.modules.userfilter = {
	'UserName 1': ['inactive'], // User is *never* inactive
	'UserName 2': ['founder'], // Remove the founder group
	'UserName 3': ['nonuser', 'newuser', 'inactive']
};

Meta Filter

Enabled by default: Yes
Default value: { sysop: ['bureaucrat', 'founder'], bureaucrat: ['founder'], chatmoderator: ['sysop', 'bureaucrat'] }
Associated Group/Tag: N/A, removes them not adds
Works with Anonymous Users: Yes

The meta-filter is a more powerful version of the user filter, instead of operating on user names, it operates on groups. The format is otherwise similar but the effect is much more impressive:

UserTagsJS.modules.metafilter = {
	'inactive': ['sysop', 'bureaucrat'], // Remove inactive from all bureaucrats and sysops
	'sysop': ['bureaucrat'], // Remove "Admin" tag from bureaucrats
	// Remove chat moderator from admins as well as users who have BOTH patroller AND rollback
	'chatmoderator': ['sysop', ['patroller', 'rollback']]
};

Implode (Combine)

Enabled by default: No
Associated Group/Tag: As specified by you
Works with Anonymous Users: Yes

This module allows you to detect a particular combination of user groups and merge them together into a single group. The idea is to allow you to create "meta-groups" like combining bureaucrat and inactive to get "inactive-bureaucrat", or combine chatmoderator and patroller to get "half-admin" or whatever else you'd like.

UserTagsJS.modules.implode = {
	'inactive-bureaucrat': ['bureaucrat', 'inactive'], // Adds 'inactive-bureaucrat' BUT also removes bureaucrat and inactive.
                                                           // i.e. Replaces bureaucrat and inactive with 'inactive-bureaucrat'
	'inactive-sysop': ['sysop', 'inactive'],
	'half-sysop': ['chatmoderator', 'patroller', 'rollback']
};

As you can see, the format is basically the same as meta-filter above except that it does the opposite.

Explode

Enabled by default: No
Associated Group/Tag: As specified by you
Works with Anonymous Users: Yes

This module is the same as implode above, except without the combination part. That is, the groups you use will not be removed.

UserTagsJS.modules.explode = {
	'vandal-patrol': ['rollback', 'patroller'] // Adds 'vandal-patrol' group BUT does NOT remove rollback or patroller
};

Hide when Blocked

Enabled by default: FORCED ALWAYS
Associated Group/Tag: N/A, removes them not adds
Works with Anonymous Users: Yes

This module removes all groups from users who are blocked, except the blocked group itself obviously. This module is force enabled unless you explicitly turn it off. Generally you'll want to leave this on as it will stop blocked users from being marked inactive, or as a "new editor" if they haven't met the minimum number of edits before they were banned.

UserTagsJS.modules.stopblocked = false; // Manually turn off

Is Blocked?

Enabled by default: FORCED (in Monobook only), No (in Oasis)
Associated Group/Tag: N/A, removes them not adds
Works with Anonymous Users: Yes

This module determines if a user is blocked or not. Oasis displays a blocked tag automatically so UserTags doesn't need to determine that itself normally; as such, this is only particularly useful in Monobook. This module is force enabled in Monobook because of that, unless you choose to manually disable it.

UserTagsJS.modules.isblocked = true; // Turn on in Oasis (normally unnecessary); OR
UserTagsJS.modules.isblocked = false; // Turn off in Monobook (does not affect Oasis)

Oasis Tags

This module exists internally and is not user configurable. It is only noted here to explain the script's behaviour.

This module's function is to read the Oasis (Wikia generated) tags off the page and interpret what they mean (this is where 'blocked' and the default groups like 'sysop', 'staff', 'vstf', etc. come from in Oasis). It also automatically fetches the user-identity-box-group- messages in both Oasis and Monobook for your convenience when referring to built-in groups with the custom module and so forth.

Example

// Core configuration. We add 2 custom tags and change what the built-in sysop tag says.
window.UserTagsJS = {
	modules: {},
	tags: {
		hello: { m: 'Male', f:'Female', u: 'No Gender Set', order: -1/0, link:'http://en.wikipedia.org/wiki/Gender' },
		muckraker: 'Muckraker',
		sysop: { u:'Addermin', link:'Project:Administrators' }, // Change "Administrator" to "Addermin"
		'mini-sysop': { u: 'Half Administrator', link:'Project:HalfAdmins' },
		'vandal-patrol': { u: 'Spamdal Janitor', link:'Project:Janitors' }
	}
};
// Add custom groups to several users
UserTagsJS.modules.custom = {
	'John Doe': ['muckraker', 'hello'],
	'Someone': ['hello'],
	'You': ['inactive'], // Force inactive group instead of relying on the inactive module
	'Other User': ['hello', 'muckraker']
};
UserTagsJS.modules.autoconfirmed = true;
UserTagsJS.modules.newuser = true;
UserTagsJS.modules.inactive = 35; // Inactive if no edits in 35 days
UserTagsJS.modules.mwGroups = ['bureaucrat']; // Add bureaucrat group to bureaucrats
UserTagsJS.modules.metafilter = {
	sysop: ['bureaucrat'], // Remove administrator group from bureaucrats
	hello: ['muckraker'], // Remove hello group from people with muckraker group
	'vandal-patrol': ['mini-sysop'] // Remove vandal-patrol from mini-sysops
};
UserTagsJS.modules.userfilter = {
	'John Smith': ['inactive'] // John Smith is never inactive, even when he is
};
UserTagsJS.modules.implode = {
	'mini-sysop': ['patroller', 'rollback', 'chatmoderator'] // Remove patroller, rollback and chatmoderator, if ALL 3 exist, and replace with 'mini-sysop'
};
UserTagsJS.modules.explode = {
	'vandal-patrol': ['patroller', 'rollback'] // Add 'vandal-patrol' to everyone who has BOTH patroller and rollback
};

This demonstrates all the modules, it's not particularly practical but you hopefully get a basic feel for how to use it. You create your custom tags inside the tags section then add separate configuration blocks for each module you want to use after it. You only need to use the modules you want, you probably don't want all the ones here and you definitely don't want to use this as is.

For a more practical example, here is the default configuration that the script uses internally when you don't set one yourself:

window.UserTagsJS = {
	modules: {},
	tags: {}
};
UserTagsJS.modules.inactive = 30;
UserTagsJS.modules.newuser = true;
UserTagsJS.modules.autoconfirmed = true;
// NOTE: bannedfromchat displays in Oasis but is not a user-identity group so must be checked manually
UserTagsJS.modules.mwGroups = ['bureaucrat', 'chatmoderator', 'patroller', 'rollback', 'sysop', 'bannedfromchat', 'bot', 'bot-global'];
UserTagsJS.modules.metafilter = {
	sysop: ['bureaucrat', 'founder'],
	bureaucrat: ['founder'],
	chatmoderator: ['sysop', 'bureaucrat']
};

Please keep in mind that this default configuration is only used when NO settings are given. It's highly recommended that you copy this entire block into your MediaWiki:Common.js and then customise it from there, adding and removing extra module entries and creating new tags as needed.

Walkthrough

For a walkthrough, I'll show you how to create the tags shown in the image below:

UserBadges Example

There are 3 custom tags in this image, "JavaScript", "CSS" and "Templates" as well as 2 MediaWiki groups: "sysop" and "bureaucrat". Also take note of the order: the "Administrator" tag is at the start then "Bureaucrat" and so on.

We'll start by configuring the script and add the colors later. The first step is to create the custom groups and tags:

window.UserTagsJS = {
	modules: {},
	tags: {
		jshelper: { u: 'JavaScript' },
		csshelper: { u: 'CSS' },
		templatehelper: { u: 'Templates' }
	}
};

Reasonably straightforward, the group names I picked are arbitrary, you can use any plain English name you like (letters A-Z a-z 0-9), although you should remember that it is case sensitive if you mix capitals. If you try to use spaces or hyphens then you will need to wrap the name in quotes for it to work. This isn't quite enough, we also want the tags to be a certain order as well, so we'll have to add order parameters:

window.UserTagsJS = {
	modules: {},
	tags: {
		jshelper: { u: 'JavaScript', order: 100 },
		csshelper: { u: 'CSS', order: 101 },
		templatehelper: { u: 'Templates', order: 102 },
		bureaucrat: { order: 1 } // Normal order is 0
	}
};

This will place all the tags in the order shown in the image, you'll notice I also added a partial tag for the bureaucrat group, this is because bureaucrat is a built-in group so it already has text translations which I don't need to change. I don't need to do anything for the sysop group as its order defaults to zero like all MediaWiki groups. Remember that the tags are sorted by their given order values from smallest (start) to largest (end). The numbers I picked are arbitrary, they don't really matter as long as each tag has a different number; tags that have the same order number will be arranged randomly [they'll be in the right place relative to the other tags with different order values, but random with respect to tags sharing the same order]. There are several specific numbers you may find useful as well:

Number Importance
0 Tags with this value will generally be near the start. All MediaWiki group tags share this value by default. Remember that tags sharing the same order will be randomly arranged relative to each other.
1e100 10100. This is the default value for tags, it is obviously quite large so unordered tags will generally end up at the end except for the tags for the newuser/nonuser/notautoconfirmed groups which have 10101 as their order.
1/0 Positive infinity. This is the largest possible value. Any tags with this value will be at the absolute end always. inactive uses this value by default.
-1/0 Negative infinity. This is the smallest possible value. Tags with this value will be at the very start, except for blacklisted tags.

Now that we have our groups and tags set up correctly, we can move on to actually using them. To use our custom groups/tags, we obviously need to use the Custom module so we'll set that up now:

UserTagsJS.modules.custom = {
	'Lunarity': ['csshelper', 'templatehelper', 'jshelper'] // NOTE: order of list here does NOT matter
};

If you've read the description for the custom module, you can see that this adds 3 groups to the selected user. Not terribly difficult, if we wanted to add groups to multiple users then we could just list more of them.

We're half-way now, we just need to add the Bureaucrat and Admin tags. To do that, we'll use the MediaWiki Groups module. MediaWiki Groups asks the server for the user's groups automatically so we don't have to fill in each user's groups manually in the custom lists which would be a tedious waste of time.

UserTagsJS.modules.mwGroups = ['bureaucrat', 'sysop'];

Pretty simple really. The script will now ask the server for the user's group memberships and automatically add the "bureaucrat" and "sysop" groups if the server says that the user is in them. [It also implicitly retrieves the text translations for the bureaucrat and sysop tags from the server as well, this is where the internal default text comes from]

Finally, we need to set the colors to match what we see in the image. To do that, we'll create a couple of custom CSS rules in MediaWiki:Wikia.css. Each tag on the UI has a CSS class based on the group that generated it; for example, the "Bureaucrat" tag has a usergroup-bureaucrat CSS class. For our custom tags, the CSS classes will be usergroup-jshelper, usergroup-csshelper, usergroup-templatehelper.

.tag.usergroup-jshelper {
	background-color: #720 !important;
}
.tag.usergroup-csshelper {
	background-color: green !important;
}
.tag.usergroup-templatehelper {
	background-color: yellow !important;
	color: black !important;
}

And we're done.

The final JavaScript in MediaWiki:Common.js looks like this:

window.UserTagsJS = {
	modules: {},
	tags: {
		jshelper: { u: 'JavaScript', order: 100 },
		csshelper: { u: 'CSS', order: 101 },
		templatehelper: { u: 'Templates', order: 102 },
		bureaucrat: { order: 1 }
	}
};
UserTagsJS.modules.custom = {
	'Lunarity': ['csshelper', 'templatehelper', 'jshelper'] // NOTE: order of list here does NOT matter
};
UserTagsJS.modules.mwGroups = ['bureaucrat', 'sysop'];

Of course, you probably also want to enable Inactive Users and several other modules as well.

Restyling the Oasis Masthead

UserTags CSS Example

The above image used the following configuration:

window.UserTagsJS = {
	modules: {},
	tags: {
		a: { u: 'Test Tag 1', order:1 },
		b: { u: 'Test Tag 2', order:2 },
		c: { u: 'Test Tag 3', order:3 },
		d: { u: 'Test Tag 4', order:4 },
		e: { u: 'Test Tag 5', order:5 }
	},
	oasisPlaceBefore: '> h1'
};
UserTagsJS.modules.custom = {
	'Lunarity': ['a', 'b', 'c', 'd', 'e', 'inactive']
};

The appearance was formed using the following CSS rules:

.tag-container {
	display: block;
	background-image: url("http://images2.wikia.nocookie.net/railgunscript/images/e/e8/Railgun_Top_Bar.png");
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	border-radius: 5px 5px 0 0;
}
.tag-container > .tag {
	background: rgba(0,0,0,0.6) !important;
}
.UserProfileMasthead .masthead-info hgroup {
	padding-top: 20px;
	background: rgba(32,64,150,0.66);
	background-image: linear-gradient(to top left, rgba(0,0,0,0.5) 0%, rgba(140,140,141,0.8) 100%);
}
.UserProfileMasthead .masthead-info {
	background: url("http://images.wikia.com/railgunscript/images/c/cb/Seamless-space.jpg") 0 20% black;
	color: white;
}
.UserProfileMasthead .tally {
	border-radius: 10px;
	background: rgba(0,0,0,0.5);
	padding: 3px 1em;
}
.UserProfileMasthead .masthead-info-lower:before {
	border-color: rgba(0,0,0,0.7) rgba(0,0,0,0.7) transparent transparent;
}
#WikiaUserPagesHeader {
	background-image: linear-gradient(to bottom, white 0%, #888 25%, black 75%);
}

Full Group List

This is a list of all built-in groups for reference if you want to change the text or avoid accidentally picking an already used name for a custom group:

  • inactive
  • nonuser
  • newuser
  • notautoconfirmed
  • founder
  • staff
  • vstf
  • council
  • authenticated
  • helper
  • patroller
  • rollback
  • sysop
  • bureaucrat
  • bot-global

The following MediaWiki groups are also known to exist so you probably want to avoid these as well unless you are intentionally trying to change what the tags say for them:

  • autoconfirmed
  • emailconfirmed
  • user
  • bot
  • bannedfromchat
  • checkuser
  • checkuser-global
  • util

Note that all the groups in this second list do not have default text unless you have the mwGroups module configured to look for these. The MediaWiki Groups module will download the tag text on demand only; otherwise, only the default text for groups in the first list will be available to you.

Limitations

Some Wikia generated tags are protected, the following groups may not be added or removed from any user.

  • staff — Wikia employees
  • vstf — Volunteer Spam Task Force
  • council — Wikia beta testers
  • authenticated — Official PR accounts for companies
  • helper — Wikia interns and contractors

The tags for these groups will always be kept and will always be left at the start of the row; however, you can make the tags for these groups into links and add hover text to them as normal, only changing the face text and order is restricted.

All other Wikia generated tags like "Founder", "Admin", "Blocked", etc can be manipulated normally.

In order to change the face text on the tags for the above protected groups, you can edit the MediaWiki messages on the server that contain the text translation data for them. These messages can be found here:

Please give careful consideration and use common sense when editing these; they exist to make Staff and VSTF members easy to find and recognise, changing what the tags say will make that more difficult and confusing for people not familiar with the Wiki.

NOTE: UserTags has an internal cache, it may take up to 1 hour for any changes to the above identity groups to actually appear. There may also be glitches like making the Staff tag a link not working at all until the cache is purged. [The cache is in localStorage, you can force it to be deleted by clearing your cookies; that is not recommended though]

Text above can be found here (edit)

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.