Mellowtel-Elemente Website-Integration mit NPM und CDN

Hier siehst du, wie du Mellowtel-Elemente in deine Website integrieren kannst, entweder mit dem NPM-Paket oder über CDN für eine schnelle Einrichtung.

Option 1: NPM-Paket

Installation

npm install mellowtel-elements

Implementierung

import { MellowtelElements } from 'mellowtel-elements';

// Initialisiere mit deiner Erweiterungs-ID und Konfigurationsschlüssel
const mellowtel = new MellowtelElements('your-extension-id', 'your-config-key');

// Erstelle Elemente
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' });

Option 2: CDN

HTML-Setup

<!DOCTYPE html>
<html>
<head>
    <title>MellowTel-Elemente Beispiel</title>
</head>
<body>
    <!-- Container-Divs für Elemente -->
    <div id="opt-in-container"></div>
    <div id="opt-out-container"></div>
    <div id="settings-container"></div>

    <!-- Laden von CDN -->
    <script src="https://cdn.jsdelivr.net/npm/mellowtel-elements@latest/dist/index.global.js"></script>
    <script>
        // Initialisiere MellowTel-Elemente
        const mellowtel = new window.MellowtelElements.default('your-extension-id', 'your-config-key');

        // Erstelle Elemente
        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>

Perfekt! Jetzt ist deine Website bereit, Mellowtel-Elemente für nahtloses Opt-in, Opt-out und das Verwalten von Einstellungen zu nutzen.

​Option 1: NPM-Paket

​Installation

​Implementierung

​Option 2: CDN

​HTML-Setup

Option 1: NPM-Paket

Installation

Implementierung

Option 2: CDN

HTML-Setup