1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
|
# WebX11 Chat Widget 1.0.0
A single-file AI chat widget you drop onto your own website. It renders a
floating bubble, streams answers token-by-token from an Ollama-compatible
endpoint, formats links/e-mails/phone numbers, offers quick-reply chips, and
goes fullscreen on phones. No build step, no framework, no external CDN, no
tracking, no cookies.
## What you receive
| Item | File |
|---|---|
| Widget source (HTML + CSS + JS in one file) | `src/widget.html` |
| Configuration template with every option documented | `src/config.example.js` |
| This README + license + changelog | `README.md`, `LICENSE`, `CHANGELOG.md` |
| Setup guide, embed snippet, troubleshooting | `docs/USAGE.md` |
| 30 days of setup help by e-mail after purchase | included with the Setup Package |
You do **not** receive a hosted service, a model, or an API key. The widget is a
front end: it calls an endpoint that you own and operate. That is deliberate —
your conversations and your key stay on your infrastructure.
## Requirements
- Any static web host (or an existing site — the widget is a fragment you paste in).
- An Ollama-compatible endpoint reachable over HTTPS that accepts
`POST {"model": "...", "prompt": "...", "stream": true}` and returns
newline-delimited JSON with a `response` field.
- That endpoint must allow your website's origin (CORS). See
`docs/USAGE.md` → Troubleshooting.
## Install in 3 steps
1. **Copy the files.** Put `src/widget.html` and a copy of
`src/config.example.js` renamed to `config.js` in the same directory on
your server.
2. **Edit `config.js`.** Set `endpoint` to your gateway (for example
`https://YOUR-HOST/ollama`), set `model`, `title`, `accentColor`,
`welcomeMessage` and `systemPrompt`. Never put an API key in this file.
3. **Open or embed.** Visit the page, or paste the widget block from
`src/widget.html` plus the two `<script>` tags into your existing template.
Done.
Full instructions: `docs/USAGE.md`.
## Configuration at a glance
| Key | Default | Purpose |
|---|---|---|
| `endpoint` | `''` (required) | Your gateway base URL; `/api/generate` is appended |
| `model` | `llama3.2:latest` | Model name as your backend knows it |
| `title` | `Chat with us` | Header text |
| `accentColor` | `#00e5a0` | Brand colour; readable text colour is chosen automatically |
| `welcomeMessage` | `Hi! How can I help you today?` | First message in the transcript |
| `inputPlaceholder` | `Type your message…` | Input hint |
| `systemPrompt` | generic assistant | The assistant's instructions |
| `promptUrl` / `promptVersion` | `''` | Optional: load the prompt from a text URL |
| `chips` | `[]` | Quick-reply buttons `[label, message]` |
| `position` | `right` | `right` or `left` |
| `statusLine` | `true` | Show the `Model: …` line |
## Known limitations (be aware before you buy)
- There is **no conversation history**: each message is sent with the system
prompt plus that one question. The model does not see earlier turns.
- There is **no server component** in this package. You supply the endpoint;
the key lives there, not in the browser.
- There is **no persistence**: nothing is written to `localStorage` or cookies,
so the transcript is gone on reload (and there is no cookie banner to add).
- Markdown support is intentionally minimal: bold, italic, inline code, links,
line breaks.
## License
Commercial license — see `LICENSE`. Use it on sites you own or operate; you may
not resell or redistribute the widget itself as a product.
## Support
30 days of setup help are included with the Setup Package. Reply to your
purchase receipt with the URL where you installed the widget and the exact
error text (browser console + network tab) — that is usually enough to diagnose
CORS and endpoint issues in one round trip.
|
