# Configuration

# Config File

Without any configuration, the page is pretty minimal, and the user has no way to navigate around the site. To customize your site, let’s first create a .kdupress directory inside your docs directory. This is where all KduPress-specific files will be placed. Your project structure is probably like this:

.
├─ docs
│  ├─ README.md
│  └─ .kdupress
│     └─ config.js
└─ package.json

The essential file for configuring a KduPress site is .kdupress/config.js, which should export a JavaScript object:

module.exports = {
  title: 'Hello KduPress',
  description: 'Just playing around'
}

If you’ve got the dev server running, you should see the page now has a header with the title and a search box. KduPress comes with built-in headers-based search: it automatically builds a simple search index from the title, h2, and h3 headers on all pages.

Check out the Config Reference for a full list of options.

# Theme Configuration

A KduPress theme owns all the layout and interactivity details of your site. KduPress ships with a default theme (you are looking at it right now), designed for technical documentation. It exposes many options that allow you to customize the navbar, sidebar and homepage, etc. For details, check out the Default Theme Config page.

To develop a custom theme, see Writing a theme.

# App Level Enhancements

Since the KduPress app is a standard Kdu app, you can apply app-level enhancements by creating a file .kdupress/enhanceApp.js, which will be imported into the app if present. The file should export default a hook function which will receive an object containing some app-level values. You can use this hook to install extra Kdu plugins, register global components, or add extra router hooks:

// async function is also supported, too
export default ({
  Kdu, // the version of Kdu being used in the KduPress app
  options, // the options for the root Kdu instance
  router, // the router instance for the app
  siteData, // site metadata
  isServer // is this enhancement applied in server-rendering or client
}) => {
  // ...apply enhancements to the app
}

Related:

• App Level Enhancements in Plugin API