---
title: "Customize the Commerce Navigation rendering"
slug: "customize-the-commerce-navigation-rendering"
abstract: "How to customize the Commerce Navigation rendering."
---
# Customize the Commerce Navigation rendering

You can customize the [Commerce Navigation](https://doc.sitecore.com/xp/en/users/102/sitecore-experience-commerce/commerce-navigation-renderings.html) rendering to add your own branding by [copying and customizing](https://doc.sitecore.com/xp/en/developers/sxa/102/sitecore-experience-accelerator/copy-and-customize-a-rendering.html) it. For existing styles, you [modify CSS classes](https://doc.sitecore.com/xp/en/developers/sxa/102/sitecore-experience-accelerator/create-a-rendering-variant.html) in the navigation rendering but for new styles you need to update the .css file.

The Start Page settings for the Commerce Navigation rendering are located at `sitecore/Content/<tenant>/<site>/Settings/Commerce/Catalog Configuration` while you define the Start Page settings for the SXA Navigation rendering in the control properties for the rendering.

| Item | Description | Dependencies | CSS Class |
| --- | --- | --- | --- |
| Link Identifier | Contains the category item ID used for highlighting active navigation. | None |  |
| Navigation Link | Contains the link and name of the navigation link. | None | cxa-navigation-component |

To customize the Commerce Navigation component:

1. On the Storefront Launchpad, click **Content Editor**.
2. In the Content Editor, go to *sitecore/Content/Sitecore/Storefront/Presentation/Rendering Variants/Commerce Navigation/Default*.
3. Right-click the **Navigation** rendering and click **Duplicate**.
4. Type a name for the rendering copy and click **OK**.

    The duplicate navigation component is added to the Available Renderings folder.

    ![Copy of Navigation rendering in the Available Renderings folder.](https://doc.sitecore.com/api/markdown-image/xp/en/developers/102/sitecore-experience-commerce/images/NavigationCopy.png)

5. On the **Content** tab, make the necessary changes.