Take the 2-minute tour ×
Super User is a question and answer site for computer enthusiasts and power users. It's 100% free, no registration required.

Does anyone know of an existing extension to format the html code after you 'View Source"? I only ask because it would make it so much easier to read. Basically just removing extra whitespace, format all elements, that sort of thing. Doesn't seem like it'd be that hard.

share

migration rejected from webapps.stackexchange.com 4 hours ago

This question came from our site for power users of web applications. Votes, comments, and answers are locked due to the question being closed here, but it may be eligible for editing and reopening on the site where it originated.

put on hold as off-topic by random 4 hours ago

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "Questions seeking product, service, or learning material recommendations are off-topic because they become outdated quickly and attract opinion-based answers. Instead, describe your situation and the specific problem you're trying to solve. Share your research. Here are a few suggestions on how to properly ask this type of question." – random
If this question can be reworded to fit the rules in the help center, please edit the question.

    
I don't know what you mean by “format”. What exactly do you want? What’s lacking with the results of Ctrl+U? –  Synetech Aug 30 '12 at 17:01
    
@Synetech - What I mean is if I hit <code>Ctrl+U</code>, I want to have some ability to format the HTML (tabs or spaces) and not have it be in whichever format provided by the server. I'm looking for a functionality similar to Chrome Dev tools inspector, but with the source all expanded, and after DOM load, before any javascript calls. –  Stevus Sep 19 '12 at 16:32
    
You could simply use Ctrl+U; Ctrl+A; Ctrl+C, then switch to a text-editor like Notepad, then Ctrl+V and make any changes you wish (if you use a more advanced text editor, you can do more advanced formatting and stuff like with RegEx search-and-replace). –  Synetech Sep 19 '12 at 16:46
    
    
One issue with formatting source code for viewing: If the HTML is malformed, then automatic formatting would just choke. Yes, we live in 2015 and most HTML is generated by scripts and CMS systems, but as a developer I have often come across badly formatted HTML, CSS and related code that cannot be easily auto-formated without manually debugging. –  JakeGould Mar 2 at 3:12

3 Answers 3

There is an extension called "Quick source viewer", which does some basic formatting by default. Code is indented nicely and colorized.
Also, (I think) it actually shows the HTML code of the currently loaded page (unlike Chrome's "View Page Source", which sometimes reloads it, showing code that doesn't match the page in the browser).

share

A plugin is unnecessary because Google Chrome provides this feature by default, though it is somewhat not obvious.

This feature is documented by Google here if you'd like to investigate further.

All you need to do is to click the "{}" icon on the bottom toolbar. This works for minified JavaScript as well as CSS.

enter image description here

It's the small button in the center of the image at the bottom on the far right..

share
    
Unfortunately, this doesn't work for HTML. –  colan Apr 14 at 19:49

The best I've been able to find is "Neo Vision" for Chrome.

https://github.com/desandro/neo-vision

It has good syntax highlighting but some missing features like: line numbers and the ability to beautify minified code.

share
    
It also appears to not support HTML files. –  Xiong Chiamiov Mar 25 at 21:58

Not the answer you're looking for? Browse other questions tagged or ask your own question.