# Navigation buttons

The **Navigation Buttons** component provides directional controls for moving through course content. It typically includes "Return" and "Continue" buttons that allow users to navigate backward and forward through the learning materials.&#x20;

## Styles settings

<table><thead><tr><th width="171">Property</th><th>Description</th></tr></thead><tbody><tr><td>Display buttons</td><td>Toggle visibility of navigation buttons (Yes/No)</td></tr><tr><td>Hover color</td><td>Define the color that appears when users hover over active buttons</td></tr><tr><td>"<strong>Return" button</strong></td><td></td></tr><tr><td>Background color</td><td>Set the background color for the Return button</td></tr><tr><td>Upload picture</td><td>Upload a custom image to replace the default background</td></tr><tr><td>Display icon<br></td><td>Toggle visibility of the icon within the button (Yes/No)</td></tr><tr><td>Upload icon</td><td>Upload a custom icon for the Return button</td></tr><tr><td>Display border<br></td><td>Toggle visibility of button borders (Yes/No)</td></tr><tr><td>Rounding</td><td>Adjust corner radius of buttons</td></tr><tr><td>Disabled button background</td><td>Set the background color for buttons in disabled state</td></tr><tr><td>Picture</td><td>Upload a custom image for the background of a disabled button</td></tr><tr><td>"<strong>Continue" button</strong></td><td></td></tr><tr><td>Background color</td><td>Set the background color for the Continue button</td></tr><tr><td>Upload picture</td><td>Upload a custom image to replace the default background</td></tr><tr><td>Display icon</td><td>Toggle visibility of the icon within the button (Yes/No)</td></tr><tr><td>Upload icon</td><td>Upload a custom icon for the Continue button</td></tr><tr><td>Display border</td><td>Toggle visibility of button borders (Yes/No)</td></tr><tr><td>Rounding</td><td>Adjust corner radius of buttons</td></tr><tr><td>Disabled button background</td><td>Set the background color for buttons in disabled state</td></tr><tr><td>Picture</td><td>Upload a custom image for the background of a disabled button</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>Padding</strong></td><td></td></tr><tr><td>Top/Bottom padding</td><td>Adjust vertical internal padding of buttons</td></tr><tr><td>Left/Right padding</td><td>Adjust horizontal internal padding of buttons</td></tr><tr><td>Margin between buttons</td><td>Define spacing between the Return and Continue buttons</td></tr></tbody></table>

## Typography settings

Customize **Navigation buttons** appearance using rich-text formatting options. These changes apply only to Buttons and do not affect other text elements.

You can modify the following properties:

* Font
* Style
* Size
* Line spacing
* Color

For details, see [Typography and fonts](https://help.parta.io/branding/create-branding/typography-and-fonts).

## Disable navigation buttons

It is recommended to disable navigation buttons 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>

Navigation buttons allow learners to move between course pages. Configure them based on your course structure:

| Course structure   | Action                                                                                                                                                                             |
| ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Single-page course | Disable Parta's navigation buttons.                                                                                                                                                |
| Multi-page course  | <ol><li>Disable Parta's navigation buttons. </li><li>Add a custom button with the <strong>Course navigation</strong> type to allow learners to proceed to the next page.</li></ol> |

To disable navigation buttons:

1. Go to the **Branding** page > **Section**.
2. Select **Navigation buttons** > **Styles** > **Display buttons**.
3. Click **No**.
4. Click **Save**.
