# Connect your Hygraph project to Smartling

Learn how to connect your Hygraph project to Smartling, and how to easily manage locales and translations of existing content.

**Smartling** is a cloud-based language translation and content localization tool that offers translation services as well as AI powered translations.

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

- Teams can simplify their workflows between **Smartling** and **Hygraph** by submitting & importing content.
- Teams can 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 **Smartling** account. If you don't have one, you can [book a meeting with their team](https://www.smartling.com/meeting-request/).
- You must have a Smartling project. Check out [Smartling Help Center](https://help.smartling.com/hc/en-us) to find out more about how Smartling works.
- You must create a Smartling project and have the following information at hand:
  - `User ID:` Generate this by clicking on `Account settings`, located on the upper right corner of the screen - by your user menu - then select the `API` option. Find the **Account tokens** section of the screen and click on the `Create Token` button. Finally, assign a name to your token and click on `Create`. Your `User ID` is the `Token Name`. Copy this information, as you won't be able to access it afterwards.
  - `User Secret:` Generate this by clicking on `Account settings`, located on the upper right corner of the screen - by your user menu - then select the `API` option. Find the **Account tokens** section of the screen and click on the `Create Token` button. Finally, assign a name to your token and click on `Create`. Your `User Secret` is the `Token Secret`. Copy this information, as you won't be able to access it afterwards.
  - `Project ID:` Find this by clicking on `Account settings`, located on the upper right corner of the screen - by your user menu - then select the `API` option. Find the **Project tokens** section of the screen. You can copy the `Project ID` of an existing project, or generate a new one by clicking on `Create Token`.

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

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

[Video](https://www.youtube.com/watch?v=XeJMFeRcFKc)

1. In the dropdown, select which project you want to install the app in, then click on the `Install app` button, then authorize permissions.
2. Fill in the `User ID`, `User secret`, `Project ID`. This information can be found in your **Smartling** account. The **Hygraph** UI provides a link with information on how to get them at the top of the screen. We also provided information on this in the [Prerequisites](https://hygraph.com/docs/integrations/connect-smartling#prerequisites-to-use-this-integration) section of this document.
3. Select at least one translatable model to use **Smartling** in. This information can be edited later by going to the **Apps** section of your Hygraph project, and editing the app details.
4. Map the locales by using the dropdown menu to select a Smartling locale to match your Hygraph locale. This information might take a few seconds to load after entering a `Project ID`.
5. Click `Save`.

**Pro Tip:**

The Smartling app creates a dedicated custom app view in the content editor. This means that you can start using it right away, without having to make any schema modifications.

## Use Smartling in your Hygraph project

The Smartling app does not need to be manually added to models from your project schema. Instead, after installation, you will find the Smartling app view in the **Content editor**, under **App views**.

As you create content for the models you selected during installation, this content will display here. From here, you will be able to [submit](https://hygraph.com/docs/integrations/connect-smartling#submit-translation) translations to **Smartling**, and then [import](https://hygraph.com/docs/integrations/connect-smartling#import-translation) those translations back into **Hygraph**.

**Warning:**

Please note that only the content created using the <b>Models</b> that you selected during the <b>Smartling installation process</b> will display on this list.

You can edit this from your <b>Hygraph project</b> by navigating to `Apps > Smartling`, clicking `Edit` on the app card, and then using the checkboxes to select the models you want.

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

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

![Localize field checkbox](https://hygraph.com/images/docs/integrations/smartling/localize-field.png)

You will find the `Localize field` checkbox in the **Field options** section of the field details screen. To check if a field is localized, you can open the project **Schema** and and look at the field card, or edit the field to view its details.

### Submit translation

[Video](https://www.youtube.com/watch?v=XeJMFeRcFKc&t=63)

1. Navigate to the **content editor**.
2. Select **Smartling** under the **App view** section of the screen.
3. Use the checkboxes to select the content that you want to submit from the list, and send it to **Smartling** by clicking on the `Submit for translation` link at the top of the table. Content that has not been submitted has the `Missing` status.
4. A pop-up will display, where you need to select the job and locales to submit.
    - **New job**
      - **Name new job:** Type in a name for the new job.
      - **Enter job description:** Optional. You can add a description for the new job here.
      - **Select job due date:** Click the calendar icon to select a due date for the new job, then click `Ok`.
    - **Existing job**
      - **Select existing:** Use the dropdown menu to select an existing job. Selecting pre-existing jobs does not change the authorization status.
    - **Locales:** Use the checkboxes to select the locales you want to submit for translation.
    - **Pre-authorize:** You can select this checkbox to pre-authorize the translations. Pre-authorized translations do not need to be authorized from your Smartling project after submitting. This checkbox displays only for new jobs.
5. Click `Submit` to send the translation to Smartling. Its status will change to `In progress`, and you will be able to find the content ready to translate in your **Smartling** account.

If the content is exported successfully, a green toast will indicate this. If it fails, a red toast will indicate that the process was unsuccessful. You can check out the [Smartling documentation](https://help.smartling.com/hc/en-us/articles/1260805481410-Error-Codes) to look into the possible cause of errors.

#### Supported fields

**The following fields are supported to be submitted to Smartling:**

- Single-line text
- Multi-line text
- Markdown
- Rich text
- Slug

We also support translation submissions for basic and modular Components, **but only for the supported field types**.

### Import translation

After [submitting](https://hygraph.com/docs/integrations/connect-smartling#submit-translation) content to **Smartling**, it will be ready for translation there. Once translated, you can then import that content back to **Hygraph** by following these steps:

[Video](https://www.youtube.com/watch?v=XeJMFeRcFKc&t=137)

1. Navigate to the **Smartling** app view in the **Content editor**. Use the checkboxes to select the entries that you want to import translations for, then click `Import translations` at the top of the table.
2. The sync popup will display:
    - **Locales:** Use the checkboxes to select the locales you want to import translations for.
3. Click `Import translations`.

- If you successfully import all entries, you will get a green toast indicating so.
- If the import is partially successful, you will get a yellow toast indicating how many entries were imported successfully and how many failed.
- If the import fails, you will get a red toast indicating so.

### Search and filters

![Search and filters](https://hygraph.com/images/docs/integrations/smartling/search-and-filters.png)

- You can search for specific entries by typing in their  `ID` or `Title` in the search fields.
- You can also use the dropdowns to apply filters to show entries for specific models, locales, or locale statuses.
- The `Outdated` dropdown lets you filter by `All`, `Only outdated`, and `Only up to date` entries.
- The `Items per page` dropdown lets you select how many entries per page the table should display.

### Translation statuses

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

![Smartling section in App view](https://hygraph.com/images/docs/integrations/smartling/translation-statuses.png)

Your **Locale status** refers to the default language in your project. You can see the language next to the `Title`, for instance `Title (en)`.

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

| Status      | Description                                                                                                                                                                       |
| ----------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Missing     | Indicates that an entry has never been submitted to Smartling.                                                                                                                    |
| In progress | Indicates that an entry has been submitted for translation.                                                                                                                       |
| Done        | Indicates that the translation has been finished in Smartling and has moved onto the next step in the workflow. This means that the translation can be imported back into Hygraph |

**Pro Tip:**

You can click `Refresh all` at the top-right of the table to refresh the status of all localizations on the table.

### View translations

To view translations in the content form:

1. Navigate to the **content editor**, and select the view of the model you configured **Smartling** for.
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 visualize a translation in the editor.

![View translations](https://hygraph.com/images/docs/integrations/smartling/smartling-view.png)

## Troubleshooting

### No localized fields

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

![Locales in project settings](https://hygraph.com/images/docs/integrations/smartling/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.

### Errors

Error messages in Hygraph will provide a Smartling error code and description. Check out the [Smartling documentation](https://help.smartling.com/hc/en-us/articles/1260805481410-Error-Codes) to learn about those errors and how to solve them.

## Resources

- [Smartling app changelog](https://hygraph.com/docs/integrations/changelog-smartling)
- [Smartling Help Center](https://help.smartling.com/hc/en-us)
