This short tutorial assumes that you have already downloaded and installed the Greasemonkey Firefox add-on. Below follows a very simple JavaScript program, which highlights links to your site, to get you started. I use this script a lot for SEO (Search Engine Optimization) purposes to find my site on a result page in Google, or to find a link to my site, which according to the access_log of my web site should be there.
First,
create an empty text file and rename it to link-highlighter.user.js. Open this file in an editor,
for example Textpad.
Copy and paste the JavaScript code below into the file, change the address "http://johnbokma.com" to your site's
location (twice), and save the modified file.
// ==UserScript==
// @name Link Highlighter
// @namespace http://johnbokma.com/firefox/greasemonkey/
// @description Highlights link(s) to location given in script
// @include *
// @exclude http://johnbokma.com*
// ==/UserScript==
var links = document.getElementsByTagName( 'a' );
var element;
for ( var i = 0; i < links.length; i++ ) {
element = links[ i ];
if ( element.href.indexOf( "http://johnbokma.com" ) == 0 ) {
element.style.color = "#ff0000";
element.style.backgroundColor = "#ffffcc";
}
}Drag and drop the JavaScript file you created into the Mozilla Firefox main window. Just above the contents a bar is displayed with the following text: "Greetings, fellow traveler. This is a Greasemonkey User Script. Click Install to start using it". Press the install button to the right of this message.
Next, visit a site that has a link to your site (you did replace "http://johnbokma.com" in the script with your site, did you?). If all worked well, it should be now much easier to spot those links:
Every time Firefox loads a page, Greasemonkey runs the JavaScript program given above. The program obtains all 'a' (anchor) elements. Next, it checks if the value of the href attribute starts with "http://johnbokma.com" (or whatever you changed this to). If this value starts with the given string, the indexOf method returns 0, and the color of the a element is set to red and the background to yellow by changing the style of the a element.
A thing to note is the exclude line, which turns off the script on the site(s) given. For my site I use http://johnbokma.com*. You can either list sites to exclude in the JavaScript program, or use the "Manage User Scripts" option in the "Tools" menu of Firefox.
Finally, clicking on the monkey icon in the status bar (right) will toggle Greasemonkey either off (gray) or on.
If you want to use the highlighting program with several sites, the easiest thing to do is to copy the if statement, up until and including the closing curly bracket (}) and change the value assigned to color, the value assigned to backgroundColor, or both.
If the JavaScript program doesn't work, either fall back to the given example, which should work, or open the JavaScript console (in the Tools menu). In the JavaScript console, click the Clear button, and reinstall the program. If the JavaScript program is causing an error, it should show up in the console.