docusaurus/website/docs/theme-classic.md
2019-11-17 05:44:21 -08:00

2 KiB

id title
theme-classic Classic Theme Configuration

⚠️ This section is a work in progress.

Common

Dark mode

To remove the ability to switch on dark mode, there is an option themeConfig.disableDarkMode, which is implicitly set to false.

Navbar

You can add a logo and title to the navbar via themeConfig.navbar. Logo can be placed in static folder.

// docusaurus.config.js
module.exports = {
  themeConfig: {
    navbar: {
      title: 'Site Title',
      logo: {
        alt: 'Site Logo',
        src: 'img/logo.svg',
      },
    }
}

You can add links to the navbar via themeConfig.navbar.links:

// docusaurus/config.js
module.exports = {
  themeConfig: {
    navbar: {
      links: [
        {
          to: 'docs/docusaurus.config.js',
          label: 'docusaurus.config.js',
          position: 'left',
        },
        // ... other links
      ],
    }
}

Outbound links automatically get target="_blank" rel="noopener noreferrer".

CodeBlock

Docusaurus uses Prism React Renderer to highlight code blocks.

Theme

By default, we use Palenight as syntax highlighting theme. You can specify a custom theme from the list of available themes, e.g.:

// docusaurus/config.js
module.exports = {
  themeConfig: {
    prism: {
      theme: require('prism-react-renderer/themes/dracula'),
    },
  },
};

Default language

You can set a default language for code blocks if no language is added after the opening triple backticks (i.e. ```). Note that a valid language name must be passed, e.g.:

// docusaurus/config.js
module.exports = {
  themeConfig: {
    prism: {
      defaultLanguage: 'javascript',
    },
  },
};