Get your documentation site up and running in minutes. This guide walks you through configuring your project, customizing its appearance, organizing your first set of pages, and enabling powerful features like the AI Assistant.
By the end of this guide, you will understand how your project's configuration file controls the look, feel, and structure of your documentation.
How your documentation is structured
Before diving into the configuration, it is helpful to understand how content is organized. Your documentation follows a strict, easy-to-manage hierarchy:
flowchart TD
Project["Your Project (e.g., UTMStack)"] --> Version["Version (e.g., v12)"]
Version --> Section1["Section (Product Documentation)"]
Version --> Section2["Section (API Reference)"]
Section1 --> Page1["Page: Welcome"]
Section1 --> Folder1["Folder: Platform"]
Folder1 --> Page2["Page: Architecture"]
Folder1 --> Page3["Page: Data Model"]| Element | Description | Example |
|---|---|---|
| Version | Represents a specific release of your product. You can have multiple versions active at once. | v12, latest |
| Section | The highest level of content grouping, usually displayed as tabs or main sidebar categories. | product_documentation, api_reference |
| Folder | Groups related pages together within a section. | Platform, Reference |
| Page | The actual markdown file containing your content. | Quickstart, REST API |
Setting up your project
Your entire documentation site is driven by a central configuration file. Let's walk through the essential steps to configure your new project.
- 1
Define your project details
Start by setting your project's core identity, including its name, description, and SEO settings. This information helps users understand your product and improves search engine visibility.
{ "name": "UTMSTACK", "description": "UTMStack® is a Unified Threat Management Platform that delivers all essential security services...", "seo": { "title_template": "%s | Documentation" } } - 2
Customize your theme
Make the documentation match your brand. You can configure presets, toggle dark and light modes, set accent colors, and choose your typography.
"theme": { "preset": "pearl", "dark": { "bg_color": "#0a0a0a", "text_color": "#ededed", "accent_color": "#3b82f6" }, "light": { "bg_color": "#fafafa", "text_color": "#171717", "accent_color": "#2563eb" }, "modes": [ "dark", "light" ], "default": "dark", "font_family": "Inter", "heading_font": "Source Serif Pro", "show_name": false } - 3
Configure navigation
Help your users find what they need by adding links to your top navigation bar and footer. You can highlight primary actions (like an "Online Demo") and link out to your social channels or GitHub repositories.
"navbar": [ { "label": "Support", "url": "https://support.utmstack.com", "style": "subtle" }, { "label": "Online Demo", "url": "https://utmstack.com/demo", "style": "primary" } ] - 4
Enable the AI Assistant
Turn on the built-in Knowledge Base (KB) agent to give your users an interactive way to find answers. You can customize the placeholder text, suggest popular searches, and highlight top articles.
"kb": { "enabled": true, "name": "Agent", "icon": "hi-sparkles-outline", "hero_title": "How can we help?", "hero_description": "Have the UTMStack agent complete your request.", "hero_placeholder": "Ask anything", "search_suggestions": [ "How to install UTMStack from ISO", "How to add a log source or integration", "How to create correlation rules and filters" ] }
Floating Assistant: You can set "floating": true under the "assistant" configuration to keep the AI helper accessible on the screen as users scroll through your documentation.
Frequently Asked Questions
Can I have multiple versions of my documentation?
Yes! You can enable the version selector ("version_selector_enabled": true) and define multiple versions in your configuration array. Users can toggle between them using a dropdown in the navigation bar.
What types of sections can I create?
Currently, you can categorize your sections as either product_documentation (best for guides, tutorials, and concepts) or api_reference (best for endpoints, webhooks, and SDKs).
Next Steps
Now that your project is configured, it's time to start writing your content. Explore the following resources to learn more about structuring your platform and reference materials.