Slots

• Last updated on March 3, 2025
• •
• Less than a minute to read

The slots allow you to embed external HTML content into workflow elements. In this way, you can customize the editor with greater flexibility, as well as add new functionality if needed.

The Template Editor has special slots where you can insert your own content and then modify it through interaction with the Document Object Model (DOM), for example, by retrieving the desired element by its ID. Currently, no restrictions on embedding have been placed, so in addition to standard HTML, other web components or IFRAME elements can also be used as content.

head-logo

The head-logo slot can be used to change the editor's logo. If the content is not transmitted, the standard Customer's Canvas logo will be displayed.

Pass an HTML content with the head-logo attribute as a child element of au-template-editor as follows:

<au-template-editor>
  <a head-logo href="https://customerscanvas.com/">
     <img width="64" src="https://i.giphy.com/media/RLtIXkhNGVItMov3lZ/giphy.gif" />
  </a>
</au-template-editor>

head-buttons

The head-buttons slot allows you to add custom buttons to the editor's header.

Pass your buttons as child elements of a head-buttons container in au-template-editor.

<au-template-editor>
  <div head-buttons>
    <button>Click me<button>
  </div>
</au-template-editor>