{"id":18998,"date":"2013-06-11T16:48:36","date_gmt":"2013-06-11T16:48:36","guid":{"rendered":"https:\/\/blog.jetbrains.com\/phpstorm\/?p=6146"},"modified":"2024-01-09T15:05:37","modified_gmt":"2024-01-09T14:05:37","slug":"twig-support-in-phpstorm","status":"publish","type":"phpstorm","link":"https:\/\/blog.jetbrains.com\/pt-br\/phpstorm\/2013\/06\/twig-support-in-phpstorm","title":{"rendered":"Twig support in PhpStorm"},"content":{"rendered":"<p><a href=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-twig-logo.png\"><img decoding=\"async\" class=\"alignright size-full wp-image-6147\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-twig-logo.png\" alt=\"\" width=\"150\" \/><\/a><a id=\"docs-internal-guid-0fcd1b54-d141-ca48-6c23-9e111deacaa4\" href=\"http:\/\/www.twig-project.org\/\" target=\"_blank\" rel=\"noopener\">Twig<\/a> is a template engine for PHP. While it evolved out of the <a href=\"http:\/\/www.symfony.com\/\" target=\"_blank\" rel=\"noopener\">Symfony<\/a> framework, it can be used with other frameworks as well. It\u2019s fast (compiles to optimized PHP code), it\u2019s secure (creates a sandbox to run templates in). And it\u2019s supported by PhpStorm!<\/p>\n<p>PhpStorm provides syntax highlighting for all <em>*.twig <\/em>files in our project. Note that we can also use code folding for Twig blocks as well as for HTML tags. All HTML features are also available in the Twig editor, such as intentions, live templates and <a href=\"http:\/\/www.emmet.io\" target=\"_blank\" rel=\"noopener\">Emmet<\/a> support.<!--more--><\/p>\n<p><a href=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-01-twig.png\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-6149\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-01-twig.png\" alt=\"\" width=\"624\" height=\"123\" \/><\/a><\/p>\n<p>Twig tags (surrounded with { and }) are recognized by the IDE and will trigger autocompletion and suggestions. For example if we want to create a block in our Twig template, PhpStorm provides autocompletion:<\/p>\n<p><a href=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-05-suggestions.png\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-6152\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-05-suggestions.png\" alt=\"\" width=\"347\" height=\"75\" \/><\/a><a href=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-02-autocompletion.png\"><\/a><\/p>\n<p>Autocompletion for file names in <em>include<\/em>, <em>extends <\/em>and <em>import <\/em>tags is also available. We can trigger autocompletion using the <em><strong>Ctrl+Space (Cmd+Space on Mac)<\/strong><\/em> keyboard shortcut.<\/p>\n<p style=\"text-align: center\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-6148\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-02-autocompletion.png\" alt=\"\" width=\"620\" height=\"121\" \/><\/p>\n<p dir=\"ltr\">Navigation support is available as well. <em>Open file in Editor<\/em> can be triggered by holding down the <em><strong>Ctrl (Cmd on Mac) <\/strong><\/em>key and clicking the referenced Twig file.<\/p>\n<p dir=\"ltr\"><a href=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-03-navigation.png\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-6150\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-03-navigation.png\" alt=\"\" width=\"480\" height=\"60\" \/><\/a><\/p>\n<p dir=\"ltr\">If needed, we can also modify the code style for Twig. From the <em><strong>File | Settings <\/strong><\/em>menu, we can open the <em><strong>Project Settings | Code Style | Twig <\/strong><\/em>node and specify tab size, indentation and so on.<\/p>\n<p dir=\"ltr\"><a href=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-04-codestyle.png\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-6151\" src=\"https:\/\/blog.jetbrains.com\/wp-content\/uploads\/2013\/05\/phpstorm-04-codestyle.png\" alt=\"\" width=\"921\" height=\"496\" \/><\/a><\/p>\n<p dir=\"ltr\">Let us know how you are using Twig support! We appreciate your feedback in the comments below or in our <a href=\"http:\/\/devnet.jetbrains.com\/community\/wi?view=discussions\" target=\"_blank\" rel=\"noopener\">forums<\/a>!<\/p>\n<p dir=\"ltr\"><em>Develop with pleasure!<\/em><br \/>\n<em>\u2013 JetBrains PhpStorm Team<\/em><\/p>\n","protected":false},"author":118,"featured_media":0,"comment_status":"open","ping_status":"open","template":"","categories":[808,907],"tags":[714,198,763,190,1112],"cross-post-tag":[],"acf":[],"_links":{"self":[{"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/phpstorm\/18998"}],"collection":[{"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/phpstorm"}],"about":[{"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/types\/phpstorm"}],"author":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/users\/118"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/comments?post=18998"}],"version-history":[{"count":1,"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/phpstorm\/18998\/revisions"}],"predecessor-version":[{"id":432195,"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/phpstorm\/18998\/revisions\/432195"}],"wp:attachment":[{"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/media?parent=18998"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/categories?post=18998"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/tags?post=18998"},{"taxonomy":"cross-post-tag","embeddable":true,"href":"https:\/\/blog.jetbrains.com\/pt-br\/wp-json\/wp\/v2\/cross-post-tag?post=18998"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}