Documentation
The Documentation page is a public docs site for your product — sidebar tree, table of contents, full-text search with a built-in AI assistant and markdown rendering — served on your brand's own web address.
Overview
The documentation site is a structured, developer-friendly set of pages served on your brand's own web address, under /d. It suits technical documentation, product guides, API references and anything else that reads better with a sidebar and a table of contents.
Sidebar navigation
A collapsible tree for moving between pages and nested sections.
Full-text search
Search page titles, descriptions and content — or ask the built-in AI assistant.
Table of contents
Generated from the page's own headings, highlighting the section you are reading.
Category tabs
Split the documentation into several categories, each with its own page tree.
The web address
Your documentation site is served at:
https://<your-brand-address>.yaplet.help/d
A brand can have a web address of the form <name>.yaplet.help, and you set it at Brand → Brand settings → Public address. Nothing has to be connected to a chat widget — the address belongs to the brand, and the documentation is served whether or not a chat bubble exists anywhere.
A visitor who opens /d is sent straight to the first category and its first page. If the documentation set has no categories, the address returns a not-found page instead.
<address>, a live row's offers Take down from the public site. A brand serves one documentation set at a time; the others stay as AI knowledge and are simply not reachable at the address.Page layout
The documentation site uses a three-column layout:
| Column | Position | Content |
|---|---|---|
| Sidebar | Left (320px) | Page tree with collapsible sections |
| Content | Center (max 768px) | The page content rendered as markdown |
| Table of contents | Right (256px) | Generated from the page's H2 and H3 headings |
On phones and tablets the sidebar and the table of contents move into slide-over panels, opened from the buttons in the header.
Navigation
- Previous / Next links at the bottom of every page, for reading straight through
- Path-shaped addresses that mirror the page hierarchy:
/d/guides/getting-started/installation - Group pages (pages marked as a group, or with no content of their own) redirect to their first child page
Categories
When the documentation set has more than one category, a tab bar appears under the header. Each tab loads that category's page tree into the sidebar.
Search
The search bar sits in the middle of the header. Results open in a fullscreen overlay, in three groups:
- Title matches — pages whose title contains what you typed
- Description matches — pages whose description contains it
- Content matches — pages whose body contains it, with a highlighted snippet
Press Escape to close the overlay.
Ask AI
If the search does not turn up the right page — or the visitor would rather just ask — the Ask the AI button in the overlay turns it into a chat. The assistant answers from this documentation set's published pages and nothing else:
- Answers stream in and are formatted as markdown
- The assistant cites the pages it used as links, so visitors can jump to the source
- The conversation stays in the visitor's browser and is never stored
Content rendering
Documentation pages are written in Markdown and rendered with the MDC (Markdown Components) engine, so a page can contain:
- Standard markdown — headings, lists, tables, code blocks, images
- Rich components such as callouts, cards, tabs, steps and code groups
- Syntax-highlighted code with filename labels and line highlighting
Copy page for LLM
Every page carries a Copy page for LLM button that copies the raw markdown to the clipboard, ready to paste into an AI tool for analysis or question-answering.
Branding and styling
The logo in the header is the brand's logo, set at Brand → Brand settings → General → Brand images → Brand logo. It is one main image plus an optional second version that claims either light or dark mode — not a pair you must fill in twice. A brand that uploads only the main image is covered in both modes.
- Logo — the same logo used on the public Knowledge Base and the public roadmap. A documentation set that still carries an older logo of its own keeps using it until the brand is given one; if there is neither, the header shows the word "Documentation".
- Dark / light toggle — visitors switch themes from the header, and the logo follows if you uploaded an alternative for that mode.
The chat widget on these pages
Publishing a page is what puts it into the brand's AI knowledge, and it happens immediately — no chat widget and no AI agent have to exist for it.
When the brand does have a chat widget, it is embedded on the documentation pages, so visitors can start a conversation while reading. That widget can also show a link to this documentation site at the top of its help tab: the switch is Link to Documentation, under Brand → Chat widget → Features.
Page hierarchy
Documentation pages nest as deeply as you need, so structures like this are fine:
Guides (category)
├── Getting Started
│ ├── Installation
│ ├── Configuration
│ └── First Steps
├── Advanced Topics
│ ├── Authentication
│ └── Webhooks
└── API Reference
├── Endpoints
└── Error Codes
Group pages act as section headers — they appear in the sidebar as expandable nodes without content of their own, and clicking one expands it and moves the reader to its first child.