Advanced Custom Cards

If you want your Custom Card to contain bespoke content, you can select the 'Customized' option. This will allow you to add HTML, Typescript and CSS.

You will first be presented with a warning message highlighting that you're responsible for the errors / unexpected behaviour that may occur from your bespoke code.

You can revert back at any time by switching the customized setting back to off - this will remove any custom code and return the card to its original form.

Please Note: Custom Cards in Enate execute in Angular 10. Customers who use or are developing advanced custom card content should review the changelog of Angular 10 ( for changes that may affect their custom code.

Selecting the 'Customized' option will will expose HTML, Typescript and CSS tabs on screen.

When you click on one of these tabs, you will see the existing auto-generated code for the Custom Card. You can adjust / overwrite this code as desired.

When you update the Custom Card by adding new Custom Data Fields to it, you will have to disable and re-enable the 'Customized' toggle option in order to generate the customised code for the new fields.

You can see what edits have been made to the Custom Card and when, as well as when the Custom Card was created, and even when a Custom Card was deleted by clicking on the Show Activity button.

Custom Card Code Examples

Check out the Custom Card Code section of the Enate Extensions area to learn more about the code you can write and how to interact with data fields and validation.

Last updated