Security → How to combat annoying ads using Firefox Add-ons?
Rating: 0
20 Aug 10 at 15:50
The situation with annoying ad banner that is displayed when visiting one of your favorite websites is familiar to everyone. It becomes the last straw between "I understand that a website must earn" and "How long will it last?" Sometimes the owners of the website provide a model without online advertising. But it happens very rarely and that's why we have to fight with the annoying advertising by ourselves.
Today I want to tell how to block the banners and advertising areas using the add-ons of Firefox.
First of all, we should install these useful additions. There are three additions of my adblock unit:
Once installed, the add-ons icons are appeared in the interface of Firefox:
When first running after installation of Adblock Plus you can directly subscribe to the blacklists:
As an example, we will consider popular website Habrahabr . During reading I noticed two advertising areas:
Let's start with the flash banner on the right. If you move the mouse cursor on the banner Adblock Plus adds button "Block":
Clicking this button will invoke the menu with filter suggestions that would be used for this and similar banners to be displayed. You can write yours variant:
Any of the images can be blocked, just right-click it and choose corresponding item of context menu:
It is more difficult to cope with a text block, because this is not an image and requires additional efforts.
First, we need to know which block of a code is responsible for the text displaying. If you understand a web programming, you can find the answer to this question in the code page. Otherwise DOM Inspector comes to the rescue. You can find it in the Tools menu bar:
Once DOM Inspector is run we click the button "Inspect" located in the upper right corner:
After clicking the same page as the one that we can see in the browser it will be rendered in the bottom edge of Inspector:
Then we click the arrow in the upper left corner to inspect a required unit:
Then we will click any place of the table with advertising except references:
The Inspector highlights in red selected area and moves to the string of the code that is responsible for showing it. Now move up the hierarchy of code by clicking the string of the code until the Inspector is highlighted the entire table:
When entire table will be in red box, we call a context menu at the found string and choose one of the options in the tab "Copy selector". You should focus an attention on it and choose something unique. If you simply selected "DIV", the whole page would be hidden.
After that you have to create a new style. To do this, click the icon Stylish in the lower left corner of the browser (not DOM Inspector, but browser) and select Manage Styles in the menu that appears:
Stylish window is opened and we will create a new style:
You have to specify a name (necessarily) and tags (optionally) for a new style:
You should specify namespaces (@ namespace url(http://www.w3.org/1999/xhtml);), as well as the domain in which this style will work (@-moz-document domain ("habrahabr.ru ")). If the domain is not specified, the style will be applied everywhere.
Then we enter data that you want to hide (.yandex-direct) and options to hide ((display: none!important;)). It is needed only to click the "Save" and it is done.
You can compare, before:
And after:
As regards the flash, it is used mainly for videos. In the vast majority of cases is advertising. And the most annoying ads it moves and flashes. So I created a rule for Adblock Plus, which blocks everything by the pattern "*.swf" and thus make a few exceptions - for youtube and several others video hosting services. It really helps.
