ragbot widget demo

Local test page for the embeddable chat widget. Set the API endpoint below and reload — the widget bubble will appear in the bottom-right corner.

Embed snippet

<script
  src="https://chat.budhathokidriving.com/widget.js"
  data-api="https://chat.budhathokidriving.com/api/chat"
  data-name="Budhathoki Sahayak"
  data-color="#1e40af"
  data-greeting="🙏 नमस्ते , हजुरलाई बुढाथोकी ड्राइभिङको च्याटमा स्वागत छ।  ड्राइभिङ कोर्स, लाइसेन्स वा ट्रायलका बारे केहि सोध्नुहोस्।"
  data-logo="https://budhathokidriving.com/files/Budhathoki-Driving-School-tlogo.png"
  data-turnstile-site-key="0x4AAAAAADDj5Lk-hmsjbm0j"
  data-quick-replies='[{"label":"...","answer":"..."}]'
  data-contact-links='[{"label":"Call","url":"tel:01-663-1376","icon":"phone"}]'
  data-user-name="(only when host site has a logged-in user)"
></script>

data-turnstile-site-key is optional but recommended — it gates every chat request behind an invisible Cloudflare Turnstile challenge so bots can't spam your LLM token budget. Set TURNSTILE_SECRET_KEY on the worker (via wrangler secret put) to enforce it server-side.

data-logo is optional — if set, a small round icon appears before the bot name in the chat header.

data-contact-links renders a row of icon buttons under the chat header. Each entry takes {label, url, icon}. Built-in icons: phone, email, map, whatsapp, facebook, instagram, tiktok, link. Phone numbers and emails inside bot replies are auto-linked via tel: / mailto:.

data-user-name / data-user-email / data-user-phone let the host site pass the logged-in visitor's identity to the bot. The host can also set window.ragbotUser = {name, email, phone} before the widget loads. Set these only when the visitor is authenticated. The widget forwards them to /api/chat as user; the worker inlines the name into the prompt so the bot can address them by name and skip asking for callback details.

Try these queries