title: VSCode custom code formatting and auto indention for language(Django-Template indention)
body: <p>I did a lot of search to find a away to create or override and existing extension of vscode to do indention for django-template but nothing is out there and no success in creation too.
  the best answer still using this settings:</p>
  <pre><code>&quot;files.associations&quot;: {
      &quot;**/*.html&quot;: &quot;html&quot;,
      &quot;**/templates/**/*.html&quot;: &quot;django-html&quot;,
  }
  &quot;[django-html]&quot;: {
      &quot;editor.defaultFormatter&quot;: &quot;HookyQR.beautify&quot;,
  }
  
  &quot;beautify.language&quot;: {
      &quot;html&quot;: [&quot;django-html&quot;]
  },
  </code></pre>
  <p>and this extensions: <code>Dajngo (Baptiste Darthenay)</code> &amp; <code>beautify</code>. but there is no indention for django-template language and only the HTML tags will be indented. I tried to override the <code>Djagno</code> extension to make it possible, and yeah it would insert some indention but after saving the code, <code>Beautify</code> will automatically format the code and delete that indention, so the result always is like this:</p>
  <pre><code>&lt;ul class=&quot;navbar-nav nav-flex-icons {% if LANGUAGE_BIDI %} mr-auto {% endif %}&quot;&gt;
      {% get_available_languages as languages %}
      {% for lang_code, lang_name in languages %}
      {% if lang_code != LANGUAGE_CODE %}
      {% language lang_code %}
      &lt;li class=&quot;nav-item&quot;&gt;
        &lt;a class=&quot;nav-link lang-setter&quot; data-lang-code=&quot;{{ lang_code }}&quot;&gt;
          {{ lang_code|language_name_local }}
        &lt;/a&gt;
      &lt;/li&gt;
      {% endlanguage %}
      {% endif %}
      {% endfor %}
  &lt;/ul&gt;
  </code></pre>
  <p>the ugly template.
  I also provided the indention rule needed, but I couldn't find a way to force this rule for vscode code formatters like beautify or prettier.</p>
  <pre><code>  &quot;indentationRules&quot;: {
        &quot;increaseIndentPattern&quot;: &quot;((\\&lt;)(body|address|blockquote|dd|div|dl|dt|tr|tbody|thead|fieldset|form|frame|frameset|h1|h2|h3|h4|h5|h6|iframe|noframes|object|ol|p|ul|applet|center|dir|a|menu|pre|table|button|a|abbr|acronym|area|b|base|basefont|bdo|big|br|button|caption|cite|code|col|colgroup|del|dfn|em|font|head|html|i|img|input|ins|isindex|kbd|label|legend|li|link|map|meta|noscript|optgroup|option|param|q|s|samp|script|select|small|span|strike|strong|style|sub|sup|table|tbody|td|textarea|tfoot|th|thead|title|tr|tt|u|var))|(\\{\\%)\\s*(autoescape|block|blocktrans|blocktranslate|comment|for|empty|if|elif|else|ifchanged|ifequal|ifnotequal|from|low|regroup|ssi|spaceless|templatetag|widthratio|with|verbatim|thumbnail)&quot;,
        &quot;decreaseIndentPattern&quot;: &quot;((\\&lt;\\/)(.*)*(\\&gt;))|((\\{\\%)\\s*(empty|elif|else|end(autoescape|block|blocktrans|blocktranslate|comment|for|if|ifchanged|ifequal|ifnotequal|spaceless|with|verbatim|thumbnail)))&quot;
        }
  </code></pre>