---
sidebar_position: 3
---

# Site configuration

# Docusaurus Configuration Guide

This guide explains the key configurations in your `docusaurus.config.ts` file.

---

## Basic Site Metadata

The following properties define the site's basic details:

```ts
title: 'My Site',
tagline: 'Dinosaurs are cool',
favicon: 'img/favicon.ico',
```

- ***title***: The main title displayed in the browser tab and homepage.
- ***tagline***: A short description displayed under the title.
- ***favicon***: The icon shown in the browser tab.

## Website Deployment Configuration
```ts
url: 'https://your-docusaurus-site.example.com',
baseUrl: '/',
```
- ***url***: The production URL where your site is hosted.
- ***baseUrl***: The subdirectory where your site is served. If deploying to GitHub Pages under /projectName/, set baseUrl: '/projectName/'.

If deploying to GitHub Pages:

```ts
organizationName: 'facebook',
projectName: 'docusaurus',
organizationName: Your GitHub username or organization.
```
***projectName***: The repository name.

## Theme Configuration (Navbar, Footer, Code Highlighting)
The themeConfig defines UI elements like the navbar, footer, and syntax highlighting.

```ts
themeConfig: {
    // Replace with your project's social card
    image: 'img/docusaurus-social-card.jpg',
    navbar: {
      title: 'My Site',
      logo: {
        alt: 'My Site Logo',
        src: 'img/logo.svg',
      },
      items: [
        {
          type: 'docSidebar',
          sidebarId: 'tutorialSidebar',
          position: 'left',
          label: 'Tutorial',
        },
        {to: '/blog', label: 'Blog', position: 'left'},
        {
          href: 'https://github.com/facebook/docusaurus',
          label: 'GitHub',
          position: 'right',
        },
      ],
    },
    footer: {
      style: 'dark',
      links: [
        {
          title: 'Docs',
          items: [
            {
              label: 'Tutorial',
              to: '/docs/intro',
            },
          ],
        },
        {
          title: 'Community',
          items: [
            {
              label: 'Stack Overflow',
              href: 'https://stackoverflow.com/questions/tagged/docusaurus',
            },
            {
              label: 'Discord',
              href: 'https://discordapp.com/invite/docusaurus',
            },
            {
              label: 'X',
              href: 'https://x.com/docusaurus',
            },
          ],
        },
        {
          title: 'More',
          items: [
            {
              label: 'Blog',
              to: '/blog',
            },
            {
              label: 'GitHub',
              href: 'https://github.com/facebook/docusaurus',
            },
          ],
        },
      ],
      copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`,
    },
    prism: {
      theme: prismThemes.github,
      darkTheme: prismThemes.dracula,
    },
}
```

- ***navbar***: Defines navigation items.
- ***title***: Title in the navbar.
- ***logo***: Logo settings.
- ***items***: Menu items, including documentation links and external links.
- ***footer***: Defines footer styling and copyright.
- ***prism***: Configures code syntax highlighting.
- ***theme***: Light mode theme.
- ***darkTheme***: Dark mode theme.