---
title: "ড্যাশবোর্ডে একটি ওয়েব উইজেট তৈরি করুন"
description: "Web Widgets পৃষ্ঠা থেকে আপনার সাইটের জন্য একটি ক্লিক-টু-টক উইজেট সেট আপ করুন — কোনো API কলের প্রয়োজন নেই।"
---

**Web Widgets** পৃষ্ঠা (`/dashboard/web-widgets`) ThunderPhone-এর এমবেডযোগ্য ভয়েস উইজেট চালানোর জন্য প্রকাশযোগ্য কী তৈরি ও পরিচালনা করে।
এই গাইডের [API সংস্করণ](/bn/guides/embed-web-widget) cURL দিয়ে যা করে, এই পৃষ্ঠা ফর্মের মাধ্যমে তা করে — পাশাপাশি এটি আপনার জন্য এমবেড কোডও তৈরি করে।

## একটি উইজেট তৈরি করুন

<Steps>
  <Step title="নতুন উইজেট-এ ক্লিক করুন এবং একটি মোড বেছে নিন">
    - **এজেন্ট মোড** — উইজেটটি সবসময় ড্রপডাউন থেকে আপনার বেছে নেওয়া একটি এজেন্ট চালায়। সবচেয়ে সহজ সেটআপ।
    - **ওয়েবহুক মোড** — প্রতিটি উইজেট সেশনে ThunderPhone আপনার ওয়েবহুক URL-এ কল করে এবং আপনার সার্ভার সেই ভিজিটরের জন্য এজেন্ট কনফিগারেশন ফেরত দেয় (পৃষ্ঠা-ভিত্তিক রাউটিং, লগইন করা ব্যবহারকারী, রোলআউট)। আপনার প্রতিষ্ঠানের ডিফল্ট ওয়েবহুক ব্যবহার করতে URL খালি রাখুন; নতুন URL দিলে সেটি প্রতিষ্ঠানের ডিফল্ট হিসেবেও নির্ধারণ করতে পারেন।
  </Step>
  <Step title="অনুমোদিত ডোমেইন তালিকাভুক্ত করুন">
    প্রকাশযোগ্য কী অরিজিন-লকড: অন্তত একটি ডোমেইন প্রয়োজন, এবং উইজেটটি শুধু আপনার তালিকাভুক্ত হোস্টনেমে কাজ করে। `*.example.com`-এর মতো সাবডোমেইন ওয়াইল্ডকার্ড অনুমোদিত (এগুলো সাবডোমেইনের সঙ্গে মেলে, মূল ডোমেইনের সঙ্গে নয়); `*`-এর মতো মূল ওয়াইল্ডকার্ড প্রত্যাখ্যাত হয়।
    `localhost` এবং `127.0.0.1` সবসময় অনুমোদিত, তাই তালিকায় যোগ না করেও স্থানীয় ডেভেলপমেন্ট কাজ করে।
  </Step>
  <Step title="নাম দিন, সক্ষম করুন, তৈরি করুন">
    **উইজেট সক্ষম করুন** টগলটি নিয়ন্ত্রণ করে কীটি সেশন গ্রহণ করবে কি না — আপনি একটি উইজেট নিষ্ক্রিয় অবস্থায় তৈরি করে চালুর সময় সক্রিয় করতে পারেন।
  </Step>
</Steps>

## এমবেড কোড নিন

তৈরির পরপরই (অথবা প্রতিটি সারির **এমবেড** বোতামের মাধ্যমে), একটি এমবেড ডায়ালগ আপনার প্রকাশযোগ্য কী পূরণ করা প্রস্তুত-পেস্ট কোড তৈরি করে:

- **React** — বান্ডলার অ্যাপের জন্য একটি `<ThunderPhoneWidget />` স্নিপেট।
- **Script tag** — যেকোনো সাইটের জন্য একটি CDN `<script>` + স্টাইলশিট জোড়া।

ডায়ালগটি মৌলিক উপস্থিতি বিকল্পও প্রিভিউ করে — শিরোনাম, প্রাথমিক রং, কোণার অবস্থান এবং হালকা/গাঢ় থিম — এবং আপনার পছন্দগুলো স্নিপেটে অন্তর্ভুক্ত করে। সম্পূর্ণ prop রেফারেন্স, স্টাইলিং হুক এবং হেডলেস বিকল্পের জন্য [উইজেট SDK ডকস](/bn/widget/overview) দেখুন।

<Note>
  প্রকাশযোগ্য কী (`pk_live_…`) নকশাগতভাবেই সর্বজনীন — ফ্রন্ট-এন্ড কোডে পাঠানো নিরাপদ। এর সারির কপি বোতাম দিয়ে যেকোনো সময় একটি কপি করুন।
</Note>

## তালিকা থেকে উইজেট পরিচালনা করুন

প্রতিটি সারি একই স্থানে সম্পাদনা করা যায়:

- **মোড / এজেন্ট** — ইনলাইন সিলেক্ট দিয়ে এজেন্ট ও ওয়েবহুক মোডের মধ্যে পরিবর্তন করুন, অথবা এজেন্ট পরিবর্তন করুন।
- **ডোমেইন** — চিপ হিসেবে অনুমোদিত ডোমেইন যোগ বা সরান।
- **সক্ষম/নিষ্ক্রিয়** — প্রতিটি উইজেটের জন্য একটি সুইচ; নিষ্ক্রিয় উইজেট অবিলম্বে সেশন গ্রহণ বন্ধ করে।
- **প্রতিষ্ঠানে স্থানান্তর** — আপনার সদস্যভুক্ত অন্য প্রতিষ্ঠানে উইজেটটি কপি বা স্থানান্তর করুন (স্থানান্তর করলে এটি এখান থেকে সরানো হয়)।
- **মুছুন** — প্রকাশযোগ্য কী বাতিল করে; সব ডোমেইনে উইজেটটি অবিলম্বে কাজ করা বন্ধ করে। এটি পূর্বাবস্থায় ফেরানো যায় না।

উইজেট সেশনগুলো [কল ইতিহাসে](/bn/guides/review-calls) ফোন কলের মতো একই ট্রান্সক্রিপ্ট, রেকর্ডিং এবং গ্রেডিংসহ দেখা যায়।

## পরবর্তী ধাপ

<CardGroup cols={2}>
  <Card title="উইজেট SDK রেফারেন্স" icon="window-maximize" href="/bn/widget/overview">
    React কম্পোনেন্ট, হেডলেস হুক এবং CDN স্ক্রিপ্টের বিবরণ।
  </Card>
  <Card title="ওয়েবহুক-মোড রাউটিং" icon="bolt" href="/bn/guides/dynamic-call-config">
    আপনার সার্ভার থেকে ভিজিটর-ভিত্তিক এজেন্ট কনফিগারেশন ফেরত দিন।
  </Card>
</CardGroup>
