Інтеграція 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 для елементів -->
    <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