Everybody knows that Firefox has add-ons for virtually everything, but if you don’t want to bloat your installation you’ve always got the option of Greasemonkey scripts instead. Here’s a quick primer on how to use them.

Getting Started with User Scripts

Once you have Greasemonkey installed, managing the extension is really easy. Left click on the status bar icon to turn the extension on/off and right click to access the context menu shown here.

Whether you use the Options button in the Add-ons Manager Window or the context menu shown above, both will bring up the Manage User Scripts dialog. At the moment you have a nice clean slate to work with… time to get some scripts added in.

Continue Reading ->

Filed under: Developer, Mozilla, Browsers

When it comes to making web pages, I can whip up a rounded div or add a splash of gradient for a nice fade effect successfully with little trouble, but like many, when trying to deduce out why some stupid DIV is misbehaving, I can waste an entire day spinning my wheels.

Checking out the various blogs and forums are of course a great resource, but probably my most useful and productive help comes courtesy of my favorite Firefox add-ons.

Like many, I have Firebug, Greasemonkey, IEView, and the like at my disposal, but here’s a list of what I would consider five lesser-spoken but certainly “must have” additions to any web developer’s little bag of tricks.

• View Source Chart – I’m sure some might disagree on this, but aside from simple DOM structure, for me, trying to mentally visualize HTML boundaries can be really freaking hard, even if the code is well formatted. To make the job easier, View Source Chart is a godsend. When run, it blocks off boundaries, color codes them, and presents everything in lightning speed no matter how munged up the code is! Also, as an added bonus, you can take advantage of the built-in Ctrl + and – zooming features to help decoding even the most complex nested DOM structures. Indeed, when it comes to navigating HTML source, View Source Chart further proves that a picture is worth a thousand words.

Are you looking for a quick and simple way to view the contents of the cache in Firefox? Then you will definitely want to see how easy it can be using the CacheViewer extension.

Note: CacheViewer is a front-end app for easily accessing and searching the memory cache.

Before

Viewing the cache in Firefox using “about:cache” provides some information about the contents but may not be the most efficient method available for some people.

CacheViewer in Action Continue Reading ->

Anyone who has used Opera will be familiar with the information presented for the webpage that is currently loading in the browser (i.e. number of images loaded). If you would like to have that same functionality in Firefox then join us as we look at the Extended Statusbar extension.

Before

Here is the default setup for Firefox…not a lot of information available to indicate exactly how much of the webpage has already loaded versus what has not. For some people this is enough but what if you like more details?

Extended Statusbar in Action Continue Reading ->