# Connect your Hygraph project to Crowdin

Learn how to connect your Hygraph project to Crowdin.

[Crowdin](https://crowdin.com/) is a cloud-based localization software for teams and businesses. You can automate the translation of all your content, and manage source copy and translations from design to production with this tool. Crowdin has 2M+ user accounts and hosts hundreds of localization projects.

It has two products:

- **crowdin.com** for teams and personal use with all the essential features for continuous localization included.
- **Crowdin Enterprise** for organizations that require high customization and enterprise-level security features.

## What you can do with the Hygraph-Crowdin integration

With this app, you can streamline the localization process of your content, directly from within Hygraph. It will help you manage all of your multilingual content effectively, keeping your workflow agile.

## Prerequisites to use this integration

- You must have a **Hygraph** account. If you don't have one, you can create one [here](https://app.hygraph.com/signup).
- You must have a [Hygraph project](https://hygraph.com/docs/getting-started/fundamentals/quickstart#create-a-project) with at least one [model](https://hygraph.com/docs/getting-started/fundamentals/quickstart#create-a-model).
- You must have a **Crowdin** account. If you don't have one yet, you can get one [here](https://accounts.crowdin.com/register).
- You must have created a **project** in your Crowdin account, and an **API key**.

**Warning:**

The way to access the information you need from your Crowdin account in order to configure this integration depends on whether you have a **Crowdin.com** or a **Crowdin Enterprise** account:

- **Crowdin.com:** Here is some information on how to access your [Crowdin Project ID](https://support.crowdin.com/creating-project/), and how to generate your [Crowdin Access Token](https://support.crowdin.com/account-settings/#api).

- **Crowdin Enterprise:** Here is some information on how to access your [Crowdin Enterprise Project ID](https://support.crowdin.com/enterprise/project-settings/#details), and how to generate your [Crowdin Enterprise Access Token](https://support.crowdin.com/enterprise/personal-access-tokens/).

**Apps are environment specific**. This means their configuration is applied per environment. Take this into consideration if you're working with a project using more than one environment.

## Install the Crowdin App

Click [here](https://hygraph.com/marketplace/apps/hygraph-crowdin-app) to install the Crowdin App on **Hygraph**, then follow these steps:

[Video: Install Crowdin app](https://eu-central-1-shared-euc1-02.graphassets.com/AvHQ3RDvFSousA8iwElOKz/5FUTop62TiaLjLXnm3gg)

1. In the dropdown, select which project you want to install the app in, then click on the `Add App` button. You should be redirected to the **Configure Crowdin** section of your Hygraph project.
2. Fill in the `API Key` and the `Project ID`, you can leave the `Crowdin Enterprise Organization Name` field blank.
3. Click on the `Save` button. A pop-up notification in the lower right corner of the screen will indicate that the changes have been saved.

## Sync your content

Once the app is installed, you must log into your **Crowdin** account to set up the integration on their end to sync the content. Crowdin offers a [detailed step-by-step guide](https://store.crowdin.com/hygraph) on how to do this but, essentially, you will follow these steps:

1. Go to the **Crowdin marketplace** and find the **Hygraph** connector under `Applications`. You can use [this link](https://crowdin.com/store/apps/hygraph).
2. Install **Hygraph**.
3. If you haven't set up a project yet, go to your **Crowdin workspace** and [create one](https://support.crowdin.com/creating-project/). If you already have a project, please skip this step.
4. In your **Crowdin** project, navigate to the **integrations** section, look for the **Hygraph** integration, and click on it.
5. Add your credentials to enable **Crowdin** to connect to your **Hygraph** instance, then click on `Login with Hygraph`. You will find these credentials in your **Hygraph project** by navigating to **Project settings**.

   | Crowdin              | Hygraph                                                 |
   | -------------------- | ------------------------------------------------------- |
   | Project ID           | Project Settings > General > Project                    |
   | Environment URL      | Project Settings > API Access > Endpoints > Content API |
   | Permanent Auth Token | Project Settings > API Access > Permanent Auth Tokens   |

   **Permanent Auth Token**

   You will need to create a Permanent Auth Token for this integration. To do this, go to your Hygraph project, navigate to **Project Settings > API Access > Permanent Auth Tokens,** and click on `Add`.

   Scroll down to the **Content API** section and add all permissions, except `Delete model`.

   Then, scroll down to the **Management API** section and click on the `No, I'll configure my own permissions` button, then click on `Edit permissions` and select the following:

   - Can see schema view.
   - Update published entries.
   - Read locales.
   - Update locales.
   - Read public content views.
   - Update existing non-published entries.
   - Create locales.
   - Read existing environments.
   - Read stages.
   - Read existing models.

    **Warning:**

   Easily find these Management API permissions using **Cmd/Ctrl + F**.

6. After adding your **Hygraph** credentials in **Crowdin**, click on `Settings` - located on the upper right corner of the Crowdin-Hygraph integration panel - and use the dropdown to select the language to be mapped in Hygraph. Then, scroll down to **Entries display settings**, and select how the models will be displayed using the dropdowns. Finalize this process by clicking on `Save`.

   **Warning:**

   In order to successfully map a language, you must have it set up in your Hygraph project as well as in Crowdin. Click [here](https://hygraph.com/docs/developer-guides/project/manage-project-locales) for detailed information on how to manage your project locales.

7. Select the files to be synced to Crowdin from the Hygraph panel using the checkboxes, and finally click on the `Sync to Crowdin` button.

As a result of this integration, your content in Hygraph will be synced with your Crowdin project. The content in Hygraph will then be displayed in Crowdin to be translated and, as translations advance, you will see this reflected [in the content entry's progress bar](https://hygraph.com/docs/integrations/connect-crowdin#crowdin-in-your-hygraph-content-entry), under the **Crowdin** title.

## Add the Crowdin sidebar widget to your model

[Video: Add Crowdin sidebar widget](https://eu-central-1-shared-euc1-02.graphassets.com/AvHQ3RDvFSousA8iwElOKz/8cRSJQl0RAO5fhssXZpw)

1. Navigate to the **Schema** builder.
2. Select the model that you would like to add the **Crowdin** widget to and click on it, then select the `Sidebar` tab.
3. Select the **Crowdin** widget from the **Widgets** right sidebar.
4. The `Display name` and `Description` fields will already be complete, but you can optionally edit them.
5. Click on the `Add` button.

## Crowdin in your Hygraph content entry

[Video: Use Crowdin in content entry](https://eu-central-1-shared-euc1-02.graphassets.com/AvHQ3RDvFSousA8iwElOKz/ffBH8G8cQ4aT2sGCWafN)

1. Navigate to the **Content** editor.
2. Select the view that you configured the **Crowdin** widget for.
3. Create an entry or edit an existing one. You will find the **Crowdin** progress bar on the sidebar of your entry. The progress bar displays different colors for how much of your content translations have been finalized, and how much of the work is still in progress.

**Warning:**

The placement of the Crowdin widget in the sidebar depends on the order within the model that you gave it in the Schema builder. Click [here](https://hygraph.com/docs/developer-guides/content/customize-sidebar#reordering-widgets) for more information.

## Resources

- [Hygraph connector for Crowdin](https://store.crowdin.com/hygraph)
- [How to create a Crowdin project](https://support.crowdin.com/creating-project/)
- [Crowdin knowledge base](https://support.crowdin.com/translation-process-overview/)
- [Crowdin enterprise knowledge base](https://support.crowdin.com/enterprise/overview/)
- [Crowdin translation process overview](https://support.crowdin.com/translation-process-overview/)