Skip to main content

Template Builder

The template builder provides a visual drag-and-drop interface for creating custom templates. Build complex form structures without any coding.

Accessing the Template Builder​

  1. Go to Templates in the sidebar
  2. Click Create New Template
  3. The template builder opens

Builder Interface​

Component Palette​

On the left side, you'll find all available components:

Standard Blocks:

  • Text Editor
  • Callout
  • Divider

Form Elements:

  • Toggle Switch
  • Checkbox
  • Text Input
  • Static Text
  • Number
  • Date/Time
  • Slider
  • Rating
  • Dropdown

Canvas​

The center area where you build your template by dropping and arranging components.

Properties Panel​

When you select a component, configuration options appear for customizing that element.

Building a Template​

Add Components​

  1. Click on a component in the palette
  2. It opens a configuration dialog
  3. Set the component properties
  4. Click Add to place it on the canvas

Or drag components from the palette to the canvas:

  1. Click and hold a component
  2. Drag to the canvas
  3. Release to drop
  4. Configure in the dialog that appears

Configure Components​

Each component has configurable properties:

Static Text​

  • Content - The text to display
  • Variant - Heading level (H1-H6) or body text
  • Alignment - Left, center, or right
  • Styling - Bold, italic, color

Text Input​

  • Label - Field label
  • Placeholder - Hint text
  • Default Value - Pre-filled value
  • Required - Make field mandatory
  • Max Length - Character limit

Toggle Switch​

  • Label - Field label
  • On Label - Text when on (e.g., "Yes")
  • Off Label - Text when off (e.g., "No")
  • Default Value - Initial state

Number Input​

  • Label - Field label
  • Min/Max - Value boundaries
  • Step - Increment amount
  • Unit - Suffix (e.g., "$", "kg")
  • Default Value - Starting value

Date/Time​

  • Label - Field label
  • Mode - Date, time, or both
  • Default Value - Now, tag creation, or specific date

Slider​

  • Label - Field label
  • Min/Max - Range boundaries
  • Step - Increment
  • Show Value - Display current value
  • Unit - Suffix label

Rating​

  • Label - What's being rated
  • Max Rating - Number of stars (1-10)
  • Allow Half - Half-star ratings
  • Icon - Star, heart, or thumb
  • Size - Small, medium, large
  • Label - Field label
  • Options - List of choices
  • Multiple - Allow multi-select
  • Searchable - Enable filtering

Reorder Components​

  1. Click and hold a component's drag handle
  2. Drag to new position
  3. Release to drop

Delete Components​

  1. Hover over a component
  2. Click the trash icon
  3. Component is removed

Saving Your Template​

Template Details​

Before saving, provide:

  • Name - Descriptive template name
  • Description - What the template is for
  • Category - Business, Personal, Events, Products, Forms, or Other

Preview​

Click Preview to see how tags created from this template will look.

Save​

Click Save Template to save your template. It will appear in your template list.

Template Categories​

Choose the most appropriate category:

CategoryBest For
BusinessProfessional contacts, invoices
PersonalPersonal info, social links
EventsTickets, RSVPs, schedules
ProductsInventory, catalogs, specs
FormsSurveys, feedback, applications
OtherAnything else

Example: Building a Maintenance Checklist​

  1. Add Static Text - "Equipment Maintenance Checklist" as H2
  2. Add Text Input - "Equipment ID" with placeholder
  3. Add Date/Time - "Inspection Date" defaulting to now
  4. Add Checkbox - "Fluid levels checked"
  5. Add Checkbox - "Safety equipment inspected"
  6. Add Checkbox - "No visible damage"
  7. Add Rating - "Overall Condition" with 5 stars
  8. Add Toggle - "Passed Inspection" with Yes/No labels
  9. Add Text Input - "Notes" with larger max length
  10. Save as "Maintenance Checklist" in Products category

Tips and Best Practices​

Structure​

  • Start with a header (Static Text)
  • Group related fields together
  • Use dividers between sections
  • End with summary or action fields

Labels​

  • Keep labels clear and concise
  • Use consistent terminology
  • Add help text for complex fields

Defaults​

  • Set sensible default values
  • Use "now" for date fields when appropriate
  • Pre-select common options

Validation​

  • Mark truly required fields as required
  • Set reasonable min/max limits
  • Don't over-restrict

Testing​

  • Always preview before saving
  • Create a test tag from the template
  • Try filling it out yourself
  • Check mobile responsiveness

Editing Templates​

To modify an existing custom template:

  1. Go to Templates
  2. Find your template
  3. Click ⋮ → Edit
  4. Make changes in the builder
  5. Save

Note: Changes don't affect tags already created from the template.

Next Steps​