IntelliJ IDEA 2017.2 Help

Expanding Emmet Templates with User Defined Templates

In this section:


You can expand Emmet templates with your own live templates.

Suppose you have a template entry with the following template text:

<entry type="$TYPES$">$END$ <entry>

To generate a list of entries, you just need to type “entry-list<entry[number=$]*5″ and press TAB. By default, the number attribute will be generated before type. To customize the position where it is generated, you need to add the ATTRS variable to your template, for example:

<entry type="$TYPES$" $ATTRS$>$END$ <entry>

The ATTRS variable must have an empty string as the default value and should be skipped.

Expanding Emmet templates

To expand an Emmet template with a user-defined template

  1. Open the Settings / Preferences Dialog by pressing Ctrl+Alt+S or by choosing File | Settings for Windows and Linux or IntelliJ IDEA | Preferences for macOS, and click Live Templates under Editor.
  2. On the Live Templates page that opens, expand the required Zen Coding template group, for example, Zen HTML, Zen CSS, or Zen XSL.
  3. Select the template to expand. The focus moves to the Template Text area where the fields show the settings of the selected template.
  4. In the Template Text field, add the required text and variables to the template body.
  5. Click the Edit Variables button. In the Edit Template Variables dialog box that opens, specify the default variable values in the Default value field and select the Skip if defined check box, where necessary.
Last modified: 29 November 2017

See Also