MLNTN

Google Chrome’s extension gallery opened December 8th and the race to create extensions is on.

I browsed through the gallery, looking for anything that might be useful to me and my normal browsing experience. I found a couple good ones: Google Alerter, RSS Subscription Extension and Docs PDF/PowerPoint Viewer (by Google).

I searched for a Facebook ad blocker, but the one I found only blocked profile ads – not very useful. So I tried writing my own and found that it was much simpler than I expected.

There were really only two files that I needed to create: manifest.json (a manifest file that tells Google Chrome important info about your extension) and facebook.css (a content script that hides the ads using CSS, obviously).

The manifest.json file looks like this:

I used Chrome’s Developer Tools (Ctrl-Shift-I or Page menu > Developer > Developer Tools) to find good CSS rules for blocking the sponsored ads on the homepage, profile page and app pages. I also had to fix the profile page, which broke when I hid the ad sidebar there. Here’s what facebook.css looks like:

After saving the two files to an empty directory, I opened chrome://extensions in Chrome. Under “Developer mode”, I hit the Load unpacked extension… button and navigated to that directory. Chrome added the plugin and I could refresh it if I needed to make a change to the CSS or manifest.json file.

After everything was tested and working, I packed the extension and was done. Overall, I think the whole process took about 15 minutes, but most of that was looking at documentation.

Here’s the extension, if you want to play around with it.