---
title: "Add the language selector to the product details page"
slug: "add-the-language-selector-to-the-product-details-page"
abstract: "How to add a language selector to the product details page to view the translated product name and description."
---
# Add the language selector to the product details page

To view the translated name and description of your product in Sitecore Content Hub, you can add a language selector to the product detail page.

> [!important]
> Only make manual changes to page components using the Entity Manager in exceptional cases such as the set up of the language selector.

To add the language selector to the product details page:

1. On the menu car, click **Manage**.
2. On the **Manage** page, click **Pages**.
3. In the left pane, enter *Product details* in the search box and click **Search**.
4. In the left pane, click **Product details**.
5. On the **Product details** page, on the **Layout** tab, in the **HEADER ZONE (RIGHT)**, click **Add component**.
6. In the **Add component** dialog box, enter *HTML* in the search box and click **Search**.
7. In the component list, click **HTML**.
8. In the **Add component** dialog box, do the following:
    - For **Title**, enter *Language selector*.
    - Click the **Visible** switch to make it active (On).
    - Click **Add**.
9. On the **Product details** page, take note of the page Entity ID displayed in the URL of the address bar.

    ![Entity ID in the address bar](https://doc.sitecore.com/api/markdown-image/ch/en/users/content-hub/images/entity_id_in_the_address_bar.png)

10. Open a new browser tab and paste the following URL with your specific Content Hub URL and page entity id:

    ```text
    https://<Your Content Hub URL>/en-us/admin/entitymgmt/entity/<Page entity id>
    ```

11. On the product details **Entity detail page**, click the **General** tab, and scroll down to the **Page components** section.

    ![Entity ID in the address bar](https://doc.sitecore.com/api/markdown-image/ch/en/users/content-hub/images/entity_id_in_the_address_bar.png)

12. Click **Language selector**.
13. On the Language selector **Entity detail page**, click the **General** tab, and click **Edit** :mdiPencil:.
14. Update the following:
    - For **Data**, click **Switch editor mode**, select **Text**, and enter the following code:

        ```csharp
        {
         "controls": [
          {
           "type": "Details.Controls.LanguageSelector"
          }
         ]
        }
        ```

    - For **Component**, remove **HTML** and add **Raw**.
15. Click **Save**. The **Language component** settings for **Data** and **Component** are updated as shown in the following example.

    ![Entity details page](https://doc.sitecore.com/api/markdown-image/ch/en/users/content-hub/images/entity_details_page_.png)

    The language selector is now visible on the product detail page.

    ![Language selector on the product detail page](https://doc.sitecore.com/api/markdown-image/ch/en/users/content-hub/images/language_selector_on_the_product_detail_page_.png)