The widget
Pages and elements
The widget has no fixed screens. What your visitors see is a layout you build, page by page, in Builder in the dashboard.
Pages are defined by their path#
A page isn't a numbered step in a wizard — it has a path, the same way a page on your site does.
| Path | Typically |
|---|---|
/ | The home page: a greeting, a search box, links |
/chat | The conversation list |
/chat/:id | One conversation |
/articles/:id | One help article |
A path segment starting with : is a parameter. /articles/:id matches
/articles/anything, and the element on that page receives the id.
When two pages could match the same path, the more specific one wins: /chat/new
beats /chat/:id. If nothing matches, the visitor lands on /.
Because pages are paths, you get working back and forward buttons, deep links into a specific article, and named transitions between pages — and you can add your own pages without any of that breaking.
Two kinds of element#
Presentational elements draw what you tell them: headings, text, buttons, images, containers. You control the content and the styling options.
Functional elements are wired into AskVoro itself:
| Element | What it does |
|---|---|
chatThread | The live conversation — messages, composer, streaming |
conversationList | The visitor's past conversations |
articleList | Your published articles |
articleBody | One article, rendered |
faqList | Your FAQs, in the order you set |
contactForm | The contact-form surface; workspace persistence and delivery are not wired yet |
You can rewrite every label, heading and placeholder on a functional element. You can't rewrite its internals — a chat thread will always be a chat thread.
The contact form is the current exception to the otherwise live functional elements: it renders demo-backed fields and a local success state, but Save in the form builder and visitor submissions are not persisted or delivered yet.
That split is deliberate: it means you can restyle and rewrite the entire widget without any arrangement of elements producing a broken one. Containers hold presentational children only, for the same reason.
Why there's no custom CSS#
There's no free-text class name and no CSS box. Every visual option is a fixed choice — a spacing step, a colour role, a radius — that resolves to a token from your appearance settings.
The trade is intentional. You lose pixel-level control; you gain a widget that can't drift off-brand, can't break on a narrow phone, and doesn't need revisiting every time you change your brand colour.
If you need something the element list can't express, that's worth telling us — it usually means an element is missing, not that the escape hatch is.
Building one#
- Open Builder.
- Pick a page, or add one and give it a path.
- Drag elements in. Select one to edit it in the inspector on the right.
- Save as you go — this writes a draft, and visitors never see drafts.
- Publish when you're happy.
The difference between those last two matters enough to have its own page: Draft and publish.