ISML templates open as HTML with SFCC on top. The IDE's HTML support keeps working, and Intellij SFCC adds the ISML tags, completes and links template paths, and treats <isscript> and ${...} as real JavaScript with the Script API behind it
Sandbox 01
version2
cart.isml
Global scopeTags and attributes
The plugin knows all 28 ISML tags, from <isif> and <isloop> to <isslot> and <iscache>. Type <is to list them, and inside a tag the attribute completion offers that tag's attributes. HTML warnings about unknown tags are turned off for is* tags, so a template isn't covered in yellow
Attributes with a fixed set of values list exactly those values:
| Tag | Attribute | Values |
|---|---|---|
<isset> | scope | session, request, page |
<isremove> | scope | session, pdict, request, page |
<iscache> | status, type, varyby | on or off, relative or daily, price_promotion |
<iscontent> | type, encoding, compact | text/html, application/xml, application/json, and the encodings |
<isprint> | encoding, timezone | htmlcontent, jsblock, uricomponent and the other encodings, SITE, INSTANCE, utc |
<isredirect> | permanent | true, false |
<isslot> | context | global, category |
Because templates are HTML to the IDE, its HTML features such as tag matching, Emmet and Reformat Code work as in any HTML file
Template paths
Every template attribute completes template paths from your linked cartridges, relative to templates/<locale> and without the .isml extension. Each item shows the cartridge it comes from
<isdecorate template="common/layout/page">
<isinclude template="cart/cartTotals" />
<ismodule template="components/modules/badge" name="badge" />
</isdecorate>On <isinclude>, <isdecorate> and <ismodule>, Cmd+Click (Ctrl+Click) opens the template, and the gutter icon Navigate to template does the same. When the template exists in several cartridges, Choose Declaration lists each copy. A path built with an expression, such as template="${pdict.template}", isn't resolved
The same template paths complete in scripts, for example in res.render('cart/cart'), see SFCC Contracts
JavaScript in templates
| Where | Treated as |
|---|---|
The body of <isscript> | JavaScript |
${...} in text and attribute values | A JavaScript expression |
The name of <isset> and the var of <isloop> | JavaScript |
Inside them you get the same completion as in a script: the Script API, the globals such as session and request, and URLUtils and Resource, which templates can use without a require. SFCC strings complete too, so ${URLUtils.url('Cart-Show')} completes the route and ${Resource.msg('button.checkout', 'cart', null)} the key
<isscript>
var ProductMgr = require('dw/catalog/ProductMgr');
var product = ProductMgr.getProduct(pdict.pid);
</isscript>
<a href="${URLUtils.url('Product-Show', 'pid', product.ID)}">${Resource.msg('link.view.product', 'product', null)}</a>Type ${ and the closing } is added for you
Create a template
Right-click a folder and choose New › ISML File . Enter a name and the plugin creates <name>.isml with a TEMPLATENAME comment as the first line
What isn't covered
pdicthas no type. Its properties don't complete, because the IDE can't know what each controller puts into it- There are no ISML-specific inspections, live templates or formatter beyond the IDE's HTML ones
- Find Usages on a template doesn't list the scripts and templates that include it. Use Find in Files with the template path instead
Troubleshooting
| Symptom | What to do |
|---|---|
| ISML tags are marked as unknown | The tag support needs an active license or trial, see Purchase & License |
A template path doesn't complete | The template is in a cartridge that isn't linked, or not under templates/<locale> |
Cmd+Click on a path does nothing | The path contains ${...}, or the tag is not <isinclude>, <isdecorate> or <ismodule> |