Интеграция Mellowtel Elements с веб-сайтом через NPM и CDN

Здесь вы узнаете, как интегрировать Mellowtel Elements в ваш веб-сайт, используя либо пакет NPM, либо CDN для быстрой настройки.

Вариант 1: Пакет NPM

Установка

npm install mellowtel-elements

Реализация

import { MellowtelElements } from 'mellowtel-elements';

// Инициализация с вашим ID расширения и ключом конфигурации
const mellowtel = new MellowtelElements('your-extension-id', 'your-config-key');

// Создание элементов
await mellowtel.createElement('opt-in-container', { type: 'opt-in' });
await mellowtel.createElement('opt-out-container', { type: 'opt-out' });
await mellowtel.createElement('settings-container', { type: 'settings' });

Вариант 2: CDN

Настройка HTML

<!DOCTYPE html>
<html>
<head>
    <title>Пример MellowTel Elements</title>
</head>
<body>
    <!-- Контейнеры для элементов -->
    <div id="opt-in-container"></div>
    <div id="opt-out-container"></div>
    <div id="settings-container"></div>

    <!-- Загрузка из CDN -->
    <script src="https://cdn.jsdelivr.net/npm/mellowtel-elements@latest/dist/index.global.js"></script>
    <script>
        // Инициализация MellowTel Elements
        const mellowtel = new window.MellowtelElements.default('your-extension-id', 'your-config-key');

        // Создание элементов
        mellowtel.createElement('opt-in-container', { type: 'opt-in' });
        mellowtel.createElement('opt-out-container', { type: 'opt-out' });
        mellowtel.createElement('settings-container', { type: 'settings' });
    </script>
</body>
</html>

Отлично! Теперь ваш веб-сайт готов использовать Mellowtel Elements для бесшовной подписки, отписки и управления настройками.

Интеграция расширения Модальное окно поддержки

​Вариант 1: Пакет NPM

​Установка

​Реализация

​Вариант 2: CDN

​Настройка HTML

Вариант 1: Пакет NPM

Установка

Реализация

Вариант 2: CDN

Настройка HTML