Support Center

Creating Alert Templates

The Alert Templates tool lets you design and preview the email and SMS notifications that your Malet sends to Visitors. From Murchase confirmations to welcome messages, you can craft professional templates, test different variations, and see exactly what your Visitors will receive — all from the Admin Dashboard.

NOTE

Templates you create in this tool are saved locally on your device and can be exported as JSON files. They serve as a design workspace — when backend template management is available, your templates will sync to the platform automatically.

Accessing the Template Maker

  1. Navigate to /admin (the Admin Dashboard)
  2. Click the Templates tab in the navigation bar
  3. The template editor loads with a sidebar, editor, and preview panel

Creating Your First Template

Quick Start

  1. Click the + button in the top-right corner of the sidebar
  2. Enter a name for your template (e.g., "Welcome Email" or "Murchase Confirmation")
  3. Choose the channel: Email or SMS
  4. Click Create

Your new template appears in the sidebar list and is automatically selected for editing.

Template Channels

Channel Best For Features
Email Murchase confirmations, welcome messages, newsletters HTML body, subject line, rich formatting, desktop/mobile preview
SMS Time-sensitive alerts, Murchase status updates, verification codes Plain text body, 160-character segment awareness

Editing Templates

Name and Channel

Click the template name at the top of the editor to rename it. Use the channel toggle buttons to switch between Email and SMS modes.

Subject Line (Email Only)

For email templates, type your subject line in the Subject Line field. This is what Visitors see in their inbox before opening the email.

Example: Your Murchase #{{orderNumber}} has been confirmed!

Template Body

The large text area is where you write your template content. For email, you can use full HTML. For SMS, write plain text.

Using Variables

Variables let you personalize each notification with dynamic content. Wrap variable names in double curly braces:

Hello {{name}},

Your Murchase #{{orderNumber}} has been confirmed.
Total: {{totalAmount}}

Thank you for shopping at {{maletName}}!

Available variables depend on the notification type. Common variables include:

Variable Description Example Value
{{name}} Visitor's display name "Jane Smith"
{{email}} Visitor's email address "jane@example.com"
{{orderNumber}} Murchase reference number "MRC-2026-0042"
{{totalAmount}} Murchase total amount "R450.00"
{{maletName}} Your Malet's display name "Luminara Crafts"
{{status}} Current Murchase status "Shipped"

TIP

You don't need to remember variable names! The Variable Inspector (below the editor) automatically detects all variables used in your template and lets you fill in sample values to see them rendered in the preview.

Variable Inspector

As you type {{variableName}} in your template, the editor automatically detects each variable and displays it in the Variable Inspector panel below the body editor.

For each detected variable, you'll see:

  • The variable name highlighted in purple (e.g., {{name}})
  • A sample value input field

Type sample values to see them appear in the live preview. This helps you visualize exactly how the final notification will look.

A/B Variant Comparison

Want to test different wordings? The variant system lets you create up to 3 alternative versions of your template.

Adding a Variant

  1. Click + Add Variant above the body editor
  2. A new variant tab appears (labeled Variant A, B, or C)
  3. Click the variant tab to edit its subject and body independently

Comparing Variants

Click the ⇄ Compare button to view all variants side-by-side in the preview panel. This makes it easy to spot differences and choose the strongest wording.

NOTE

Variants share the same sample data, so variable values are consistent across all versions. Only the subject line and body text differ between variants.

Removing a Variant

Click the × button on any variant tab to delete it. This doesn't affect your main template.

Live Preview

The right-side Preview Panel shows a real-time rendering of your template with sample data substituted into the variables.

Email Preview

Your email template renders inside a browser-chrome mockup that shows:

  • Traffic light dots (the classic red/yellow/green window buttons)
  • From address: noreply@ngwenya.app
  • Subject line with your sample data applied
  • Email body rendered as HTML in a sandboxed preview

SMS Preview

Your SMS template renders inside a phone mockup that shows:

  • A realistic phone frame with notch and carrier bar
  • Your message in a blue iMessage-style bubble
  • Character count with a warning if your message exceeds 160 characters (which would be sent as multiple SMS segments)

Desktop vs. Mobile

Toggle between đŸ–Ĩ Desktop and 📱 Mobile views using the buttons at the top of the preview panel. The mobile view constrains the preview to a 375px width, simulating how your email looks on a phone screen.

Managing Templates

The sidebar shows all your templates with:

  • Channel icon (✉ for Email, đŸ’Ŧ for SMS)
  • Template name
  • Variant count

Search and Filter

  • Search bar: Type to filter templates by name
  • Channel pills: Click All, Email, or SMS to filter by channel

Duplicating a Template

Click the ⧉ Duplicate button in the editor header to create a copy of the current template. The copy is named with a " (Copy)" suffix.

Deleting a Template

Click the 🗑 Delete button in the editor header. A confirmation dialog will appear before the template is permanently removed.

WARNING

Deleted templates cannot be recovered. Consider exporting a JSON backup before deleting.

Exporting and Importing

Export a Single Template

  1. Select the template you want to export
  2. Click the ↓ Export button in the editor header
  3. A JSON file downloads to your device

Export All Templates

Click the Export All button at the bottom of the sidebar. This downloads a single JSON file containing all your templates.

Importing Templates

Import a previously exported JSON file using the import function. All imported templates receive new unique IDs, so they won't conflict with existing templates.

TIP

Use export/import to transfer templates between team members or to back up your work before making major changes.

Frequently Asked Questions

Q: Where are my templates stored? Templates are stored locally in your browser. They persist across sessions but are tied to your device. Use the Export function to back up your work or share with team members.

Q: Can I use HTML in SMS templates? No. SMS templates are plain text only. Any HTML tags in an SMS template will be sent as literal text, which would look messy on the Visitor's phone. Use HTML only for Email templates.

Q: What happens if my SMS message is longer than 160 characters? Messages longer than 160 characters are sent as multiple SMS segments. The preview panel shows a character count and displays a yellow "multi-segment" warning when your message exceeds the limit.

Q: Can I preview my template on both desktop and mobile? Yes! Use the device toggle buttons (đŸ–Ĩ / 📱) at the top of the preview panel to switch between desktop and mobile views.

Q: Will my templates automatically be used for real notifications? Not yet. The template maker is currently a design tool. Your exported JSON files can be deployed to the platform by your development team. Future updates will add direct integration for seamless deployment.

Q: How many variants can I create per template? Up to 3 variants (A, B, and C) per template. Each variant independently overrides the subject line and body text.