Mozilla CSS for spotting nofollow links

One of the search engines methods to combat search engine spamming were to introduce the "nofollow" attribute. However, nofollow is heavily misused amoung webmasters so sometimes it's nice to spot these links without having to look in the source code.

9/8/2006

7
  • Currently 4.29/5 Stars
  • 1
  • 2
  • 3
  • 4
  • 5

Where these solutions were published first, and who did it I'm not sure of, but since there still are many that isn't aware of these solutions I thought it was worth mentiong they.

Firefox CSS rel="nofollow" for Web Developer Extension

If you are using the Firefox browser, and have installed the Web Developer Extension, save the code below in a CSS-file on your computer. Call the file ex. rel-nofollow.css.

  1. a[rel~="nofollow"]:after {
  2. content: "!";
  3. background-color: white !important;
  4. color: red !important;
  5. font-weight: bold !important;text-decoration: blink !important;
  6. }

Then click on the "CSS-button", chose "Add User Style Sheet", and choose the rel-nofollow.css file. You will now see a red, blinking exclamation mark after links which are using rel="nofollow".

Firefox CSS rel="nofollow" by editing userContent.css

This is the most preferred solution, and you don't have to have Web Developer Extension installed.

Put the CSS code above in the userContent.css file which should be found here:

C:\Documents and Settings\yourUserName\
Programdata\Mozilla\Firefox\Profiles\
someRandomCharachters.default\chrome\userContent.css

Make this file if it doesn't exist. The rel="nofollow" solution will now be functioning all the time, you don't have to choose the CSS file as in the previous example.

Remember that
C:\Documents and Settings\yourUserName\Programdata\
as default is "hidden".

Internet tools