# Connect your Hygraph project to Lokalise

Learn how to connect your Hygraph project to Lokalise, and how to easily build and manage workflows for multiple locales and translations of existing content.

**Lokalise** is a localization management platform where teams can easily build and manage workflows for multiple locales and translations of existing content. It enables teams to build collaborative workflows around localization, ensure high quality translations are pushed live, and create new locales for a wide range of digital products, from applications to websites.

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

- With the **Hygraph-Lokalise integration**, teams can simplify their workflows between **Lokalise** and **Hygraph** by creating bulk imports and exports of content and easily manage multiple locales for their digital products through a dedicated interface within **Hygraph**.

## 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).
- You must have a **Lokalise** account. If you don't have one, you can create one [here](https://app.lokalise.com/signup).
- You must have a [Lokalise project](https://docs.lokalise.com/en/articles/1400460-projects). The [project type](https://docs.lokalise.com/en/articles/2800192-document-file-support) must be **Software localization**, and you must select a base language for your project in your project settings.
- You must create a [Lokalise API Token](https://docs.lokalise.com/en/articles/1929556-api-tokens).

**Warning:**

**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 Lokalise app

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

[Video: Lokalise installation](https://eu-central-1-shared-euc1-02.graphassets.com/AvHQ3RDvFSousA8iwElOKz/cmnn9x9c5hu5107vx3dqc9lgs)

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 your **Hygraph** project dashboard.
2. Fill in the `API token` and the `Project ID`. This information can be found in your **Lokalise** account. The **Hygraph** UI provides links that show you how to get the information you need next to each requested field.
3. Select at least one model to use **Lokalise** in. This information can be edited later by going to the **Apps** section of your Hygraph project, then clicking on the pencil icon in the Lokalise card to edit the details.
4. Click on the `Save` button.

## Use Lokalise in your Hygraph project

As you create content, it will display in the **Lokalise** section of the **Content editor**, under **App views**. From there, you will be able to [export](https://hygraph.com/docs/integrations/connect-lokalise#export-translation) content to **Lokalise** to be translated, then [import](https://hygraph.com/docs/integrations/connect-lokalise#import-translation) those translations into **Hygraph**.

**Warning:**

Please note that only the content created using the <b>Model</b> that you selected during the <b>Lokalise installation process</b> will be displayed on this list.

You can edit this from your <b>Hygraph project</b> by navigating to <b>Apps > Lokalise</b>, clicking on the pencil icon to edit, then using the checkboxes to select the desired models.

Finally, after the process has been completed, you will be able to [view the translated content](https://hygraph.com/docs/integrations/connect-lokalise#view-translations) normally by accessing the **Content editor**.

Take into account that only localizable fields can be submitted to Lokalise. So the fields must be set as localized fields when added to the model.

![Localized field checkbox](https://hygraph.com/images/docs/integrations/lokalise/lokalise-localizefield.png)

You will find the `Localized field` checkbox at the bottom of the field details screen, which displays when you create or edit a field in the **Schema** editor.

### Export translation

[Video: Submit to translate](https://eu-central-1-shared-euc1-02.graphassets.com/AvHQ3RDvFSousA8iwElOKz/cmnn9x98djasa07w5b56lbly8)

1. Navigate to the **content editor**.
2. Select **Lokalise** under the **App views** section of the right sidebar.
3. Use the checkboxes to select the desired content from the list, and send it to **Lokalise** by clicking on the `Submit to Translate` link at the top of the form.
4. A pop-up will display, where you need to select the locales to export. Select the necessary checkboxes, and click on the `Export translation` button.
5. The translation status will change to **In progress**, and you will be able to find the content ready to translate in your **Lokalise** account.

If the content is exported successfully, a green message will pop up in the lower right corner of the screen indicating this. If it fails, a red message will be displayed in the same place indicating that the submit was unsuccessful.

**The following fields are supported to be exported to Lokalise:**

- Single-line text
- Multi-line text
- Markdown
- Richtext
- Slug

Export is also supported for Basic and Modular Components, but only for the supported field types.

**Note:**

You can copy the entry ID and use it on Lokalise to filter the entry there and easily find it.

### Import translation

After [exporting](https://hygraph.com/docs/integrations/connect-lokalise#export-translation) content to **Lokalise**, it will be [translated and saved there](https://docs.lokalise.com/en/collections/2909016-translate-and-collaborate). You can then import that content back to **Hygraph** by following these steps:

[Video: Import translation](https://eu-central-1-shared-euc1-02.graphassets.com/AvHQ3RDvFSousA8iwElOKz/cmnn9x9a8jasi07w5f1hupm1i)

1. Navigate to the **Lokalise** section of the **Content editor**. Use the checkboxes to select the entries that you want to import translations for, then click on the `Import Translation` link at the top of the form.
2. A pop-up will display, where you need to select the language or languages of the content being imported. Select the necessary checkboxes, and click on the `Import translation` button. The translation status will change to `Imported` as a result.

**The following fields are supported to be imported from Lokalise:**

- Single-line text
- Multi-line text
- Markdown
- Richtext
- Slug

Import is also supported for Basic and Modular Components, but only for the supported field types.

**Note:**

Please note that the status <b>Done</b> means that all translations on <b>Lokalise</b> have been finished and that the content is ready to be imported.

### Translation statuses

The **Lokalise** app view of the **Content editor** contains a form that allows you to view the localization status of your content as well as to export and import translations in bulk.

![Lokalise secton in App view](https://hygraph.com/images/docs/integrations/lokalise/lokalise-appview.png)

Your **Locale status** refers to the default language in your project. The language will be indicated next to the column title, i.e. `Locale status (en)`.

Your **Global status** refers to all the languages that were submitted for translation.

| Status      | Description                                                                                                      |
| ----------- | ---------------------------------------------------------------------------------------------------------------- |
| Missing     | Indicates that an entry has never been sent to Lokalise.                                                         |
| In progress | Indicates that an entry has been submitted for translation.                                                      |
| Done        | Indicates that all translations have been finished in Lokalise, marked as reviewed, and imported.                |
| Changed     | Indicates that an entry has been edited after it was sent to Lokalise.                                           |
| Imported    | Indicates that one or more translations - but not all - have been finished in Lokalise, and imported to Hygraph. |

### View translations

1. Navigate to the **content editor**, and select the view of the model you included **Lokalise** in.
2. Edit an entry that you imported a translation for by clicking on the pencil icon. The content will display at the center of the screen.
3. You will find the `Localizations` section in the right sidebar. You have the following options:
   1. Click on the `+` icon to add a translation.
   2. Click on the trash icon to delete a translation.
   3. Click on the eye icon to view a translation in the editor.

![View translations](https://hygraph.com/images/docs/integrations/lokalise/lokalize-add-visualize.png)

## Troubleshooting

If the **Content Editor** displays the message `This model has no localized fields` under localizations in the sidebar, while the **Schema Editor** has localizations configured, go to **Project settings > Locales**. There, make sure your project has at least two languages configured.

![Locales in project settings](https://hygraph.com/images/docs/integrations/lokalise/lokalise-settings-locales.png)

If you have only one language configured there, select another language for localizations using the `Display name` dropdown, then click on `Add`.

**Warning:**

Please note that free plans can have a maximum of 2 locales.

## Resources

- [Lokalise documentation](https://docs.lokalise.com/en/).
