CODEWITHSUNDEEP
phpsublimetext3emmet
Iman Sedighi
Iman Sedighi

Reputation: 8162

Emmet autocomplete is not working for php files in Sublime (Expand abbreviations)

I am using Emmet plugin for HTML files in Sublime. But when I want to type HTML codes in a PHP file like views files in Laravel then Emmet is not expanding abbreviations.

For example: when I type html:5 and press tab in an HTML file in Sublime then Emmet autocomplete will convert it to:

<!DOCTYPE html>
  <html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Document</title>
  </head>
  <body>

  </body>
</html>

But when I do the same in a file with .php extension and press tab nothing will happen. Is it a sublime configuration problem or is there any solution for fast typing HTML codes with Emmet in Sublime for PHP files?

Upvotes: 0

Views: 4197

Answers (1)

MattDMo
MattDMo

Reputation: 102862

The README in Emmet's Package Control page explain clearly how to do this - scroll down to the How to expand abbreviations with Tab in other syntaxes section:

Emmet expands abbreviations in limited syntaxes only: HTML, CSS, LESS, SCSS, Stylus and PostCSS. The reason to restrict Tab handler to a limited syntax list is because it breaks native Sublime Text snippets.

If you want to abbreviation with Tab in other syntaxes (for example, JSX, HAML etc.) you have to tweak your keyboard shorcuts settings: add expand_abbreviation_by_tab command for tab key for required syntax scope selectors. To get current syntax scope selector, press ⇧⌃P (OSX) or Ctrl+Alt+Shift+P, it will be displayed in editor status bar.

Go to Preferences > Key Bindings — User and insert the following JSON snippet with properly configured scope selector instead of SCOPE_SELECTOR token:

{
  "keys": ["tab"], 
  "command": "expand_abbreviation_by_tab", 

  // put comma-separated syntax selectors for which 
  // you want to expandEmmet abbreviations into "operand" key 
  // instead of SCOPE_SELECTOR.
  // Examples: source.js, text.html - source
  "context": [
    {
      "operand": "SCOPE_SELECTOR", 
      "operator": "equal", 
      "match_all": true, 
      "key": "selector"
    }, 

    // run only if there's no selected text
    {
      "match_all": true, 
      "key": "selection_empty"
    },

    // don't work if there are active tabstops
    {
      "operator": "equal", 
      "operand": false, 
      "match_all": true, 
      "key": "has_next_field"
    }, 

    // don't work if completion popup is visible and you
    // want to insert completion with Tab. If you want to
    // expand Emmet with Tab even if popup is visible -- 
    // remove this section
    {
      "operand": false, 
      "operator": "equal", 
      "match_all": true, 
      "key": "auto_complete_visible"
    }, 
    {
      "match_all": true, 
      "key": "is_abbreviation"
    }
  ]
}

The SCOPE_SELECTOR value for PHP is embedding.php text.html.basic.

Upvotes: 1

Related Questions