Super User is a question and answer site for computer enthusiasts and power users. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I am writing a web site in php and the HTML it renders is not well formatted and hard to read in Firefox (most of it is on a single line)

I dont want to mess up my php code by adding loads of white space formatting stuff so I was wondering if there is there an option or perhaps an add-on to Firefox that will give me the ability me to view the source indented according to the HTML's structure

share|improve this question
Note that recent versions of Firefox (I think it was since 4, confirmed for 10+) come with the ability to do syntax highlighting and word wrapping under the View menu of the source window. Just right click => View Page Source to open this window. – Bob Aug 1 '12 at 13:05
up vote 8 down vote accepted

View Source Chart 2.7

Works just fine, install the extension from here :

Right click -> View source chart

This is what I get for the Google home page HTML source:


alt text


alt text

share|improve this answer
+1 Like the screenshots – Willbill Sep 23 '09 at 14:23

From here

View Source Chart Graphically displays source structure.

alt text

JSView 2.0.5 Displays information on page external files.

alt text

HighlightAll Highlights identical elements in the code.

alt text

Html Validator Validates HTML of the current page.

alt text

View Formatted Source Shows source structure.

alt text

SourceEditor Allows to edit code and view the results.

alt text

share|improve this answer
+1 Thanks for the suggestions – Willbill Sep 23 '09 at 14:27

I normally use Firebug for debugging html output.

This allows me to se the html as it's rendered by the browser, together with the well-formatted source in Firebug. I can also inspect elements in the displayed html and see where they come from in the originating html source.

share|improve this answer

Web developer plugin:

The Web Developer extension adds various web developer tools to a browser. The extension is available for Chrome and Firefox, and will run on any platform that these browsers support including Windows, OS X and Linux

enter image description here

share|improve this answer
I have this installed but its dosent do what I need I think i have not been clean enough about what i mean by "formatted" I will edit the question now – Willbill Sep 23 '09 at 13:52
At least give a brief description as to the salient feature of the plugin that relates to the question. Otherwise, it's just a flippant answer. – random Sep 23 '09 at 13:53
The web developer plugin is a very popular plugin that, among other things, allows one to view source for any page. The source view has some highlighting, so is "formatted"-- although now I see that the OP wants something more specific for the formatting. – Angelo Sep 23 '09 at 14:24

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .