---
title: Getting Started
layout: ../layouts/Main.astro
---

This template already provides your pages with a side bar navigation (on the left) for your pages, and a content navigation (on the right) for your sections.

## Page navigation

The page navigation, through the side bar on the left, needs to be manually updated. Open the `config.ts` file and you will find the following structure:

```ts
export const sidebar = [
  {
    text: 'Introduction',
    link: '', // No leading slash needed, so this links to the homepage
    children: [
      { text: 'Getting Started', link: 'getting-started' },
      { text: 'Example', link: 'example' },
    ],
  },
];
```

You can change this file to match the pages you want to display, the items within `children` can also have children elements, but only the first level and second levels will be displayed.

The page navigation is generated in the `src/components/SiteSidebar.astro`, so if you want to change the depth of elements displayed, styles, etc, that's the place to go.

## Section navigation

The section navigation, through the side bar on the right, is automatically generated by the `src/components/DocSidebar.tsx` file, it uses the meta-data from markdown files to generate the structure you see.

By default only elements from depth 2 to 5 will be displayed, and at the moment doesn't work for `.astro files`.

## Other Components

### Footer

You can edit your footer here `src/components/ArticleFooter.astro`, at the moment it is composed of a list of avatars. You can generate your own avatar [here](https://getavataaars.com/) and replace the ones from `AvatarList.astro`.

### Theme

The `src/components/ThemeToggle.tsx` is only responsible for applying the theme, to change the theme colors see `public/theme.css`

## Documentation

For more information on how to use Astro components, check the documentation pages:

- [General Instructions](https://github.com/snowpackjs/astro#readme)
- [astro.config.mjs](https://github.com/snowpackjs/astro/blob/main/docs/config.md)
- [API](https://github.com/snowpackjs/astro/blob/main/docs/api.md)
- [Command Line Interface](https://github.com/snowpackjs/astro/blob/main/docs/cli.md)
- [Collections](https://github.com/snowpackjs/astro/blob/main/docs/collections.md)
- [Development Server](https://github.com/snowpackjs/astro/blob/main/docs/dev.md)
- [Markdown](https://github.com/snowpackjs/astro/blob/main/docs/markdown.md)
- [Publishing Astro components](https://github.com/snowpackjs/astro/blob/main/docs/publishing.md)
- [Renderers](https://github.com/snowpackjs/astro/blob/main/docs/renderers.md)
- [Styling](https://github.com/snowpackjs/astro/blob/main/docs/styling.md)
- [.astro Syntax](https://github.com/snowpackjs/astro/blob/main/docs/syntax.md)