Image related to this topic...

Blocking Flash ads in Mozilla

Boy, are those animated Flash banner ads annoying or what. Not only do they distract you from the real content on the page they also load a plugin and thereby end up taking away memory that other applications could have used. And it is not as if Mozilla doesn't use memory enough on it's own already. There is of course the Adblock plugin from Mozdev, but I'm not quite sure it blocks Flash ads at the moment. Update: AdBlock now does a very fine job of blocking flash ads. I've switched to AdBlock...

Creating a neat little text file can put an end to most of those annoying Flash banners that you cannot block like the images, becuase the Flash plugin takes over the input from the mouse and the keyboard. Here I'll show you how.

The text file and it's location

You can modify the looks of your Mozilla down to the tiniest detail with CSS and the like. In your profile directory you will find a directory called chrome inwhich the looks of Mozilla is controlled. [Note: You can find the location of your profile directory by selecting Preferences and then under Advanced->Cache]

In the file userChome.css you can change the font that is used for menus, toolbars and the like in all the Mozilla applications. I have found that very useful under Linux, where the default font often turns out to be some silly serif font, which is hard to read on the screen and also looks silly when all the other applications use the same font. The file itself is just a regular stylesheet file as used on the web.

The same directory might also contain some of the installed themes.

The blocking itself

Now, let's get down to the core. To make Mozilla block certain types of content create a file called userContent.css in the chrome directory. You can download the file I use (Right-click, save as), which is a slightly modified version of one I found at Belgian MakeITWork: Mozilla Ad-Blocking.

The contents of the file is something like this:

embed[type="application/x-shockwave-flash"][width="125"][height="125"]
{
  display: none !important;
  visibility: hidden !important;
}

The important thing here is that a width and a height is specified. This is done, because I still want normal Flash content to be showed. If you don't want Flash at all you should consider removing the plugin instead.

Notice that with the above setting, the Flash ad is still downloaded and saved in the cache. This is good for the web site, which still believes you saw the ad, but of course not so good for you who wasted the bandwidth. At the moment, I am not aware of a way to not only hide them but also disable the downloading.

It is of course also useful to block other sizes of flash ads. This is done by simply copying the code and then just changing the width and the height to some new values. Like this:

embed[type="application/x-shockwave-flash"][width="468"][height="60"]
{
  display: none !important;
  visibility: hidden !important;
}

Blocking certain image sizes

With this you can hide all the images with the standard banner size 468*60:

img[width="468"][height="60"]
{
  display: none !important;
  visibility: hidden!important;
}

You can also have images from a certain server hidden:

img[href="ad.doubleclick*"]
{
  display: none !important;
  visibility: hidden!important;
}

You can do the same as above by right-clicking a banner and choosing "Block Images from Server." It's just too bad when the websites have normal graphics and advertisements on the same server. But then the size querying comes in handy as shown above.

Summary

Thanks to Paul Kowalski for sending some nice enhancements to the style sheet. His additions can be found in the newest userContent.css.

The old version has been renamed userContent-0.1.css.

The original MakeITWork version of userContent.css that I found on a page they had about Mozilla Ad Blocking

Read more at mozilla.org

Customizing Mozilla