One of the cooler toys that I've been playing with lately is Greasemonkey. Greasemonkey is an add-on for Firefox that allows you to install custom scripts (written in JavaScript) that can manipulate or add functionality to web pages. There is an entire repository of scripts to check out at userscripts.org that do everything from removing annoying ads to adding incredibly beneficial functionality. User scripting allows you to customize any (and every, if you have the time) web page in pretty much any way that you want.

To get started in the world of Greasemonkey, you first need to install the Add-On. If all you're planning on doing is using scripts that other people have written, then that's all you need. However, if you're gonna get busy and make your own, you'll need a few more components. For anybody that is doing any kind of Javascript developing for the Web, there really is no tool more powerful than Firebug, and writing Greasemonkey scripts is no exception. It offers an easy way to debug your scripts, and also allows you to gather a lot of information about a page in a very intuitive way. 

The other tool that you're going to need is a text editor. Personally, I like Notepad++, but you can really use anything. I won't go into all the details of why I like that particular program. I'll save that for another post. Suffice it to say, if you're going to be editing much code, it's nice to have the features of a text editor that is geared towards that purpose. 

Now you're all set up for writing your own Greasemonkey scripts. The combination of a good text editor and Firebug allows you to develop Javascript with almost as much ease as if you were using a full IDE. One thing to remember before I sign off is that because of the way Greasemonkey accesses the page, scripts are afforded a lot more trust than regular embedded Javascript. What this boils down to is that if you are using other people's scripts, you need to be more careful about where they are coming from. Look for scripts with lots of comments and lots of downloads, signifying that there has been plenty of time for anything subversive to have been discovered. If you are writing your own scripts, even if you have loads of experience with Javascript, you need to pay extra attention to a few details about the Greasemonkey environment. Check out this post for an example, and then the security information on the Greasemonkey wiki (also, just in case you missed it at the top of the wiki, this page should be required reading for anyone writing Greasemonkey scripts). 

I'll include a few links here to some resources, and in my next post I'll introduce you to a script that I wrote, and talk a bit about the Gmail Greasemonkey API. 

• GreasSpot Wiki - A good place to start.
  
• Userscripts.org - I mentioned it earlier, but I thought I'd throw it in down here as well.
• Gmail and Google Apps Sidebar Remover - A script I wrote that gets rid of the ads in Gmail.

My last post provided an introduction to Greasemonkey. This one will show you the main components of a Greasemonkey script, as well as introduce you to the Gmail Greasemonkey API.

Purpose

The script I'll be working with today is one that I wrote for Gmail to get rid of the annoying ads that always take up a good portion of the window when i'm trying to read my email. I very cleverly named it 'Gmail and Google Apps Sidebar Remover'. If you haven't yet installed it, you can do so by clicking that link, or you can simply download the source and follow along. 

Planning

There are two main things that I needed to take into consideration when I started this script. The first is that although I strictly use Google Apps, if I wanted my script to target a larger user base, I would need to make sure it was compatible with all versions of Gmail. The second issue is that just above the advertisements, there are a few links that add functionality to the current open conversation. Because of those links, if I had simply removed the Ads, the email would have stayed the same width. The only change would have been a giant white space to the right. To accomplish this task, I decided first to determine which Gmail implementation was currently being used, and then move those links over to the left hand side, just below the navigation menu. Once they were out of the way, it was just a matter of removing the ads and adjusting the width of the conversation element.

The Script

The first thing you'll notice when looking at the script is the metadata at the top:

My last post was written as an introduction to the Greasemonkey API from Gmail. Its intent was to introduce wouldbe greasemonkey scripters to the various methods that are available in the API. It has recently come to my attention, however, that not everybody is interested in writing their own scripts. Perhaps, in fact, I am a member of the minority.  *gasp*

So. This post will be a simple rundown on how to install my Ad-Removing script, for those that aren't interested in how it works:

1- Get Firefox.

2- Install the Greasemonkey Add-On.

3- If you are using Gmail, install this script.  If you are using Google Apps, install this script.

4- Refresh Gmail/Google Apps.

And that's all there is to it. Lately there have been periodic changes in the way Gmail sets up their pages. I'm usually pretty quick to update the script, so if something starts looking weird, come back here, or head over to userscripts.org (links to follow) and re-install the script.

As a sidenote, while you're at userscripts.org check out some of the other scripts that are available from other users. There is a huge quantity of scripts there that do a lot of helpful things, and once you have Greasemonkey installed, it is a simple thing to add new scripts. Just do a search for the page that you're interested in modifying, or the action you want it to do (ie: remove facebook ads), and likely somebody has written a script for that purpose. Just be careful, as the big red banner at the top of every script page says, if you're installing a script that is new. I would go as far as to say that if you're not familiar with scripting, you shouldn't install a script if less than a couple hundred people have installed it. Also check out the comments to see what other users have said about it. And that's a wrap, as they say. Enjoy my script, and check out some others while you are at it. 

My pages on userscripts.org:

The Gmail Script

The Google Apps Script 

Google Chrome has a lot of potential as a browser, and the semi-recent addition of userscript support has seen it fulfill even more of its potential. In this post I’ll quickly explain how to add userscripts to Google Chrome.