---
title: "ಡ್ಯಾಶ್‌ಬೋರ್ಡ್‌ನಲ್ಲಿ ವೆಬ್ ವಿಜೆಟ್ ರಚಿಸಿ"
description: "ವೆಬ್ ವಿಜೆಟ್‌ಗಳ ಪುಟದಿಂದ ನಿಮ್ಮ ಸೈಟ್‌ಗಾಗಿ ಕ್ಲಿಕ್-ಟು-ಟಾಕ್ ವಿಜೆಟ್ ಅನ್ನು ಹೊಂದಿಸಿ — API ಕರೆಗಳ ಅಗತ್ಯವಿಲ್ಲ."
---

**ವೆಬ್ ವಿಜೆಟ್‌ಗಳು** ಪುಟವು (`/dashboard/web-widgets`) ThunderPhone ನ ಎಂಬೆಡ್ ಮಾಡಬಹುದಾದ ಧ್ವನಿ ವಿಜೆಟ್‌ಗೆ ಶಕ್ತಿ ನೀಡುವ
ಪ್ರಕಟಿಸಬಹುದಾದ ಕೀಲಿಗಳನ್ನು ರಚಿಸುತ್ತದೆ ಮತ್ತು ನಿರ್ವಹಿಸುತ್ತದೆ.
ಈ ಮಾರ್ಗದರ್ಶಿಯ [API ಆವೃತ್ತಿ](/kn/guides/embed-web-widget)
cURL ಮೂಲಕ ಮಾಡುವ ಎಲ್ಲವನ್ನೂ, ಈ ಪುಟವು ಫಾರ್ಮ್ ಮೂಲಕ ಮಾಡುತ್ತದೆ — ಜೊತೆಗೆ ಇದು ನಿಮಗಾಗಿ ಎಂಬೆಡ್
ಕೋಡ್ ಅನ್ನೂ ರಚಿಸುತ್ತದೆ.

## ವಿಜೆಟ್ ರಚಿಸಿ

<Steps>
  <Step title="ಹೊಸ ವಿಜೆಟ್ ಕ್ಲಿಕ್ ಮಾಡಿ ಮತ್ತು ಮೋಡ್ ಆಯ್ಕೆಮಾಡಿ">
    - **ಏಜೆಂಟ್ ಮೋಡ್** — ವಿಜೆಟ್ ಯಾವಾಗಲೂ ಡ್ರಾಪ್‌ಡೌನ್‌ನಿಂದ ನೀವು ಆಯ್ಕೆಮಾಡುವ ಒಂದು ಏಜೆಂಟ್ ಅನ್ನು ಚಲಾಯಿಸುತ್ತದೆ. ಅತ್ಯಂತ ಸರಳವಾದ ಸೆಟಪ್.
    - **Webhook ಮೋಡ್** — ಪ್ರತಿ ವಿಜೆಟ್ ಸೆಷನ್‌ನಲ್ಲಿ, ThunderPhone ನಿಮ್ಮ webhook URL ಗೆ ಕರೆ ಮಾಡುತ್ತದೆ
      ಮತ್ತು ನಿಮ್ಮ ಸರ್ವರ್ ಆ ಸಂದರ್ಶಕರಿಗೆ ಏಜೆಂಟ್ ಕಾನ್ಫಿಗರೇಶನ್ ಅನ್ನು ಹಿಂದಿರುಗಿಸುತ್ತದೆ
      (ಪ್ರತಿ-ಪುಟ ರೂಟಿಂಗ್, ಲಾಗಿನ್ ಆಗಿರುವ ಬಳಕೆದಾರರು, ರೋಲ್‌ಔಟ್‌ಗಳು).
      ನಿಮ್ಮ ಸಂಸ್ಥೆಯ ಡೀಫಾಲ್ಟ್ webhook ಬಳಸಲು URL ಅನ್ನು ಖಾಲಿ ಬಿಡಿ;
      ಹೊಸ URL ನಮೂದಿಸಿದಾಗ, ಅದನ್ನು ಸಂಸ್ಥೆಯ ಡೀಫಾಲ್ಟ್ ಆಗಿಯೂ ಹೊಂದಿಸಬಹುದು.
  </Step>
  <Step title="ಅನುಮತಿಸಲಾದ ಡೊಮೇನ್‌ಗಳನ್ನು ಪಟ್ಟಿ ಮಾಡಿ">
    ಪ್ರಕಟಿಸಬಹುದಾದ ಕೀಲಿಗಳು ಮೂಲ-ಲಾಕ್ ಆಗಿರುತ್ತವೆ: ಕನಿಷ್ಠ ಒಂದು ಡೊಮೇನ್ ಅಗತ್ಯವಿದೆ,
    ಮತ್ತು ನೀವು ಪಟ್ಟಿ ಮಾಡುವ ಹೋಸ್ಟ್‌ಹೆಸರುಗಳಲ್ಲಷ್ಟೇ ವಿಜೆಟ್ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ. `*.example.com` ನಂತಹ
    ಸಬ್‌ಡೊಮೇನ್ ವೈಲ್ಡ್‌ಕಾರ್ಡ್‌ಗಳನ್ನು ಅನುಮತಿಸಲಾಗುತ್ತದೆ (ಅವು ಸಬ್‌ಡೊಮೇನ್‌ಗಳಿಗೆ ಹೊಂದುತ್ತವೆ,
    ಮೂಲ ಡೊಮೇನ್‌ಗೆ ಅಲ್ಲ); `*` ನಂತಹ ಮೂಲ ವೈಲ್ಡ್‌ಕಾರ್ಡ್‌ಗಳನ್ನು ತಿರಸ್ಕರಿಸಲಾಗುತ್ತದೆ.
    `localhost` ಮತ್ತು `127.0.0.1` ಅನ್ನು ಯಾವಾಗಲೂ ಅನುಮತಿಸಲಾಗುತ್ತದೆ, ಆದ್ದರಿಂದ ಸ್ಥಳೀಯ ಅಭಿವೃದ್ಧಿ
    ಅವುಗಳನ್ನು ಪಟ್ಟಿ ಮಾಡದೆಯೇ ಕಾರ್ಯನಿರ್ವಹಿಸುತ್ತದೆ.
  </Step>
  <Step title="ಹೆಸರಿಸಿ, ಸಕ್ರಿಯಗೊಳಿಸಿ, ರಚಿಸಿ">
    **ವಿಜೆಟ್ ಸಕ್ರಿಯಗೊಳಿಸಿ** ಟಾಗಲ್, ಕೀಲಿಯು ಸೆಷನ್‌ಗಳನ್ನು ಸ್ವೀಕರಿಸಬೇಕೇ ಎಂಬುದನ್ನು ನಿಯಂತ್ರಿಸುತ್ತದೆ —
    ನೀವು ವಿಜೆಟ್ ಅನ್ನು ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಿದ ಸ್ಥಿತಿಯಲ್ಲಿ ರಚಿಸಿ, ಪ್ರಾರಂಭದ ಸಮಯದಲ್ಲಿ ಅದನ್ನು ಸಕ್ರಿಯಗೊಳಿಸಬಹುದು.
  </Step>
</Steps>

## ಎಂಬೆಡ್ ಕೋಡ್ ಪಡೆಯಿರಿ

ರಚಿಸಿದ ತಕ್ಷಣವೇ (ಅಥವಾ ಪ್ರತಿ ಸಾಲಿನ **ಎಂಬೆಡ್** ಬಟನ್ ಮೂಲಕ), ಎಂಬೆಡ್
ಸಂವಾದವು ನಿಮ್ಮ ಪ್ರಕಟಿಸಬಹುದಾದ ಕೀಲಿಯನ್ನು ತುಂಬಿರುವ, ಅಂಟಿಸಲು ಸಿದ್ಧವಾದ ಕೋಡ್ ಅನ್ನು
ರಚಿಸುತ್ತದೆ:

- **React** — ಬಂಡ್ಲರ್ ಅಪ್ಲಿಕೇಶನ್‌ಗಳಿಗಾಗಿ `<ThunderPhoneWidget />` ಸ್ನಿಪೆಟ್.
- **ಸ್ಕ್ರಿಪ್ಟ್ ಟ್ಯಾಗ್** — ಯಾವುದೇ ಸೈಟ್‌ಗಾಗಿ CDN `<script>` + ಸ್ಟೈಲ್‌ಶೀಟ್ ಜೋಡಿ.

ಸಂವಾದವು ಶೀರ್ಷಿಕೆ, ಪ್ರಾಥಮಿಕ
ಬಣ್ಣ, ಮೂಲೆಯ ಸ್ಥಾನ ಮತ್ತು ಲೈಟ್/ಡಾರ್ಕ್ ಥೀಮ್ ಸೇರಿದಂತೆ ಮೂಲಭೂತ ರೂಪದ ಆಯ್ಕೆಗಳನ್ನು ಪೂರ್ವವೀಕ್ಷಿಸುತ್ತದೆ
ಮತ್ತು ನಿಮ್ಮ ಆಯ್ಕೆಗಳನ್ನು ಸ್ನಿಪೆಟ್‌ನಲ್ಲಿ ಸೇರಿಸುತ್ತದೆ. ಸಂಪೂರ್ಣ prop ಉಲ್ಲೇಖ, ಸ್ಟೈಲಿಂಗ್ ಹುಕ್‌ಗಳು ಮತ್ತು
ಹೆಡ್‌ಲೆಸ್ ಆಯ್ಕೆಗಾಗಿ, [ವಿಜೆಟ್ SDK ದಸ್ತಾವೇಜುಗಳನ್ನು](/kn/widget/overview) ನೋಡಿ.

<Note>
  ಪ್ರಕಟಿಸಬಹುದಾದ ಕೀಲಿಗಳು (`pk_live_…`) ವಿನ್ಯಾಸದ ಪ್ರಕಾರ ಸಾರ್ವಜನಿಕವಾಗಿವೆ — ಅವುಗಳನ್ನು
  ಫ್ರಂಟ್-ಎಂಡ್ ಕೋಡ್‌ನಲ್ಲಿ ಬಳಸುವುದು ಸುರಕ್ಷಿತ. ಅದರ ಸಾಲಿನಲ್ಲಿರುವ ನಕಲು ಬಟನ್ ಬಳಸಿ ಯಾವಾಗ ಬೇಕಾದರೂ ಒಂದನ್ನು ನಕಲಿಸಿ.
</Note>

## ಪಟ್ಟಿಯಿಂದ ವಿಜೆಟ್‌ಗಳನ್ನು ನಿರ್ವಹಿಸಿ

ಪ್ರತಿ ಸಾಲನ್ನು ಸ್ಥಳದಲ್ಲಿಯೇ ಸಂಪಾದಿಸಬಹುದು:

- **ಮೋಡ್ / ಏಜೆಂಟ್** — ಇನ್‌ಲೈನ್ ಆಯ್ಕೆಗಳ ಮೂಲಕ ಏಜೆಂಟ್ ಮತ್ತು webhook ಮೋಡ್ ನಡುವೆ ಬದಲಾಯಿಸಿ,
  ಅಥವಾ ಏಜೆಂಟ್ ಅನ್ನು ಮರುನಿರ್ದೇಶಿಸಿ.
- **ಡೊಮೇನ್‌ಗಳು** — ಚಿಪ್‌ಗಳಾಗಿ ಅನುಮತಿಸಲಾದ ಡೊಮೇನ್‌ಗಳನ್ನು ಸೇರಿಸಿ ಅಥವಾ ತೆಗೆದುಹಾಕಿ.
- **ಸಕ್ರಿಯಗೊಳಿಸಿ/ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಿ** — ಪ್ರತಿ ವಿಜೆಟ್‌ಗೆ ಒಂದು ಸ್ವಿಚ್; ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಿದ ವಿಜೆಟ್‌ಗಳು
  ತಕ್ಷಣವೇ ಸೆಷನ್‌ಗಳನ್ನು ಸ್ವೀಕರಿಸುವುದನ್ನು ನಿಲ್ಲಿಸುತ್ತವೆ.
- **ಸಂಸ್ಥೆಗೆ ವರ್ಗಾಯಿಸಿ** — ನೀವು ಸೇರಿದ ಮತ್ತೊಂದು ಸಂಸ್ಥೆಗೆ ವಿಜೆಟ್ ಅನ್ನು ನಕಲಿಸಿ ಅಥವಾ ಸರಿಸಿ
  (ಸರಿಸುವುದರಿಂದ ಅದನ್ನು ಇಲ್ಲಿಂದ ತೆಗೆದುಹಾಕಲಾಗುತ್ತದೆ).
- **ಅಳಿಸಿ** — ಪ್ರಕಟಿಸಬಹುದಾದ ಕೀಲಿಯನ್ನು ರದ್ದುಗೊಳಿಸುತ್ತದೆ; ವಿಜೆಟ್ ಎಲ್ಲಾ ಡೊಮೇನ್‌ಗಳಲ್ಲಿ
  ತಕ್ಷಣವೇ ಕಾರ್ಯನಿರ್ವಹಿಸುವುದನ್ನು ನಿಲ್ಲಿಸುತ್ತದೆ. ಇದನ್ನು ಹಿಂತಿರುಗಿಸಲು ಸಾಧ್ಯವಿಲ್ಲ.

ವಿಜೆಟ್ ಸೆಷನ್‌ಗಳು [ಕರೆ ಇತಿಹಾಸದಲ್ಲಿ](/kn/guides/review-calls), ಫೋನ್ ಕರೆಗಳಂತೆಯೇ
ಟ್ರಾನ್ಸ್‌ಕ್ರಿಪ್ಟ್, ರೆಕಾರ್ಡಿಂಗ್ ಮತ್ತು ಗ್ರೇಡಿಂಗ್‌ನೊಂದಿಗೆ ಕಾಣಿಸುತ್ತವೆ.

## ಮುಂದಿನ ಹಂತಗಳು

<CardGroup cols={2}>
  <Card title="ವಿಜೆಟ್ SDK ಉಲ್ಲೇಖ" icon="window-maximize" href="/kn/widget/overview">
    React ಘಟಕ, ಹೆಡ್‌ಲೆಸ್ ಹುಕ್ ಮತ್ತು CDN ಸ್ಕ್ರಿಪ್ಟ್ ವಿವರಗಳು.
  </Card>
  <Card title="Webhook-ಮೋಡ್ ರೂಟಿಂಗ್" icon="bolt" href="/kn/guides/dynamic-call-config">
    ನಿಮ್ಮ ಸರ್ವರ್‌ನಿಂದ ಪ್ರತಿ-ಸಂದರ್ಶಕ ಏಜೆಂಟ್ ಕಾನ್ಫಿಗ್ ಅನ್ನು ಹಿಂದಿರುಗಿಸಿ.
  </Card>
</CardGroup>