# Side panel

**Side panel** provides navigation, course structure, and progress tracking for users. It organizes content hierarchically and offers quick access to different sections while showing completion status.

## Styles settings

<table><thead><tr><th width="199">Property</th><th>Description</th></tr></thead><tbody><tr><td>Menu type</td><td><p>Select the menu type:</p><ul><li>Pop-up</li><li>Fixed</li></ul></td></tr><tr><td>Menu position</td><td><p>Select the menu position:</p><ul><li>Left</li><li>Right</li></ul></td></tr><tr><td>Background color</td><td>Set the panel's background color for visual distinction</td></tr><tr><td><strong>Options</strong></td><td></td></tr><tr><td>Display overlay</td><td>Enable a semi-transparent overlay over main content when panel is active</td></tr><tr><td>Display logo</td><td>Toggle visibility of company logo within the panel</td></tr><tr><td>Display description</td><td>Show or hide course description text</td></tr><tr><td>Panel width</td><td>Adjust the width of the side panel in pixels</td></tr><tr><td><strong>Section</strong></td><td></td></tr><tr><td>Select color</td><td>Select a background color for the section in progress</td></tr><tr><td>Hovered<br></td><td>Select a background color for the section when it is hovered</td></tr><tr><td>Disable color</td><td>Selected a color of the text in the section which is yet locked</td></tr><tr><td><strong>"Chapter" icons</strong></td><td></td></tr><tr><td>Display</td><td>Toggle display (Yes/No) to show or hide custom chapter icons</td></tr><tr><td>Upload</td><td>Upload custom chapter icons</td></tr><tr><td><strong>"Page" icon</strong></td><td></td></tr><tr><td>Display</td><td>Toggle display (Yes/No) to show or hide custom page icons</td></tr><tr><td>Upload</td><td>Upload custom page icons</td></tr><tr><td><strong>"Quiz" icon</strong></td><td></td></tr><tr><td>Display</td><td>Toggle display (Yes/No) to show or hide custom chapter icons</td></tr><tr><td>Upload</td><td>Upload custom quiz icons</td></tr><tr><td><strong>Horizontal progress</strong></td><td></td></tr><tr><td>Display progress</td><td>Toggle horizontal progress bar visibility (Yes/No)</td></tr><tr><td>Progress line (background)</td><td>Set unfilled progress color</td></tr><tr><td>Progress line (completed)</td><td>Set unfilled progress color</td></tr><tr><td>Rounding</td><td>Adjust corner radius of progress bars</td></tr><tr><td>Display border</td><td>Toggle border visibility around progress bars</td></tr><tr><td>Border color</td><td>Set border color</td></tr><tr><td>Thickness</td><td>Adjust border thickness</td></tr><tr><td>Text position</td><td>Choose text alignment relative to progress bar</td></tr><tr><td><strong>Vertical progress</strong></td><td></td></tr><tr><td>Progress position</td><td>Set vertical progress indicator position</td></tr><tr><td>Progress line (background)</td><td>Set unfilled progress color</td></tr><tr><td>Progress line (completed)</td><td>Set unfilled progress color</td></tr><tr><td>Display border</td><td>Toggle border visibility around progress bars</td></tr><tr><td>Border color</td><td>Set border color</td></tr><tr><td>Thickness</td><td>Adjust border thickness</td></tr><tr><td><strong>Effects</strong></td><td></td></tr><tr><td>Sidebar shadow</td><td>Click the "+" icon to add shadow effects. Select from shadow styles: None, Soft, Regular, or Retro. </td></tr><tr><td><strong>Margins</strong></td><td></td></tr><tr><td>Margin from icon</td><td>Set spacing between icons and text</td></tr><tr><td>Margin between sections</td><td>Define spacing between navigation items</td></tr><tr><td>Padding from progress</td><td>Adjust spacing around progress indicators</td></tr><tr><td>Padding from collapse</td><td>Set spacing around collapsible elements</td></tr><tr><td><strong>Search</strong></td><td></td></tr><tr><td>Display search</td><td>Toggle (Yes/No) search bar visibility</td></tr><tr><td>Background color</td><td>Set search field background</td></tr><tr><td>Icon color</td><td>Define search icon color</td></tr><tr><td>Rounding</td><td>Adjust corner radius of search field</td></tr><tr><td>Display border</td><td>Toggle border visibility</td></tr><tr><td>Border color</td><td>Set border color</td></tr><tr><td>Thickness</td><td>Adjust border thickness</td></tr><tr><td><strong>Collapse</strong></td><td></td></tr><tr><td>Default state</td><td><p>Choose initial panel state:</p><ul><li>Expanded</li><li>Collapse</li></ul></td></tr><tr><td>Collapse</td><td><p>Set the position of the collapse icon:</p><ul><li>Hide</li><li>Left outside</li><li>Left</li><li>Right</li><li>Right outside</li></ul></td></tr></tbody></table>

## Typography settings

The Typography tab provides options for customizing font, style, size, line spacing, and color for the following components:

* Course name
* Chapter name
* Section name
* Desription
* Search
* Course progress

For details, see [Typography and fonts](/branding/create-branding/typography-and-fonts.md).

## Disable side panel

It is recommended to disable the side panel in Parta if:

* You prefer to use LMS course navigation to avoid any confusing duplication.
* You want to ensure learners follow a single, cohesive path without switching between course pages.<br>

To disable the side panel:

1. Go to the **Branding** page > **Section**.
2. Select **Header** > the **Styles** tab > the **Menu “button”** section > **Display menu**.
3. Click **No**.
4. Click **Save**.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.parta.io/branding/create-branding/section/side-panel.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.