Advanced configuration

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:

WOT reputations on StumbleUpon

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",
"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; margin-left: 2px; }");

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 a div element with an attribute that includes the 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.

That’s it, now you can start experimenting on your own. 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.

Edit: Updated for current add-ons, but this documentation is still incomplete. See about:config in Firefox for current examples.

Share on facebook
Share on twitter
Share on linkedin

Leave a Reply

Your email address will not be published. Required fields are marked *