How to highlight links marked NOFOLLOW using Firefox |
If you use the Firefox browser and would like to be able to identify what links on websites you look at are using NOFOLLOW, then the following quick Firefox userContent.css hack will help. It will turn links marked with NOFOLLOW to red with white text. You can change the colors to whatever you want, make the links even bigger, whatever you want. Along the right TechCrunch comments area pictured shows the highlighted NOFOLLOW comment links.
This will make it easier to spot what sites are using NOFOLLOW and what sites aren’t. Keep in mind in some cases the webmasters might not even realize they are using it as it is the default behavior of some popular blog programs like Wordpress. One of my friends had NOFOLLOW enabled and when I told him what it was about, he immediately installed the DOFOLLOW plugin. It’s way too easy to setup a new blog with Wordpress and forget about adding the DOFOLLOW. The group blog I participate to had NOFOLLOW in play, but I fixed that this morning. Disclaimer: I still have NOFOLLOW in play on a couple less updated and moderated blogs I contribute to like my Wordpress plugins/mods blog. I’m not completely anti-NOFOLLOW on blog comment areas, it really just depends on how closely the blog is being monitored for spam.
Wondering what NOFOLLOW is about?
NOFOLLOW was intended to be an anti-spam tool for webmasters as the major search engines do not follow links with NOFOLLOW but to date it’s been largely ineffective at combating spam. For a more detailed discussion of the politics surrounding NOFOLLOW as well as my personal feelings in detail on the subject, try reading these past posts (the first one is a Hmmcast video where I talk about it, if you’d rather see and hear what I have to say on the matter):
Februrary 12, 2007: Hmmcast #60 - Why NOFOLLOW continues to be against the spirit of the web
December 13, 2006: The FTC and somebody please give me something positive to write about Sony
September 28, 2005: Debating what is/isn’t spam in the comment sections
September 26, 2005: TypePad offers tip jar feature, still forcing rel=nofollow on all comments?
March 15, 2005: Disabling nofollow in Wordpress 1.5
Jan 22, 2005: Google responds to my nofollow concerns
Jan 19, 2005: Treating all commenters like spammers is a slippery slope
Jan 15, 2005: No Google juice for nofollow attribute, will this negatively impact legitimate comment activity?
Again, by default if you are using programs like Wordpress 2.2x or lower you are using NOFOLLOW. There is no way to disable it in the admin area, you need to use one of the Wordpress DOFOLLOW plugins out there. When I switched over Hmm from the previous blog system to Wordpress getting rid of the NOFOLLOW was one of the first changes I made.
Andy Beard has a nice roundup of dofollow plugins and tools. He also started a DOFOLLOW community at Bumpzee where you can add your blog(s) that use DOFOLLOW for comments and trackbacks. I’ve added MakeYouGoHmm to the list.
Step-by-step how to highlight sites using NOFOLLOW
STEP 1. Navigate to the chrome directory inside your Firefox profile section and rename the userContent-example.css file to userContent.css. Below is where to find this file in Windows and Mac
Windows
Documents and Settings -> USERNAME -> Application Data -> Mozilla -> Firefox -> Profiles -> NUMBERS.default -> chrome
Mac
/Library/Application Support/Firefox/Profiles/NUMBERS.default
Need more help locating this file? See the official Mozilla Edit Configuration Files page.
STEP 2. Add the following code to the top of the userContent.css file, slight modification of Phillip’s code offered and explained here:
* code reference:
* http://blogoscoped.com/archive/2005-01-19-n34.html
*/
a[rel="nofollow"]
{
background-color: red !important;
color: white !important;
font-weight: bold !important;
text-decoration: none !important;
}
a[rel="external nofollow"]
{
background-color: red !important;
color: white !important;
font-weight: bold !important;
text-decoration: none !important;
}
STEP 3. Save your edited userContent.css and watch for links in pages that are marked with nofollow.
Here’s an example NOFOLLOW link to Wikipedia. Since Wikipedia chose to add NOFOLLOW to all external links from their service, I’d encourage other bloggers to add NOFOLLOW to any Wikipedia link, if you even link them at all. I’ve been trying to link Encyclopedia Britannica instead. I also filtered Wikipedia from my search results in Firefox using the excellent Customize Google plugin.
Extreme? Perhaps, but so is adding NOFOLLOW to every link in every article. With the userContent.css hack described in this post, you’ll be able to spot other publications on the web who are sharing the love, trying to keep it all to themselves or don’t even realize how their external links are being formatted.
Did this post make you go hmm?
(4 votes, average: 4 out of 5)
Loading ...Maybe Related Posts (plugin generated)
- How to build a Google subscribed link for your about/bio page step by step
- Help fixing float right CSS problem in IE7 and Opera
- Chrome attempts to move browser market forward, a noble goal
- How to add Sphere It function based on number of words in post
- Batch convert, compress and resize BMP to JPG
- Helpful security, recovery and protection-related Firefox extensions
Thanks for the link love for my plugins list and the community on Bumpzee, and welcome…
There are 2 other less geeky Firefox extensions you can use for highlighting nofollow links
Search Status
SEO For Firefox
As a rule I prefer the pink highlighting from Search Status over the red from SEO for Firefox
I am not totally against nofollow either, and use it to channel link juice around my blogs. Even my most dormant blogs are using Dofollow, because Spam Karma handles comment spam on old content so well.
Comment by Andy Beard — August 16, 2007 @ 10:21 am PST
Thank Andy.
I’m using Search Status 1.20 and don’t see the option there for adding a similar function. Phillip mentions a way to do it with another plugin but it has to be invoked on each page which is a hassle. Will have to poke around for a newer version of Search Status. Technically a plugin wouldn’t be the best way to do this (more overhead in what already is a bit of a memory hound), but, yes, less geekier
You can make whatever CSS you want in the hack above too for those links, pink, red, blue, larger size, whatever which should be handy too for those who want to choose different colors.
Comment by TDavid — August 16, 2007 @ 10:36 am PST
On search status, there is an “@” like mark that is actually a “q” with a long tail
Right click and it is the 4th option down.
Using search status has the benefit of boosting Alexa scores a little so always a good adition anyway for bloggers looking at monetization with various services.
Supporting its use is a good way for a blogger to boost their Alexa ratings with little effort, as long as it is done in context
Comment by Andy Beard — August 16, 2007 @ 10:46 am PST
Ahh, I was looking in options, not the context menu. Cool, thanks.
Personally I don’t care that much about Alexa rank, their statistics are a sham, but I can see how others might be interested in that. I do like being able to see the PageRank, which is the reason I’ve been using that plugin. I could take or leave the compete stats. I’d rather have less memory consumption than a bunch of features I don’t need or use.
Comment by TDavid — August 16, 2007 @ 10:51 am PST
Great article, but I reluctantly agree with Wikipedia’s policy of adding nofollow to their links. It’s one of the largest websites in the world and is directly editable by its users. Disabling nofollow, in my opinion, would be a *huge* invitation for spam on every page.
Comment by sam sanders — August 16, 2007 @ 12:15 pm PST
Sam - I’d agree with their policy too if only they weren’t well known for the speed of page reverts and the huge amount of people they have moderating the pages. They have one of the best community moderated sites in the world and are well known for how brutal they can be with changes (especially spammy links being added to articles). How long do you think it takes for a link changed to a spammy link on an article gets reverted? Not very long. Also, they are creating a situation where the world uses them as the source and not the sources they link to (the search engines will rate the Wikipedia piece higher than the sources), it’s the roach motel effect and opposite of how NOFOLLOW was intended to be used by all the main search engines. Before I started filtering Wikipedia results I’d often see them high on Google for articles which were nothing more than rewrites of source material that was better. Who ranked higher? Wikipedia.
Comment by TDavid — August 16, 2007 @ 12:40 pm PST
Great tips, but I could not get that CSS file to work. ITs not in that location. It seems to be in the Program Files directory. Forget about it… Got Firefox 2.0.0.6
GOt the Search Status plugin to work. ITs the best solution. Follow Andy Beards tips above!!
Wondering if IE has a solution plugin like search status…
Boris
Comment by ecoBoris — September 10, 2007 @ 5:41 pm PST
A nice write up, but I have to agree that the Search Status plugin is the way to go. Although you can’t control the colour, you can easily turn the highlight nofollow feature on or off very quickly, and it gives you a bunch of other useful stuff (besides Alexa).
Comment by Stephen Cronin — September 19, 2007 @ 12:57 am PST
Get Firefox to highlight nofollow links
If you don’t know what nofollow links are, you probably don’t need to know but for those that do here is how to easily get Firefox to highlight rel=”nofollow” and rel=”external nofollow” links.
It had never occurred …
Trackback by Musings & Rants — November 15, 2007 @ 4:50 am PST
I am renaming it userContent.css but when it asks to save the edited changes it says save to userContent.css.css. I tried renaming it to just userContent to see if that would help but it didn’t. I’m using Vista…please comment back on this and help me My steps) Program Files -> Mozilla Firefox -> defaults -> profile -> chrome -> editing to userContent, pasting it in..not working…am I doing it wrong? I had it working on another computer but its XP. Thank you
Comment by Matt — December 15, 2007 @ 3:02 pm PST
Matt - open up windows explorer directly and make sure extensions are showing and the file should be saved as: userContent.css
I’m using Vista here, it works fine.
Comment by TDavid — December 15, 2007 @ 5:07 pm PST
yeah, youre right some bloggers dont realise that the nofollow is enabled! i totally dont agree with this nofollow thing.
Comment by xiela — February 21, 2008 @ 7:05 pm PST
hello! i would like to add that i just use the mozilla firefox right click-> properties-> and the display window will tell you if its a do follow then ” external” and if its a nofollow then it will tell “external nofollow.
nice tutorial !!
Comment by reena — April 25, 2008 @ 8:59 am PST
Thanks for the great tip. I was looking for a plugin but this is better.
Comment by Dave Toys — May 4, 2008 @ 10:59 am PST
Thank you so much for this. I didn’t use it the way you described it, but I have SEO for Firefox, and DIDN’T KNOW IT DID THIS!! The red links were driving me mad! Now I know I just have to turn off SEOFF when I’m not using it.
NO other place I looked described why this was happening. Thankyou for my sanity!
Leslie
Comment by Leslie — May 22, 2008 @ 7:23 am PST
Thanks, very helpful information. Got rid of the addons I had which came with other features and now just have something that does the job in showing nofollow links. Would be great to have an addons which highlighted JavaScript too and also websites like digg which do nofollow links but with different css.
Thanks,
Dan
Comment by Daniel Murray — July 13, 2008 @ 10:55 am PST
They have one of the best community moderated sites in the world and are well known for how brutal they can be with changes (especially spammy links being added to articles). How long do you think it takes for a link changed to a spammy link on an article gets reverted? Not very long. Also, they are creating a situation where the world uses them as the source and not the sources they link to (the search engines will rate the Wikipedia piece higher than the sources), it’s the roach motel effect and opposite of how NOFOLLOW was intended to be used by all the main search engines. Before I started filtering Wikipedia results I’d often see them high on Google for articles which were nothing more than rewrites of source material that was better. Who ranked higher? Wikipedia.
Comment by ankara nakliyat — July 16, 2008 @ 2:30 am PST
Thank you for sharing this very useful tip, I will download firefox and install the code.
Comment by Toronto Developer — August 10, 2008 @ 10:11 pm PST
Long live the dofollow community! From my own experience it has boosted the volume of blog traffic enormously, it’s like handing back a little bit of love for paying a blog a little attention.
Comment by flay — September 11, 2008 @ 1:46 am PST
There is another way use mozilla addon, download it here
https://addons.mozilla.org/en-US/firefox/addon/321
It can display PR, Alexa Rank, keyword/nofollow highlighting, backward/related links, Alexa info.
Another one
https://addons.mozilla.org/en-US/firefox/addon/5687
highlight links in a page according to / dofollow status.
Comment by Alex — November 12, 2008 @ 9:57 pm PST
Excellent.. I was finally able to edit chromeeditplus after going through this detailed tutorial..
Comment by Jack — January 13, 2009 @ 3:19 am PST
I installed the code a few months ago. I changed the color to a nice grey rather than the red. I couldn’t live without it now
Comment by Roller Blinds — January 21, 2009 @ 8:56 pm PST
[…] got the firefox hack which makes links glow pink when they’ve got nofollow on […]
Pingback by Why would you use in password protected areas? — May 28, 2009 @ 3:35 am PST