> ## Documentation Index
> Fetch the complete documentation index at: https://www.mellowtel.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# वेबसाइट्स में Mellowtel तत्वों को लागू करें

यहां आप देखेंगे कि कैसे Mellowtel तत्वों को अपनी वेबसाइट में NPM पैकेज या CDN का उपयोग करके जल्दी सेटअप के लिए एकीकृत किया जा सकता है।

## विकल्प 1: NPM पैकेज

### स्थापना

```bash theme={null}
npm install mellowtel-elements
```

### कार्यान्वयन

```javascript theme={null}
import { MellowtelElements } from 'mellowtel-elements';

// अपने एक्सटेंशन आईडी और कॉन्फ़िग की के साथ प्रारंभ करें
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 सेटअप

```html theme={null}
<!DOCTYPE html>
<html>
<head>
    <title>MellowTel Elements Example</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 तत्वों को प्रारंभ करें
        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 तत्वों का उपयोग करने के लिए तैयार है, जिससे ऑप्ट-इन, ऑप्ट-आउट और सेटिंग्स का प्रबंधन सहज हो जाता है।
