jQuery Topics

10 Extension Plugins to Extend the Firebug Console

To say that Firebug is just a web developing tool would do it injustice, it is much more than that. It houses a powerful suite of tools for debugging and optimizing CSS, JavaScript, HTML and thoroughly speeds up your web development.

A great thing about Firebug is it gives you the option to add extra extensions and make it that even more indispensable, you can tailor it and mold it to your needs. In this article, we’ve listed 10 Extension Plugins of our favorites.

1. Pixel Perfect


A useful extension that allows web developers and designers to easily overlay a web composition over the top of the developed HTML.
Pixel-Perfect.jpg
Source

2. CodeBurner – Reference Tool for Web Developers


A suite of tools for web developers, that provides reference material for HTML and CSS, integrated with a range of popular development environments.
CodeBurner-–-Reference-Tool-for-Web-Developers1.jpg
Source

3. SenSEO


Analyzes web pages and tells you how good they fulfill on-page Search Engine optimization criteria. SenSEO gives you an overview of SEO-important web page components; in-depth analysis of on-page SEO criteria’s and offers the correct usage of Document-Title, Meta-Description and Meta-Keywords.
SenSEO.jpg
Source

4. Inline Code Finder


A tool to traverse through all of the elements in a web page, and when it finds an HTML element with any of these, it will highlight them: Inline JavaScript events, Inline style and JavaScript links.
Inline-Code-Finder.jpg
Source

5. Firepath – Edit, Inspect and Generate XPath Expressions


A Firebug extension that adds a development tool to edit, inspect and generate XPath expressions. With this extension you can edit with auto-completion (using TAB or up and down arrows), you can also evaluate the expression on HTML or any XML documents and display the resulting evaluations in a Firebug-like DOM tree.
Firepath-–-Edit-Inspect-and-Generate-XPath-Expressions.jpg
Source

6. Firepicker – Color Picker


Adds a small color picker dialog when editing CSS rules in Firebug.
Firepicker-–-Color-Picker.jpg
Source

7. Firesymfony


A port of the Symfony Web Debug Toolbar as a Firebug extension. Besides the normal functionality of the Symfony Toolbar, it adds new features, like Database Query, One Click copy to clipboard, or Mouse Over Partial and Component Cache Highlighting.
Firesymfony.jpg
Source

8. FireAtlas – Asp.net Debugging


This extension will provide you with these useful services when developing ASP.NET AJAX web sites: PageRequestManager events tracing; WebService calls tracing and inspection; Partial Update inspection within Firebug Net Panel; Application components listing.
FireAtlas-–-Aspnet-Debugging.jpg
Source

9. Drupal for Firebug


Extends the Firebug module to provide Drupal specific debugging and status messages. It allows users to see the processing of the node, form, and user objects and works with the Devel module to display SQL queries and execute PHP from the Firebug window.
Drupal-for-Firebug1.jpg
Source

10. FirePHP for AJAX Development


Enables you to log to your Firebug Console using a simple PHP method call. All data is sent via response headers and will not interfere with the content on your page.
FirePHP-for-AJAX-Development.jpg
Source

Read the full/original article at jQuery4u

    Related Posts

    Comments are closed.

    jQuery Resources

    Learn more about jQuery

    jQuery News & Links

    I only just found out that the jQuery validation plugins has a validation rule called “remote” which can be used ...

    jQuery function to check if horizontal scroll is present – hasHScrollBar() – (or vertical check below also, util function to ...

    jQuery function to Set any DOM Element to Top View (bring to front) using CSS Z-Index property.

    Is it possible to declare arrays in JavaScript object literal notation? Example 1 – this works with arrays Declaration: Storage ...

    To get the a variables type using jQuery there is a jQuery function called .type() which returns “array”, “string”, “number”, ...

    In this post you can find tutorials which explain step by step different API use cases with jQuery like Google ...

    For valuable work on creation of sites you need a good comfortable editor necessarily. There are many requiring paid products ...

    Today we are sharing with you a collection of awesome jQuery Camera Photo plugins. They offer a range of image ...

    Back in the day, if you saw something that was animated on a website it was automatically assumed to be ...

    In this post, we have compiled a list of 10 jQuery HTML5 Audio players available today, most allow native audio ...

    jQuery Mobile is a powerful framework for making mobile web applications. But can we use it to convert existing desktop ...

    I have jotted a quick post on a Basic JavaScript Regular Expression Example to give beginners out there a taste ...

    In April 2012′s edition of Interestingly Random JavaScript, jQuery and Web Development we bring you some very cool stuff such ...

    In this post we are sharing you a roundup of 10 really jQuery plugins as of today. Pretty cool plugins ...

    As always expected from the jQuery community, the compilation we have for you today are some good and impressive recently ...

    A collection of jQuery PNG/JPEG/GIF plugins that enables image animation, cartoon-like background, etc… let them help you design displays for ...

    A collection of JavaScript/jQuery Zip/File/Compressor plugins that allows you to minify your JS code and compress your JS files ready ...

    Quick jQuery code snippet on how to keep an element in view. For demo scroll down on any page on ...

    Here is what I think is the best and most reliable way to load jQuery library and jQuery UI Libraries. ...

    jQuery code snippet which outputs all attributes of element using the default .attr() function on any dom element(s). usage: output:

    More Links & News

    Community Resources

    Use jQuery and the Google Maps API to create your own map application.

    Super cool and easy way to get stylish tooltips with jQuery.

    The right way to include the jQuery library in WordPress.

    Share a resource