2020.2

Emmet preferences
Emmet is a framework that enables the lightning-fast creation of HTML code though the use of
a simple and effective shortcut language resembling CSS Selectors (see Emmet Abbreviations:
"Emmet" on page167. The Emmet functionality is available in the HTML and CSS source
editors of Connect Designer. Emmet transforms abbreviations for HTML elements and CSS
properties to the respective source code.
This is, for example, the abbreviation for a <div> element with the class row:
div.row
On pressing the Tab key, this abbreviation is transformed to:
<div class="row"></div>
To learn more about Emmet itself, please see their website Emmet.io and their documentation:
http://docs.emmet.io/. Emmet is a plugin. All options listed below are Emmet's default options.
They are not specifically adjusted for Connect.
Common Emmet preferences
l
Expand abbreviations by Tab key: Check to enable the Expand Abbreviation function.
l
... in files with extension: Enter a comma-separated list of all file extensions in which
expand abbreviation will work.
l
Upgrade web editors: This Emmet option doesn't affect how Emmet works in Connect
Designer.
l
Extensions Path: Choose a folder where to put json and js files to extend Emmet. This
includes custom snippets, preferences and syntax profiles. For more information see
http://docs.emmet.io/customization/.
Emmet Abbreviation preferences
This Preferences tab lets you add and manage custom abbreviations. All standard
abbreviations can be found in Emmet's documentation:
http://docs.emmet.io/abbreviations/syntax/.
If there is no need to transform the text while expanding it, create an Emmet snippet instead
(see below).
Page 370