10
4
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 don't want to mess up my PHP code by adding loads of white space formatting stuff, so I was wondering if there is an option or perhaps an add-on to Firefox that will give me the ability to view the source indented according to the HTML's structure.
Willbill
Posted 2009-09-23T13:46:06.973
Reputation: 227
11
Works just fine, install the extension from here : https://addons.mozilla.org/en-US/firefox/addon/655/
Right click -> View source chart
This is what I get for the Google home page HTML source:
Before:
After:
5
From here
View Source Chart Graphically displays source structure.
JSView 2.0.5 Displays information on page external files.
HighlightAll Highlights identical elements in the code.
Html Validator Validates HTML of the current page.
View Formatted Source Shows source structure.
SourceEditor Allows to edit code and view the results.
joe
Posted 2009-09-23T13:46:06.973
Reputation: 11 615
3
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.
harrymc
Posted 2009-09-23T13:46:06.973
Reputation: 306 093
1
If anyone is looking for the same functionality in 2019, there is Fire Source Viewer [1] for Firefox Quantum which displays the beautified HTML DOM after javascripts manipulates it, which is even better than having only the html source delivered by the webserver.
[1] https://addons.mozilla.org/en-US/firefox/addon/fire-source-viewer/
dasj19
Posted 2009-09-23T13:46:06.973
Reputation: 111
0
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
Angelo
Posted 2009-09-23T13:46:06.973
Reputation: 765
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 – 2009-09-23T13:52:33.313
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 – 2009-09-23T13:53:40.533
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 – 2009-09-23T14:24:03.870
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
Viewmenu of the source window. Just right click =>View Page Sourceto open this window. – Bob – 2012-08-01T13:05:18.680