Most businesses assume adding an AI chatbot means a major website rebuild. It doesn't. With the right architecture, you can add a production-grade AI assistant to any existing website — WordPress, Webflow, custom PHP, or static HTML — in under a week.
The Architecture: A Chat API + A Floating Widget
You need two things: (1) A backend Chat API that receives messages, calls GPT-4o, and returns responses via streaming SSE. (2) A frontend widget — a small JavaScript file your client includes with a single script tag. Your client's existing website is untouched.
Day 1–2: Build the Chat API
The API is simple: one endpoint (POST /chat) that accepts messages[], calls the OpenAI API with a system prompt + conversation history, and streams back the response. Use Server-Sent Events (SSE) for streaming — it gives the chatbot that live-typing feel.
Day 2–3: Build the Knowledge Base
For a basic chatbot, a detailed system prompt with product/service information is enough. For a RAG-powered bot: scrape the client's website content, chunk it into 500-token passages, embed with text-embedding-3-small, store in Pinecone or pgvector.
Day 3–4: Build the Widget
A floating chat button (bottom-right), a chat window (Alpine.js or vanilla JS), message rendering with streaming support, pre-chat form for email capture, and a "Talk to human" escalation button. Style it to match the client's brand.
Day 5: Deploy & Embed
Deploy the API on a VPS or AWS. Give the client a one-line script tag they paste before closing body tag. The chatbot is live. Zero changes to their existing website.
What This Won't Handle
This architecture is great for FAQ bots, lead capture, and basic support. It won't handle complex multi-session state or deep CRM integration without additional work — but it's a solid 80% solution deployed fast.
Get More Like This
AI automation tips and n8n tutorials every 2 weeks. No spam.