How to use Firebug

vrijvlinder

Firebug is a browser extension that allows you to edit live on the site and also to check for errors. It is an indispensable free tool that everyone must learn to employ.

I like this tool so much that it is virtually all I use to make and edit themes. Once you get the hang of it you will ask yourself why you did not use it sooner.

Here are a few videos that will help you learn how to make the best of this excellent tool.

http://www.youtube.com/watch?annotation_id=annotation_619736&feature=iv&src_vid=hqVUgioSMUo&v=6eTW8-C6_gk

http://www.youtube.com/watch?v=hqVUgioSMUo

Srggamer

haha Use it all the time!

vrijvlinder

here is more help on how to use

http://www.w3resource.com/web-development-tools/firebug-tutorials.php

lifeisfoo

Personally I prefer Chrome inspector. Currently I'm using Safari inspector and seems to be also real powerful.

peregrine

piggyback here!

http://vanillaforums.org/discussion/20231/how-to-become-somewhat-adept-at-modifying-vanilla-to-meet-your-needs-for-free

vrijvlinder

Yes anything is good , people must get their hands on this and use it. Post links to these alternatives please

phreak

Great vrijvlinder, it's an important tool for every webdev! Also Chrome features a good Developer console... but @all... stay with Firefox.

hbf

i prefer chrome myself.

peregrine

I use them both. I find Chrome is easier to find 404 issues, lost images, js not loading and firebug is easier with basic elements and css. So use the tool that best suits your objective.

vrijvlinder

Yes , I noticed that firebug is different on safari than firefox. They vary in advantages so sometimes I use both at the same time. I do prefer the one on safari because it shows me precisely all you have mentioned. 404 issues and js files not loaded or other asset problems. It works a bit faster that on firefox and allows for easier use in my opinion, but that may be from habit.

The moral to this is that I use it , you use it , we all use it , and we all scream for everyone to use it (or anything like it)

viceview51

@vrijvlinder are there any specific advantages in using Firebug instead of Firefox Inspector?

At the moment I'm using it only to edit CSS styles.

hgtonight

@viceview51 Simply put, FireBug offers more in-depth tools for web development compared to the inspector.

That said, knowing how to use your tools is more important than which tools you use.

Firefox inspector is more than adequate for live editing CSS.

vrijvlinder

@viceview51 said:
vrijvlinder are there any specific advantages in using Firebug instead of Firefox Inspector?

At the moment I'm using it only to edit CSS styles.

There are many inspectors available , the one with the most options is the best . It also differs from browser to browser. I do all my work on Safari and use firebug and all the other tools that safari has to offer. Then I use the other browsers to test my work. The firebug on firefox has it's good things like the color swatches when you hover over a hex color code. in Safari you get a little tiny square next to the color code. In firefox only when you hover but it is a bigger swatch.

In Safari all the panels are accessible easily and with less styling clutter, much like the inspector for chrome on the mac.

I think you need to try them all to find the one you prefer . But all will certainly be helpful.

@hgtonight said:
That said, knowing how to use your tools is more important than which tools you use.

Very true

sudden156

As Opera is my main browser, I use Dragonfly, which I think is very good:

http://www.opera.com/dragonfly/