As discussed on a previous post, the WOT add-on is able to add reputations to links on pretty much any website. It uses a simple system based on Cascading Style Sheets (CSS) and regular expressions to decide where to add reputations and how to display them. In this post I'll show you how to configure the add-on to add reputations to any website you like.

In order to configure the necessary rules to the add-on, you need to have at least some basic knowledge of regular expressions, more specifically, the dialect used in JavaScript. You should also be comfortable manually editing your Firefox configuration.

Search rules

Creating a new search rule for the WOT add-on typically requires five new entries in your browser preferences. I recommend adding them to a user.js file in your Firefox profile folder, but you can also use about:config to edit the preferences if you prefer a graphical user inteface.

The add-on looks for search rules under the "weboftrust.search" preference branch. If you open about:config and type that in the filter field, you can see the default search rules that come with the add-on. The entries for each rule are grouped together under their own preference branch. For example, the entries that define a rule for adding reputations to Google search results are under the "weboftrust.search.google" branch.

Creating a new rule

In the following example, I will show you how to add a new search rule that displays reputations on the external links on stumbleupon.com, like this:

Here are the five entries I added under the "weboftrust.search.stumbleupon" preference branch in my user.js file:

Title. The first thing a search rule needs is a name. This is the title that is shown on the add-on preferences. Following the established convention, I'll just use "External Links - StumbleUpon" for our example rule:

user_pref("weboftrust.search.stumbleupon.display",
"External Links - StumbleUpon");

Location. The websites where the reputations are added are defined by a regular expression that is matched against the site's URL. The add-on uses the first rule that matches the site. In this case, I want the add-on to consider this rule for all pages under www.stumbleupon.com, so I'll add:

user_pref("weboftrust.search.stumbleupon.url",
"http\\:\\/\\/www\.stumbleupon\\.com\\/.*");

As you can see, I have escaped the backslashes and dots in the regular expression. The ".*" at the end means that the rule matches all URLs starting with "http://www.stumbleupon.com/".

Exceptions. Unless otherwise instructed, the add-on inserts reputations for each link on a website. However, as typically is the case, I only want to see reputations for external links. To skip any local links that take me somewhere else within the stumbleupon.com domain, I'll add the following entry. All links matching this regular expression will be ignored:

user_pref("weboftrust.search.stumbleupon.ign",
"http(s)?\\:\\/\\/([\\w\\-]+\\.)*stumbleupon\\.com\\/.*");

This one has a bit more regular expression magic in it. The "http(s)?" part says it also matches possible secure links and "([\\w\\-]+\\.)*" also causes it to match all subdomains under stumbleupon.com. For example, links that point to "example.stubleupon.com" are ignored as well.

Style. Now that you have selected where the reputations are shown and for which links, you must now select how they are shown. Typically, we show the reputation indicator on the right side of the link, but you can use your imagination and tune the CSS rule to your liking. However, I prefer the indicator on its usual place, so I'll just add:

user_pref("weboftrust.search.stumbleupon.style",
"dt a[ATTR=\"NAME\"] { background: url(IMAGE) right no-repeat; padding-right: 20px; margin-right: 5px; }");

This is otherwise a normal CSS rule that adds a background image to a matching link and increases the padding so the image won't be under the link text. However, it has three constants that the add-on replaces with proper values before inserting the rule to a page:

• For each matching link, the add-on adds an attribute to the link's DOM element that includes its domain name. The ATTR constant will be replaced with the name of the attribute, and the NAME constant will be replaced with the domain name.

• The actual reputation is shown as a 16x16px reputation indicator that you can place where ever you want. The IMAGE constant will be replaced by the URL for the indicator image.

Category. Finally, you can select the reputation category that is used for the indicator. Usually, the general reputation is the way to go:

user_pref("weboftrust.search.stumbleupon.app", 0);

If you want to see the reputation for another category, here are the values for the different categories:

0 = General reputation
1 = Business partner
2 = Personal information
4 = Child safety

That's it, now you can start experimenting on your own. You can also download the complete user.js file from the example above. If you have any questions or suggestions, please post a comment below or send us feedback.

Caveats

The add-on currently checks the rules and loads reputations only once when the page loads. This means that if the page contains links that are dynamically inserted after it loads, they won't have reputations on them.