Create your first component
Components are currently an experimental feature. Enable components by navigating to Account Settings->Experiments->Components. Once enabled, you can create a new component by clicking the + button in the file explorer, and clicking New component (just as you would a new file or folder).
Give the component a descriptive filename. Component filenames cannot contain
* and must be less than 100 characters. You can differentiate files, folders, and components in the file explorer by their icon.
The component filename (as seen in the file explorer) is unimportant for component use.
When you create a component, the HTML editor window will be replaced by the component editor window. At the top of this window is the Component Name. The Component Name is the same as the component filename by default, but can be changed independent of the component filename. Component names must only contain letters, numbers, and hyphens - no other characters are permitted. Component names must start with a letter. They cannot contain consecutive hyphens (--) or exactly match HTML reserved keywords (ex: 'button').
<style> tags are allowed at the top level in a component. Attempting to use other tags at the top level will result in a warning.
Everything inside a
<component> </component> tag will be rendered when the component is used. Let's start with a simple component called
<!-- my-first-component --> and
<!-- my-email --> are comments that denote which file is being used. They are not necessary for functionality and can be removed.
<!-- my-first-component --><component> This will get rendered when this component is used. </component>
Use this component in an email:
<!-- my-email --><html><body>A simple email<my-first-component></body></html>
The resulting source code will be:
<html><body>A simple emailThis will get rendered when this component is used.</body></html>
Any changes made to the component will propagate to every instance of the component's use.