2020.2

Emmet
Emmet is a plugin that enables the lightning-fast creation of HTML code though the use of a
simple and effective shortcut language. 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. The expansion of abbreviations is invoked
with the Tab key.
In the Source tab of the Workspace, you could for example type div.row. This is the
abbreviation for a <div> element with the class row.
On pressing the Tab key, this abbreviation is transformed to:
<div class="row"></div>
To quickly enter a table with the ID 'green', one row, and two cells in that row, type:
table#green>tr>td*2
On pressing the Tab key, this is transformed to:
<table id="green">
<tr>
<td></td>
<td></td>
</tr>
</table>
All standard abbreviations can be found in Emmet's documentation: Abbreviations.
To learn more about Emmet, please see their website: Emmet.io and the Emmet.io
documentation: http://docs.emmet.io/.
Preferences
To change the way Emmet works in the Designer, select Window > Preferences, and in the
Preferences dialog, select Emmet; see "Emmet preferences" on page370.
Using CSS files with HTML email
Email clients do not read CSS files and some even remove a <style> tag when it is present in
the email's header. Nevertheless, CSS files can be used with the Email context in the
Designer.
When generating output from the Email context, all CSS rules that apply to the content of the
email can be processed and added either to the header of the email or to inline style properties
Page 167