Configuration

Bark splits configuration into two files:

• appsettings.json: host-level concerns, where the docs folder lives, whether hot reload is on, theme colors. Applied per deployment, and requires an app restart to take effect.
• docs/config.json: content-level concerns, site title and metadata, brand text, navigation, footer, social links. Set per project and hot-reloaded alongside your Markdown. No restart needed.

That split means a content editor never needs deploy access just to fix a typo in the brand name. This page walks through what you'll touch first. For the full field-by-field list, see Site Config.

If you are running Bark in Docker or a container environment, please see Environment Variables for the equivalent variable names.

appsettings.json ​

These settings belong to the Docs section of your appsettings.json:

{
  "Docs": {
    "RootPath": "../../docs",
    "DefaultPage": "index",
    "EnableHotReload": true,
    "BasePath": "/your-repo"
  }
}

Want to change colors, fonts, or ship your own CSS/JS? That's a separate concern from the settings above, covered in Extending Themes.

docs/config.json ​

This file covers everything from your site's title and HTML metadata to navigation, footer, and social links. The section below focuses on the navigation options since they have the most moving parts. For a full field-by-field list, including title, description, lang, and custom head tags, see Site Config.

You get three levels of control over navigation, and you can mix them:

1. Do nothing. No nav, sidebar, or topNav in config.json: Bark builds the left sidebar from your folder structure automatically.
2. One flat sidebar (nav) for the whole site. Good for small doc sets that don't need a header bar.
3. A header nav with dropdowns (topNav) plus a different sidebar per section (sidebar, keyed by path prefix). This is the setup most multi-section docs sites want.

{
  "brand": "Bark",
  "topNav": [
    { "text": "Home", "link": "/" },
    { "text": "Guide", "link": "/getting-started/getting-started" },
    { "text": "Reference", "link": "/reference/site-config" },
    {
      "text": "More",
      "items": [
        { "text": "GitHub", "link": "https://github.com/melosso/bark" },
        { "text": "Releases", "link": "https://github.com/melosso/bark/releases" }
      ]
    }
  ],
  "sidebar": {
    "/getting-started/": [
      {
        "title": "Introduction",
        "items": [
          { "title": "Getting Started", "path": "getting-started/getting-started" },
          { "title": "Configuration", "path": "getting-started/configuration" },
          { "title": "Routing", "path": "getting-started/routing" },
          { "title": "Deploy", "path": "getting-started/deploy" }
        ]
      }
    ],
    "/reference/": [
      {
        "title": "Reference",
        "items": [
          { "title": "Site Config", "path": "reference/site-config" },
          { "title": "API Reference", "path": "reference/api-reference" },
          { "title": "Sitemap & Crawlers", "path": "reference/sitemap-generation" }
        ]
      }
    ]
  },
  "socialLinks": [
    { "icon": "github", "url": "https://github.com/melosso/bark", "title": "GitHub" }
  ]
}

A topNav item is either a direct link (text + link) or a dropdown (text + items, no link), exactly the two shapes shown above. sidebar keys are path prefixes: whichever key is the longest match for the page you're viewing wins, so /getting-started/ and /getting-started/advanced/ can coexist, with the more specific one taking over for pages under it.

Your footer is rendered as Markdown, so links and formatting work exactly as you would expect. For social links, an icon value of "github" or "mastodon" renders as an inline SVG; any other value renders as plain text.