If you are a designer working with Symfony developers you will soon encounter Twig. Twig is a template engine for PHP that has been adopted by Symfony 2, and from a designers perspective, it’s a major improvement over the way things are done in Symfony! For designers who have used templating systems like Smarty before, Twig is going to be a walk in the park, if you have not used a templating system before, Twig is a great place to start. The best part of it is that Twig syntax is super simple to use and empowers the designer to do their job without futzing with PHP code. I must say, so far I have enjoyed my first trip into Twigland but it required a few adjustments to my work environment. I use Dreamweaver to edit HTML and let’s just say Twig does not work straight out of the box.These where the steps I took to configure Dreamweaver to work with Twig:

Step 1: Getting Dreamweaver to recognize the .twig extension

Dreamweaver does not recognize the .twig file extension. In fact, it won’t even open a file with the .twig extension unless you configure it to do so. Fortunately this is easy to do. To do this go to the Dreamweaver preferences (⌘U) , select “File Types / Editors” and add the .twig extension in the “open in code view” text field.

Step 2: Enabling syntax highlighting

Now that Dreamweaver opens our Twig template we need to enable syntax highlighting. To do this you need to let Dreamweaver know what type of file you are editing. These settings are kept in an xml file called MMDocumentTypes.xml

You can locate MMDocumentTypes.xml here:
Mac users:

Macintosh HD/Applications/Adobe Dreamweaver CS5/configuration/DocumentTypes/MMDocumentTypes.xml

Windows users:

C:\Program Files\Adobe\Dreamweaver CS5\Configuration\DocumentTypes\MMDocumentTypes.xml

Open the file up in Dreamweaver and look for this line:

<documenttype id="HTML" internaltype="HTML" winfileextension="html,htm,shtml,shtm,stm,tpl,lasso,xhtml" macfileextension="html,htm,shtml,shtm,tpl,lasso,xhtml,ssi" file="Default.html" writebyteordermark="false" mimetype="text/html">

It should be right at the top of your XML file. Since Twig templates should mostly be HTML, telling Dreamweaver to use the same syntax highlighting used in HTML works well. Add the twig extension to both the winfileextension and macfileextension so it looks like this:

<documenttype id="HTML" internaltype="HTML" winfileextension="html,htm,shtml,shtm,stm,tpl,lasso,xhtml,twig" macfileextension="html,htm,shtml,shtm,tpl,lasso,xhtml,ssi,twig" file="Default.html" writebyteordermark="false" mimetype="text/html">

Restart Dreamweaver, open your Twig template and it should be good to go.