Web Chat Widget Integration
Embed the Bankify AI-powered chat widget on your website with our demo bot configuration
Widget Configuration
Demo Banking Bot (ID: 4)
Demo bot for testing chat widget integration
This demo uses bot ID 4 for testing purposes. Contact us for your production bot configuration.
Integration Code
https://your-domain.com/chat-embed?botId=4&color=%23e10600&position=bottom-right&autoOpen=false
<iframe
src="https://your-domain.com/chat-embed?botId=4&color=%23e10600&position=bottom-right&autoOpen=false"
width="100%"
height="100%"
frameborder="0"
style="position: fixed; bottom: 0; right: 0; width: 400px; height: 600px; z-index: 1000;">
</iframe>
Download a complete HTML page with the chat widget integrated and working example code.
Key Features
- Demo bot configuration (botId: 4) for testing
- Mobile number collection with WaProfile linking
- AI-powered responses using existing WhatsApp bot logic
- Customizable colors and positioning
- Cross-origin iframe embedding support
- Session-based conversation management
Live Preview
This preview shows how the chat widget will appear when embedded on your website using demo bot ID 4.
Implementation Notes
Demo Bot Configuration
This integration uses bot ID 4, which is configured specifically for demonstration purposes. For production use, you'll need your own bot configuration.
Mobile Number Collection
The widget will ask users for their mobile number in international format (263XXXXXXXXX) to link with existing customer profiles.
AI-Powered Responses
The chat widget uses the same Cloudflare AI service that powers our WhatsApp bot, providing intelligent responses for banking queries.
Cross-Origin Support
The widget is designed to work in iframes across different domains with proper X-Frame-Options configuration.
Customization Options
botId
- Fixed to 4 for demo purposescolor
- Primary color (hex format)position
- bottom-right or bottom-leftautoOpen
- true/false for auto-opening
Next Steps
Ready to integrate the chat widget into your website? Follow these simple steps:
Test the Demo
Use the live preview above to test the chat widget functionality with our demo bot.
Download Example
Download the complete HTML example to see how the integration works in a real webpage.
Contact Us
Get in touch to receive your production bot configuration and start serving customers.