Skip to main content
The Mellowtel Support Modal is a non-intrusive modal that encourages users to support your extension or website through Support with Mellowtel extension.

Prerequisites

Before using the modal, make sure you have Mellowtel Elements set up in your project:

Extension Integration

Setup for browser extensions

Website Integration

Setup for websites using NPM or CDN

Key Features

  • Cross-Platform - Works in websites and extension content scripts
  • Smart Snoozing - Users can snooze for 1 week, 2 weeks, or disable permanently
  • Chrome Storage - Uses Chrome storage API when available, falls back to localStorage
  • Shadow DOM - Style isolation prevents conflicts with host page styles
  • Mobile Responsive - Optimized for all screen sizes
  • Extension Details - Automatically fetches and displays extension name and icon

Creating the Modal

Once you have Mellowtel Elements initialized (see integration guides above), you can create and display the support modal:

Basic Usage

Usage Examples

In Content Scripts

On Websites

Conditional Display

API Reference

createModal(inviteId, title?, body?)

Creates and displays the support modal. Parameters:
  • inviteId (string, required): Unique identifier for tracking modal interactions
  • title (string, optional): Custom modal title (defaults to “Support with Mellowtel”)
  • body (string, optional): Custom modal body text
Returns: Promise<void>

Snooze Options

Users can choose from three snooze options:
  • 1 week: Modal won’t appear for 7 days
  • 2 weeks: Modal won’t appear for 14 days
  • Disable: Modal will never appear again