Home

Sublime Text - HTML formatting

These HTMLBeautify.sublime-settings protect content against reformatting, it also aligns <if> <else/> </if> by themselves nicely:

{
   // the contents of these tag blocks will be indented (add/remove as desired)
   "tag_indent":
   "\\{% (if|for|block|else|spaceless)|<if|<for|<while|<html|<head|<body|<div|<a|<nav|<ul|<ol|<dl|<li|<table|<thead|<tbody|<tr|<th|<td|<blockquote|<select|<form|<option|<optgroup|<fieldset|<legend|<label|<header|<main|<section|<aside|<footer|<figure|<video|<span|<p|<g|<svg",

   // this signals when tags should be unindented (see tags above)
   "tag_unindent":
   "\\{% end|</block|</if|</for|</while|</html|</head|</body|</div|</a|</nav|</ul|</ol|</dl|</li|</table|</thead|</tbody|</tr|</th|</td|</blockquote|</select|</form|</option|</optgroup|</fieldset|</legend|</label|</header|</main|</section|</aside|</footer|</figure|</video|</span|</p|</g|</svg",

   // these tags should be unindented and next line will be indented
   "tag_unindent_line":
   "\\{% else|<else/",

   // these tags use raw code and should flatten to column 1
   // tabs will be removed inside these tags! use spaces for spacing if needed!
   // example: "<pre|<script" and "</pre|</script"
   // flatten starting with this tag...
   "tag_raw_flat_opening":
   "<pre|<objc",

   // ...stop flattening when you encounter this tag
   "tag_raw_flat_closing":
   "</pre|</objc",

}