Deploy en Deno
3 min read
Edit on GitHub

Site Configuration

How to customize navigation, sidebars, themes, and metadata in Zerho.

Site Configuration #

Zerho is fully customizable through a typed TypeScript file at your project root: zerho.config.ts.

With native Deno TypeScript support, you enjoy instant autocomplete, strict type validation, and zero extra bundler overhead.

The `zerho.config.ts` File #

Here is an annotated overview of the configuration schema:

TS [ZERHO.CONFIG.TS] 
import type { ZerhoConfig } from "./zerho.config.ts";

export const config: ZerhoConfig = {
  title: "My Documentation",
  tagline: "Built with Zerho on Deno 2",
  description: "Modern technical documentation with Edge AI and live sandbox",
  lang: "en",

  themeConfig: {
    siteTitle: "My Docs",
    nav: [
      { text: "Guide", link: "/en/guide/getting-started", activeMatch: "/en/guide/" },
      { text: "Playground", link: "/playground/", badge: "Monaco" },
      { text: "API", link: "/reference", activeMatch: "/reference" },
    ],
    sidebar: {
      "/en/guide/": [
        {
          text: "Getting Started",
          items: [
            { text: "Introduction", link: "/en/guide/getting-started" },
            { text: "Configuration", link: "/en/guide/configuration" },
            { text: "Deployment", link: "/en/guide/deployment", badge: "Edge" },
          ],
        },
      ],
    },
    socialLinks: [
      { icon: "github", link: "https://github.com/glastor-core/zerho" },
    ],
    footer: {
      message: "Released under the MIT License.",
      copyright: "Copyright © 2026 Zerho — GLASTOR®. All rights reserved.",
    },
  },
};

export default config;

Top Navigation (`nav`) #

The nav property configures the top navbar links. You can attach visual badges (badge) to spotlight new features:

TS 
nav: [
  { text: "Guide", link: "/en/guide/getting-started", activeMatch: "/en/guide/" },
  { text: "Playground", link: "/playground/", badge: "PRO" },
  { text: "Changelog", link: "/changelog", badge: "v1.6" },
];

Zerho allows prefix-based or global sidebars. Sidebars match the longest path prefix automatically:

TS 
sidebar: {
  "/en/guide/": [
    {
      text: "Fundamentals",
      items: [
        { text: "What is Zerho?", link: "/en/guide/getting-started" },
        { text: "Configuration", link: "/en/guide/configuration" },
      ],
    },
    {
      text: "Content & Syntax",
      items: [
        { text: "Markdown Superpowers", link: "/en/guide/markdown-features" },
        { text: "Edge Deployment", link: "/en/guide/deployment", badge: "Cloud" },
      ],
    },
  ],
}

Internationalization (`locales`) #

Zerho features native, declarative multi-language support. Define locales in locales to configure language-specific titles, navigation bars, and sidebars:

TS 
locales: {
  root: {
    label: "Español",
    lang: "es",
  },
  en: {
    label: "English",
    lang: "en",
    link: "/en/",
    title: "Zerho",
    tagline: "Pro-grade documentation engine built natively for Deno 2",
    nav: [...],
    sidebar: {...},
  },
}

Auto-Sidebar, Zero-CSS Brand Theming & Plugins #

Enable automatic filesystem sidebar discovery (sidebar: "auto"), strict broken-link checking (strictLinks: true), custom brand tokens (themeConfig.colors), and lifecycle plugins (ZerhoPlugin):

TS [ZERHO.CONFIG.TS] 
const advancedConfig = {
  strictLinks: true,
  repoUrl: "https://github.com/glastor-core/zerho",
  themeConfig: {
    sidebar: "auto",
    colors: {
      brandPrimary: "#8b5cf6",
      brandSecondary: "#06b6d4",
    },
  },
};