​

Managing Templates

​

Template Editor

​

Accessing the Editor

1. Go to Templates in the sidebar
2. Click Create Template or select an existing template
3. The visual editor opens with the canvas and toolbar

​

Editor Layout

​

Creating a Template

​

Step 1: Set Canvas Size

​

Step 2: Add Elements

• Text - Headlines, body text, captions
• Image - Logos, photos, icons
• Shape - Rectangles, circles, custom shapes
• Container - Group elements together

​

Step 3: Style Elements

• Font family, size, weight
• Color and opacity
• Alignment and line height
• Letter spacing

• Source URL or upload
• Fit mode (cover, contain, fill)
• Border radius
• Filters and effects

• Fill color or gradient
• Border width and color
• Shadow effects
• Opacity

​

Step 4: Add Variables

1. Click Add Variable
2. Enter a name (e.g., title, author)
3. Set the type (string, number, boolean, image)
4. Optionally set a default value

{{title}}
{{author.name}}
{{currency(price, 'USD')}}

​

Step 5: Save Template

1. Click Save
2. Enter a name and description
3. Click Create Template

​

Template Settings

​

General Settings

​

Render Settings

​

Access Settings

​

Working with Variables

​

Variable Types

​

Using Variables in Text

Hello, {{name}}!
You have {{count}} new messages.
Total: {{currency(price, 'USD')}}

​

Conditional Elements

1. Select an element
2. In Properties, find Conditional
3. Enter a condition: isPremium or count > 0

​

Default Values

1. Click the variable in the Variables panel
2. Enter a Default Value
3. This value is used when the variable isn’t provided

​

Organizing Templates

​

Folders

1. Click New Folder in the Templates view
2. Name your folder
3. Drag templates into folders

​

Tags

1. Open template settings
2. Add tags in the Tags field
3. Filter by tags in the Templates list

​

Search

• Name
• Description
• Tags
• Variable names

​

Duplicating Templates

1. Click the … menu on a template
2. Select Duplicate
3. Edit the copy as needed

​

Deleting Templates

1. Click the … menu on a template
2. Select Delete
3. Confirm deletion

​

Version History

1. Open a template
2. Click History in the toolbar
3. Browse previous versions
4. Click Restore to revert

​

Previewing Templates

​

In-Editor Preview

1. Click Preview in the toolbar
2. Enter sample variable values
3. See the rendered result

​

Test Renders

1. Click Test Render
2. Fill in variables
3. Click Generate
4. View or download the result

​

Exporting Templates

​

Export as JSON

1. Click … menu
2. Select Export
3. Download the JSON file

​

Import Template

1. Click Import in the Templates view
2. Select your JSON file
3. Review and save

​

Keyboard Shortcuts

​

Best Practices

​

Design Tips

1. Use a grid - Enable snap-to-grid for alignment
2. Set up styles - Create reusable colors and fonts
3. Group related elements - Keep layers organized
4. Test at different sizes - Preview on various devices

​

Variable Naming

✅ title, authorName, publishDate
❌ t, var1, x

​

Performance

1. Optimize images - Use appropriate sizes
2. Limit fonts - Load only needed weights
3. Simplify gradients - Complex gradients slow rendering
4. Test render time - Keep under 5 seconds