All posts tagged ‘extension’

File Under: Uncategorized

How to Update Extensions to Firefox 3

FirefoxIf you’re a Firefox extension developer who hasn’t made the switch to Firefox 3, Mozilla wants you to know what you need to change. On the other hand, if you have a favorite extension stuck in Firefox 2, you might pass this article along to its developer: Mozilla’s instructions for updating extensions for Firefox 3.

There were a number of changes between Firefox 2 and 3. The largest changes are outlined in the document, which include:

  • Bookmarks and history – major changes, now uses Places API
  • Anything using menus – heavily modified
  • Download manager – now uses Storage API
  • Password manager – now uses Login Manager API

Extensions that don’t utilize above areas of the code may still need tweaks, but may not require major rewrites. You may even get lucky and just need to change the maxVersion of your extension. If Mozilla hosts the extension for you, then you won’t even need to change anything in the extension itself. Just login to the addons site and use the Developer Control Panel to make your maxVersion 3.0.*.

See also:

File Under: Software & Tools

The 5 Best Firebug Extensions

The popular Firefox web development extension Firebug does some pretty cool stuff out of the box: Debug JavaScript, tweak the CSS, and see all the network traffic.

Firebug extensions are a sort of meta-extension that lets you add on to Firebug. Developers are adding some features that we’re starting to find hard to live without.

Here we’ll lay out our five faves.

1. YSlow

YSlow performance results

We’ve written about YSlow before. It measures your site’s speed against Yahoo’s rules for high-performance websites. It generates a little report card that analyzes your page’s events and components, pointing out which pieces of the page are causing the most problems.

It’s worth a glimpse into YSlow from time to time, even if you feel like your site is performing well. You may still find improvements to make, and if not, at least you’ll pat yourself on the back with your good score.

Download YSlow

2. Firecookie

Firecookie shows list of cookies in Firebug

Firecookie shows all the cookies being accessed by the current web page. You can see when one has been changed, and you can alter your cookie settings for accepting or denying cookies right from the Firebug panel.

I like the cookie access in Firefox 3′s new Page Info screen, but pairing cookies with Firebug just makes sense. One of the best things about Firebug extensions is that they can bring all your debugging to one place.

Download Firecookie

3. FirePHP

FirePHP: PHP debugging in Firebug

Speaking of bringing all your debugging to one place, I never would have imagined I needed FirePHP, but now I love it. It brings PHP debugging into Firebug using special “X-FirePHP-Data” headers that are invisible in the browser. FirePHP requires a PHP library to send the debugging messages.

There’s a similar extension for Cold Fusion called ColdFire. We haven’t tried it, and they aren’t listed on the Firefox extension site, so proceed with caution.

Really, there’s no need to have a different extension for each programming language. I’d rather see a standard, language-agnostic version. Then, any language could send header data to Firebug.

Download FirePHP

4. Pixel Perfect

Pixel Perfect help you be just that

Okay designers, this one’s for you. Pixel Perfect helps you create designs that are just right. You can overlap a partially transparent mockup above your actual web page. Then use Firebug’s standard CSS controls to find just the right settings to make the design pixel-perfect.

Download Pixel Perfect

5. Rainbow

Rainbow adds colors to your code

First a warning: Some people have experienced problems with Firebug when using this extension. It’s worked fine for me.

The aptly named Rainbow color-codes your code. For example, JavaScript variables are green, reserved words are blue. The coloring is sure useful when you have hundreds of lines to read.

Download Rainbow

If you’re interested in more Firebug extensions, Jan Odvarko keeps a list of them. Of course, you could also write your own Firebug extension.

See also:

How to Create a Firebug Extension

Hello World Firebug extension

Are you as obsessed with Firebug as we are? The Firefox extension helps developers and designers sort out errors in JavaScript and CSS.

You can add features to Firebug by creating a special kind of Firefox extension. Around Webmonkey we’re calling them meta-extensions and we wrote about adding YSlow to Firebug recently.

Firebug contributor Jan Odvarko has written a tutorial to give you a jump start extending Firebug. Like Firefox extensions, Firebug extensions are written in XUL (an XML user interface markup language) and JavaScript. Once you’ve mastered Jan’s hello world example, you’ll want to check out all of his Firebug tutorials.

See also: