Mobile app version of vmapp.org
Login or Join
Lengel546

: Which tool can tidy/indent HTML5? I've already spent about 2 hours searching google and trying various tools but either they don't do indent tags per say or they aren't HTML5 compatible such

@Lengel546

Posted in: #Code #Html5

I've already spent about 2 hours searching google and trying various tools but either they don't do indent tags per say or they aren't HTML5 compatible such as the famous HTML tidy which was last updated 3 years ago…

N.B. I don't want to apply this to the source of a page (like PHP or JS would do) but to the code in the editor so that a clear hierarchy appears between tags.

Ideally I'd like a Mac OS X tool but I'll take any online tool and in last resot a Wine compatible one.

P.S. at the moment I use Coda from Panic

10.08% popularity Vote Up Vote Down


Login to follow query

More posts by @Lengel546

8 Comments

Sorted by latest first Latest Oldest Best

 

@Cooney921

Dirtymarkup.com is my go to for quickly formatting HTML and JS.

10% popularity Vote Up Vote Down


 

@Speyer207

Eclipse seems to do a decent job of indenting/formatting HTML5. You just use the usual format command (Ctrl-Shift-F) on an HTML file loaded in the HMTL editor and it will reformat it.

To adjust it, go to preferences --> web --> html files --> editor. You can also control validation here. (I'm using Eclipse v4.2.2.)

Note that the HTML editor requires that your Eclipse installation include the Web Tools Platform (see this answer for details).

10% popularity Vote Up Vote Down


 

@Hamaas447

JetBrains PhpStorm works great and intuitive with indents in HTML, CSS or PHP.
Type of indent (tabs or spaces) you can change in PHPStorm settings.

10% popularity Vote Up Vote Down


 

@Michele947

If you're looking for a Mac OS X tool that does the job, I'd say TextMate.

I usually do a lot of re-indenting and the best one that I've been able to find has been that one.

What I like is that it doesn't actually rearranges your code, but it re-indents it, in a form that checks the nesting and indents by level, not by tags.

The "Indent Selection" feature is specially useful.

10% popularity Vote Up Vote Down


 

@Dunderdale272

There's now an HTML5 version of tidy, found here: github.com/w3c/tidy-html5.

10% popularity Vote Up Vote Down


 

@Kristi941

I humbly suggest Espresso 2.

From their website:


The one and only CSSEdit 3 — CSSEdit's award-winning visual tools, now
inside Espresso. With awesome CSS3 support for multi-browser
gradients, shadows and more.

Web Preview with X-ray — See how your CSS affects web layouts,
visualize margins and padding, and quickly find the relevant style
rules for any page element.

Powerful and Efficient Coding — CodeSense, code folding, smart
snippets, Zen coding and the drag-and-drop Navigator help you write
better code in less time.

Live Styling and Overrides — Edit any website's CSS and see it update
in real-time. No need to save, publish or reload. Experimenting and
tweaking has never been this fun.

Effortless Sync and Publishing — With Quick Publish, Server Sync and
Browse, you have the right tool for any server-based workflow. The new
Vroom engine is super-fast.

A Workspace That Fits Into Your Workflow — The innovative Workspace
gives you the flexibility of Tabs while integrating smoothly with your
Project files.

Fantastic Find — Needle and haystack, meet Espresso. Project-wide Find
and Replace, Quick Filter and colorized regex make searching through
files or text a breeze.

Language Support — Improved HTML5, CSS3, JavaScript and PHP; all-new
Ruby, Python, Apache and Markdown. Or extend Espresso with XML/JS
Sugars.


You could read a review from Mac Appstorm to have an idea of the quality. They give it 10/10.

10% popularity Vote Up Vote Down


 

@Vandalay111

I was looking for an online tool and that's probably why I failed to find anything.
I was pointed to the Coda plugin PHP & Toolkit that does it.
Also most HTML editors like Taco do it natively (but not Coda).

10% popularity Vote Up Vote Down


 

@Odierno851

Aptana Studio 2 does what you want in the menu Edit > Format. I've used it and it formats html, css and javascript.

The WYSIWYG editor BlueGriffon also can also format html when you open a file.

Both solutions are free and open-source, but Aptana might be better. I'm not sure if BG keeps all the code unchanged, probably not.

Notes:


Aptana 2 needs to be properly configured after you install it, but
it's a great html5/css/javascript editor/IDE. The default config sucks a little.
Aptana 3 might not do what you want. The version I've tried didn't
do it.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme