Show Non PR Links Bookmarklet | January 21, 2005

After a brief discussion on a local mailing list this morning, I created a simple bookmarklet that will highlight links using Googles new rel="nofollow" comment spam prevention method.

Show Non PR Links

To install this bookmarklet, simply drag the link to your bookmarks/favourites bar. It’s been tested on Safari, Firefox and IE6 but should work on any modern browsers that support the DOM. If you want to test it out now, click on the bookmarklet and this link should highlight.

If you’re interested in how this bookmarklet was created, it’s very simple.

// grab all the links on the page
var links = document.getElementsByTagName('a');
// loop through all the links
for (i=0; i < links.length; i++){
  //check to see if the rel attribute is set to nofollow
  var theLink = links[i];
  if(theLink.getAttribute('rel') == 'nofollow'){
    // set the desired styles
    theLink.style.backgroundColor = 'red';
    theLink.style.color = 'white';
    theLink.style.fontWeight =  'bold';
    theLink.style.textDecoration = 'none';
  }
}

This code was then pasted into the Bookmarklet Crunchinator and spat out as a loverly bookmarklet.

Posted at January 21, 2005 12:53 AM

Comments

andrew1 said on January 21, 2005 2:01 AM

Very nice, Andy. I’ve been interested in seeing if people start using nofollow for other unexpected purposes that I normally wouldn’t catch, so I’ve just added something permanently into UserContent.css file (Firefox) that would make the links always stand out.

a[rel="nofollow"] { color: red !important; text-decoration: line-through !important; }

It’s actually quite surprised me how many people have started implementing it.

Justin Perkins said on January 21, 2005 2:26 AM

Nice one Andy, that’s a prety handy little bookmarklet. Being a hardcore Firefox user, I kinda like Andrew’s method little better. That way I don’t have to click on anything :)

mike said on January 21, 2005 3:20 AM

thanks a million. this tool will be invaluable to give to the younger guys i have working on link campaigns at work next week.

Jeff said on January 21, 2005 4:17 AM

That’s pretty useful. Thanks. I am also suprised on how fast this has caught on. Maybe I’ll make a WordPress plugin to do this? It could certainly be useful.

Julian said on January 21, 2005 9:09 AM

Couldn’t you once put more things in the “rel” attribute? What if it looks like rel="friend co-worker neighbor nofollow"?
Has anybody thought of that yet?

Paul Silver said on January 21, 2005 9:41 AM

Adding a user defined stylesheet did come up in the discussion, I asked Andy if he could make a scriptlet out of it because I don’t want to see red blocks around links all over the place, they only concern me when I’m interested in link building.

Thanks again Andy for doing the conversion.

P.J. Onori said on January 21, 2005 8:03 PM

Nice tool! It’ll be interesting to watch the growth of ‘nofollow’ tags over all the blogs I read.

Justin Perkins said on January 21, 2005 11:14 PM

Julian, you sure can put multiple values in the rel attribute…
http://www.w3.org/TR/REC-html40/…

I could see how a bookmarklet would be more desirable, if this nofollow thing becomes widely used. Until I start getting annoyed with red links all over the place, I’m going to stick with the user-defined stylesheet method. Gotta love Mozilla for that handy pseudo-class.

Joen said on January 24, 2005 10:29 PM

Very nice Andy, thanks for this!

It’ll be useful to see how nofollow spreads.

Chris Eigeman (a composite, anyhow) said on June 15, 2005 7:12 PM

That’s a nifty li’l tool there! I tried it out on some of the big boys and lo and behold, “nofollow” tags everywhere. And not just on comment pages. Then I tried it out on some of my favorite little blogs, and I didn’t see a single red box. The rich get richer and the poor get poorer. Feh.

Mathias said on August 28, 2005 1:13 PM

Here’s how I’d do it: Show non PR links.

Mathias said on August 28, 2005 1:14 PM

Okay, so your comment system ate my bookmarklet. Here’s the code.

javascript:(function(){function cE(element){if(typeof document.createElementNS!=’undefined’){return document.createElementNS(‘http://www.w3.org/1999/xhtml’,element);}if(typeof document.createElement!=’undefined’){return document.cE(element);}return false;};var css=document.getElementsByTagName(‘head’)0.appendChild(cE(‘link’));css.setAttribute(‘rel’,’stylesheet’);css.setAttribute(‘type’,’text/css’);css.setAttribute(‘href’,’data:text/css,a[rel~=”nofollow”]{border:thin dashed firebrick !important;background-color:#ffc8c8 !important;}’);})();