SupportFlow – Chatbot & Documentation Builder
SupportFlow – Chatbot & Documentation Builder
Description
SupportFlow is an all-in-one customer engagement and support toolkit for WordPress. It includes an AI-powered floating Chatbot (supporting OpenAI & Anthropic) with live human fallback, a dynamic Knowledge Base (Docs KB) custom post type, and voice/site search capabilities — all built natively for the Block Editor.
Designed with high performance, accessibility, and SEO best practices in mind, SupportFlow operates without bulky framework dependencies. It utilizes Gutenberg apiVersion: 3 and server-side rendering for lightning-fast frontend loading.
Free Blocks
- AI Chat Widget — A floating support chat bubble that responds automatically using OpenAI (GPT-3.5/4o) or Anthropic (Claude). Includes built-in Lead Captures, automated email notifications for new inquiries, and a fallback “Talk to a Human” queue.
- Docs Knowledge Base — Displays a complete documentation index categorizing all your support articles with dynamic accordion navigation.
- Docs Category Grid — Renders doc categories as grid cards with custom icons and post counters, letting visitors find topics visually.
- Docs Search Form — A fast, live search bar tailored specifically to query your documentation articles (Docs KB).
- Docs Viewer — A comprehensive, readable document layout showing sibling article navigation and a dynamic, auto-parsed Table of Contents (TOC).
- Voice Search — Native browser speech recognition search block (Web Speech API). Click the mic, speak, and results load inline instantly.
- AI FAQ — An accessible accordion FAQ block with automatic FAQ Schema (JSON-LD) generation, helping you get rich snippets on Google search results.
- AI Site Search — Live, debounced site-wide search with keyword highlighting, searching pages and posts via REST API.
Technical Highlights
- Native Gutenberg standard (
apiVersion: 3) using@wordpress/scripts. - Zero jQuery: Built entirely with vanilla Javascript.
- Server-side rendering (via block
render.php). - Database-driven chat persistence with custom MySQL schemas.
- Fully localized & translatable codebase.
External Services
This plugin integrates with third-party AI providers to offer automated chatbot assistance. Depending on your configuration under Chat Inbox Chat Settings, the plugin may connect to the following external APIs:
-
OpenAI API (https://api.openai.com)
- Use: Used to generate intelligent conversational responses for the AI Chat Widget block.
- Data Sent: Send user-entered chat messages and context history to the OpenAI completions endpoint. No personal site database data is sent. Data is sent only when a visitor submits a query to the chat widget and OpenAI is the active selected provider.
- OpenAI Terms of Service: https://openai.com/policies/terms-of-use
- OpenAI Privacy Policy: https://openai.com/policies/privacy-policy
-
Anthropic Claude API (https://api.anthropic.com)
- Use: Used to generate intelligent conversational responses for the AI Chat Widget block.
- Data Sent: Send user-entered chat messages and context history to the Anthropic messages endpoint. No personal site database data is sent. Data is sent only when a visitor submits a query to the chat widget and Anthropic is the active selected provider.
- Anthropic Terms of Service: https://www.anthropic.com/legal/consumer-terms
- Anthropic Privacy Policy: https://www.anthropic.com/legal/privacy
Development
Public source code repository:
https://github.com/wpbranddigital/SupportFlow-Chatbot-Documentation-Builder
Build Instructions:
- npm install
- npm run build
- npm run start (development)
SupportFlow is built using @wordpress/scripts.
Installation
- In your WordPress admin dashboard, navigate to Plugins Add New.
- Click Upload Plugin and select the
supportflow.ziparchive. - Click Install Now and then Activate.
- Navigate to Chat Inbox Chat Settings inside your sidebar to set up your AI Provider (OpenAI/Anthropic), adjust widget styling, or configure team email alerts.
Faq
No. The Knowledge Base blocks, FAQ accordions, Voice Search, and Site Search operate out of the box without any external services. The AI Chat widget runs in a canned “Demo Mode” until you add an API key under Chat Inbox Chat Settings AI Provider Settings.
When a visitor initiates a chat, SupportFlow answers using the selected AI provider. If the visitor is not satisfied or clicks “Talk to a Human”, the chatbot changes state to human mode, alerts support representatives via email, and adds the conversation as a pending thread in your admin Chat Inbox.
Customer names and emails are securely stored in custom tables inside your WordPress database. You can review leads under Chat Inbox Chat Settings Lead Captures and download the data as a CSV.
Voice Search utilizes the browser Web Speech API (supported natively by Chrome, Safari, and Edge). In unsupported environments, the microphone button is gracefully hidden, falling back to a regular text input.
The Docs Viewer block automatically parses the <h2> and <h3> tags of the support article and populates a dynamic sidebar list.
Reviews
Changelog
1.0.1
- Added public source code repository documentation.
- Added development and build instructions.
- Updated plugin documentation.
1.0.0
- Initial release.
- Added AI Chat Widget block (floating, OpenAI + Anthropic, demo mode, and style presets).
- Built custom chat DB schema (
aivb_conversations,aivb_messages) and REST polling. - Integrated admin Chat Inbox dashboard with unread counters.
- Added 4 Knowledge Base (Docs KB) blocks: Docs Knowledge Base, Category Grid, Search Form, and Viewer.
- Built Docs Guide and automated reading time calculations.
- Added Voice Search, AI FAQ (JSON-LD schema support), and AI Site Search blocks.