The Style & Customization tab in your dashboard allows you to perfectly adapt EcomBot to your brand's guidelines.
Dynamic CSS Architecture
Unlike traditional widgets that load heavy stylesheets (.css files), EcomBot uses a Dynamic CSS Variables injection engine.
- Zero Reload: When you change the primary or secondary color of your chat in the Dashboard, the modification is dynamically injected via the API. Your website does not need to clear its cache.
- Advanced Overrides: Developers can inject custom CSS code directly from the dashboard editor to override the button's shadow (
--chat-fab-shadow) or modify thehoverbehavior.
Multi-Channel Manager
EcomBot is not just a chat window. It's a Contact Hub. The "Channels" tab allows you to configure the Widget's opening behavior.
- AI Chatbot: The default channel that opens the RAG chat interface.
- Contact Forms (GDPR): If the customer has a complex request, you can add a native form. These forms natively include consent management (required checkbox) to be 100% GDPR compliant.
- Quick Links & Groups: You can route your visitors to an FAQ, an order tracking page, or group channels under the same folder (e.g., "Contact Us" containing Email and Phone).
These channels are conditionally instantiated in the DOM (React) to keep the Widget ultra-lightweight and ensure it does not impact your Google PageSpeed score.
Animations & Engagement (Vibe Coded)
EcomBot's visual experience is designed for a "Premium SaaS" feel. The widget integrates micro-interactions designed to capture attention and reassure the user:
- Instant Loading (Fade-in): The widget appears smoothly without any "white flash" upon page load, ensuring perfect visual integration.
- Real-Time Thinking Indicators: While the AI searches for a product, the user sees dynamic statuses ("Searching for promotions...", "Analyzing stock...") instead of a simple loading indicator. This drastically reduces the drop-off rate during complex searches.