<p>Craft does already support <code>.twig</code> as a template file extension option by default (see the <a href="https://craftcms.com/docs/config-settings#defaultTemplateExtensions">defaultTemplateExtensions</a> config setting docs). If you want to allow <code>.html.twig</code> as well, just open craft/config/general.php and add this to the config array:</p>

<pre class="lang-php prettyprint-override"><code>'defaultTemplateExtensions' =&gt; array('html', 'twig', 'html.twig'),
</code></pre>

<p>(Note that this will only affect front-end templates. The Control Panel is locked to <code>.html</code> and <code>.twig</code> for plugins.)</p>

CC BY-SA 3.0
2016-05-19T14:09:01.733Z
2016-05-19T14:09:01.733Z
Brandon Kelly
<p>Why do you want to use a .twig extension? The <a href="http://twig.sensiolabs.org/doc/tags/include.html" rel="nofollow noreferrer">official Twig documentation</a> uses .html, P&amp;T use .html in the <a href="https://github.com/pixelandtonic/Craft-Release/tree/master/app/templates" rel="nofollow noreferrer">Craft codebase</a> and in the <a href="https://craftcms.com/docs/templating-overview#template-paths" rel="nofollow noreferrer">Craft documentation</a>. I would say <strong>.html is the standard</strong> for Craft template files.</p>

<p>Most editors can be configured to load the Twig language / syntax parser for files with other extensions then .twig</p>

<p>Configuration instructions for some popular editors and IDEs:</p>

<ul>
<li><a href="https://stackoverflow.com/a/8014142">Sublime Text</a> (“Open all with current extension as...” setting)</li>
<li><a href="https://stackoverflow.com/a/32508353">Atom Editor</a> (add extension to <code>text.html.twig</code> language)</li>
<li><a href="https://code.visualstudio.com/docs/languages/overview#_adding-a-file-extension-to-a-language" rel="nofollow noreferrer">Visual Studio Code</a> (add extension to <code>files.associations</code> setting)</li>
<li><a href="https://craftcms.stackexchange.com/a/10143/125">PHPStorm</a> (Preferences > Editor > File Types > Twig; also enable all Twig live templates for HTML in Preferences > Editor > Live Templates)</li>
</ul>

CC BY-SA 3.0
2016-05-19T12:05:01.500Z
I concur that .html is the default, but I personally prefer .twig. It's more clear; the template files aren't actually HTML files, they are Twig files. Also, using .twig means most IDEs will use Twig syntax highlighting by default (as long as it is installed), without any additional effort. Also, since Craft doesn't require the file extension in `{% include %}` tags etc., the two are totally interchangeable; there are no drawbacks to using .twig, in my opinion.
Mats Mikkel Rummelhoff
CC BY-SA 3.0
2016-05-19T13:15:29.193Z
I second Mats opinion. You can also leave off file extensions when specifying templates to use for singles/entries in the control panel - and they will work whether they are HTML or twig filetypes.
Luke Pearce
CC BY-SA 3.0
2016-05-19T13:33:52.117Z
Hey guys, I didn't say it's bad practice to use .twig nor that there are disadvantages. I just wanted to make the point that it's easy to set up in your editors and because SensioLabs and P&T use .html it could be regarded as the standard that I *personally* like to conform to.
carlcs
CC BY-SA 3.0
2016-05-19T14:10:28.810Z
@carlcs We use `.twig` in Commerce though, just to mess with you :)
Brandon Kelly
CC BY-SA 3.0
2017-04-03T14:45:45.107Z
More specifically, when you assign *.html to twig I'm still having issues where I can only use twig tag snippet expansion when I'm not inside of any other html tag. So if I'm trying to do a for twig tag it only will print out a `<for></for>`. Trying to find a fix for this as it makes development a bit frustrating.
Bonk
CC BY-SA 3.0
2017-04-03T15:11:11.110Z
Ok, so the work around I've found for this is in WebStorm/PHPStorm is to go into Preferences > Editor > Live Templates and then set each individual Twig live template to be applicable in HTML. Then In Preferences > Languages & Frameworks > Template Data Languages set your directories containing the template files to HTML in the dropdown on the right( It doesn't show up for me until I clicked in the column). This has solved the issue of no HTML syntax highlighting inside of Twig tags, allows me to keep .html as the files extension, and use the live templates.
Bonk
CC BY-SA 3.0
2017-04-04T08:41:41.833Z
Good find @Bonk, I added that info to the answer. Thanks
carlcs
CC BY-SA 3.0
2017-02-15T19:39:44.460Z
Worth noting that in Webstorm you can only assign *.html files to one file type, which makes using twig in those a pain.
Bonk
CC BY-SA 3.0
2017-02-15T21:37:09.150Z
@Bonk I don’t understand, assign *.html to Twig file type and everything works just fine. And for HTML files where you don’t use Twig, just don’t make use of the Twig specific feature sub-set.
carlcs
CC BY-SA 3.0
2017-02-17T20:59:27.983Z
@carlcs I wasn't sure if doing that would cause html specific features to not work so I avoided it by doing the .html.twig setting. If you can get away with assigning it to twig without issue go for it.
Bonk
CC BY-SA 3.0
2016-05-19T11:16:01.237Z
2017-07-14T13:38:05.587Z
2017-07-14T13:38:05.587Z
carlcs
<p>Does anyone know how to make Craft by default use .twig extensions. It helps IDEs better understand Twig blocks. I have tried .twig and .html.twig but it doesn't appear to work by default. </p>

<p>I don't want to set up special configs for every template.</p>

CC BY-SA 3.0
2016-05-19T10:39:09.757Z
It works now fine with renaming all files to .twig extension. No ideea why it did not work. Can be closed
Cristian
<templating>
Templates with .twig extension
# Templates with .twig extension

(Asked by: username_0 on 2016-05-19)

Does anyone know how to make Craft by default use .twig extensions. It helps IDEs better understand Twig blocks. I have tried .twig and .html.twig but it doesn't appear to work by default.

I don't want to set up special configs for every template.

**Tags:** templating

> **Comments:**
> **username_0**: It works now fine with renaming all files to .twig extension. No ideea why it did not work. Can be closed  

---

## 2 answers

### Answer by username_1 on 2016-05-19. Score: 12

Craft does already support .twig as a template file extension option by default (see the defaultTemplateExtensions config setting docs). If you want to allow .html.twig as well, just open craft/config/general.php and add this to the config array:
'defaultTemplateExtensions' => array('html', 'twig', 'html.twig'),

(Note that this will only affect front-end templates. The Control Panel is locked to .html and .twig for plugins.)


---

### Answer by username_2 on 2016-05-19. Score: 6

Why do you want to use a .twig extension? The [official Twig documentation](http://twig.sensiolabs.org/doc/tags/include.html) uses .html, P&T use .html in the [Craft codebase](https://github.com/pixelandtonic/Craft-Release/tree/master/app/templates) and in the [Craft documentation](https://craftcms.com/docs/templating-overview#template-paths). I would say **.html is the standard** for Craft template files.

Most editors can be configured to load the Twig language / syntax parser for files with other extensions then .twig

Configuration instructions for some popular editors and IDEs:

* [Sublime Text](https://stackoverflow.com/a/8014142) (“Open all with current extension as...” setting)
* [Atom Editor](https://stackoverflow.com/a/32508353) (add extension to `text.html.twig` language)
* [Visual Studio Code](https://code.visualstudio.com/docs/languages/overview#_adding-a-file-extension-to-a-language) (add extension to `files.associations` setting)
* [PHPStorm](https://craftcms.stackexchange.com/a/10143/125) (Preferences > Editor > File Types > Twig; also enable all Twig live templates for HTML in Preferences > Editor > Live Templates)

> **Comments:**
> **username_3**: I concur that .html is the default, but I personally prefer .twig. It's more clear; the template files aren't actually HTML files, they are Twig files. Also, using .twig means most IDEs will use Twig syntax highlighting by default (as long as it is installed), without any additional effort. Also, since Craft doesn't require the file extension in `{% include %}` tags etc., the two are totally interchangeable; there are no drawbacks to using .twig, in my opinion.  
> **username_4**: I second Mats opinion. You can also leave off file extensions when specifying templates to use for singles/entries in the control panel - and they will work whether they are HTML or twig filetypes.  
> **username_2**: Hey guys, I didn't say it's bad practice to use .twig nor that there are disadvantages. I just wanted to make the point that it's easy to set up in your editors and because SensioLabs and P&T use .html it could be regarded as the standard that I *personally* like to conform to.  
> **username_1**: @username_2 We use `.twig` in Commerce though, just to mess with you :)  
> **username_5**: Worth noting that in Webstorm you can only assign *.html files to one file type, which makes using twig in those a pain.  
> **username_2**: @username_5 I don’t understand, assign *.html to Twig file type and everything works just fine. And for HTML files where you don’t use Twig, just don’t make use of the Twig specific feature sub-set.  
> **username_5**: @username_2 I wasn't sure if doing that would cause html specific features to not work so I avoided it by doing the .html.twig setting. If you can get away with assigning it to twig without issue go for it.  
> **username_5**: More specifically, when you assign *.html to twig I'm still having issues where I can only use twig tag snippet expansion when I'm not inside of any other html tag. So if I'm trying to do a for twig tag it only will print out a `<for></for>`. Trying to find a fix for this as it makes development a bit frustrating.  
> **username_5**: Ok, so the work around I've found for this is in WebStorm/PHPStorm is to go into Preferences > Editor > Live Templates and then set each individual Twig live template to be applicable in HTML. Then In Preferences > Languages & Frameworks > Template Data Languages set your directories containing the template files to HTML in the dropdown on the right( It doesn't show up for me until I clicked in the column). This has solved the issue of no HTML syntax highlighting inside of Twig tags, allows me to keep .html as the files extension, and use the live templates.  
> **username_2**: Good find @username_5, I added that info to the answer. Thanks  

---

