前提条件
モーダルを使用する前に、プロジェクトにMellowtel Elementsが設定されていることを確認してください:拡張機能の統合
ブラウザ拡張機能のセットアップ
ウェブサイトの統合
NPMまたはCDNを使用したウェブサイトのセットアップ
主な機能
- クロスプラットフォーム - ウェブサイトと拡張機能のコンテンツスクリプトで動作
- スマートスヌーズ - ユーザーは1週間、2週間、または永久に無効化を選択可能
- Chromeストレージ - 利用可能な場合はChromeストレージAPIを使用し、ローカルストレージにフォールバック
- シャドウDOM - スタイルの隔離によりホストページのスタイルとの競合を防止
- モバイル対応 - すべての画面サイズに最適化
- 拡張機能の詳細 - 拡張機能の名前とアイコンを自動取得して表示
モーダルの作成
Mellowtel Elementsが初期化されたら(上記の統合ガイドを参照)、サポートモーダルを作成して表示できます:基本的な使用法
使用例
コンテンツスクリプトで
ウェブサイトで
条件付き表示
APIリファレンス
createModal(inviteId, title?, body?)
サポートモーダルを作成して表示します。
パラメータ:
inviteId(string, 必須): モーダルのインタラクションを追跡するための一意の識別子title(string, オプション): カスタムモーダルタイトル(デフォルトは “Support with Mellowtel”)body(string, オプション): カスタムモーダル本文テキスト
Promise<void>
モーダルの動作
スヌーズオプション
ユーザーは3つのスヌーズオプションから選択できます:- 1週間: モーダルは7日間表示されません
- 2週間: モーダルは14日間表示されません
- 無効化: モーダルは二度と表示されません