# Translating Blocks with Block Localization


Dyspatch offers block localization to make it easier to build and localize emails, ensuring consistency across emails.

Localize a Block to translate content to different countries, regions, or languages. Localizations are available with
Teams+, Enterprise, and Custom accounts and can be managed in the email builder or via the
<a href="https://docs.dyspatch.io/api/" target="_blank">Dyspatch API</a>.

## Getting Started

To get started, head to the <a href="https://app.dyspatch.io/blocks" target="_blank">blocks & apps</a> page in your
account and select the block you'd like to add localizations to.

![Dyspatch theme's page](https://docs.dyspatch.io/img/emails/blocks-list.png)

<div class='highlight tip'>You can also select the block from the block list for a theme by selecting it from the <a href="https://app.dyspatch.io/themes" target="_blank">Themes</a> page</div>

## Mark Content for Translation

In order to make content from your block localizable at the block level, add the `localizable` attribute along with a
unique identifier name to content you wish to translate. After this step you will be able to translate the content in
your block.

![Using the localizable attribute in the Code tab of the block editor](https://docs.dyspatch.io/img/localizations/localizable-tag.png)

```html
<a href="https://example.com" localizable="link-1">My Account</a>
```

<div class='highlight note'>DML content can be <i>editable</i> or <i>localizable</i>, but not both. Localizable content is not editable in the Email Builder. See the DML guide for more on <a href="/dml_101/part1_basics/#editable-content" target="_blank">Editable Content</a></div>

## Creating Localizations

The next step is to navigate to the **Localizations** tab, where you can **create a localization** and give it a name
your team will recognize. This name is for your reference only and can follow any naming convention that works for your
team.

![Localizations tab in Dyspatch](https://docs.dyspatch.io/img/localizations/localizable-tab.png)

![Creating and naming a Locale](https://docs.dyspatch.io/img/localizations/adding-locale.png)

## Translating Your Content

### Add Translations Manually

Selecting your locale from the **localizations** tab in the block editor will give you a list of translation strings. By
clicking a string you will be given a text field where you can add your translation for that content.

<img class="img-border" src="https://docs.dyspatch.io/img/localizations/edit-localizations.gif" alt="Typing the translation of a string in the block editor" />

#### Add Translations via PO/POT Files

Use a POT file to manually manage translations outside of Dyspatch. Download the POT file from the 3-dot menu next to
the locale's name. Once you receive the PO files back from your translation service, upload them from the same menu.

![Selecting upload in the app to add PO translation files for a locale.](https://docs.dyspatch.io/img/localizations/upload-po-file.png)

More info on the manual translation process available in our
<a href="/localization/uploading_localizations/" target="_blank">Localization using POT and PO files doc</a>.

### Translate with Phrase Strings

Sync your block localizations with your Phrase Strings project the same way you would editable email content with the
<a href="/localization/phrase_localization/" target="_blank">Phrase Strings integration</a>.

![Sync to Phrase Strings option in the Email Builder](https://docs.dyspatch.io/img/localizations/phrase-strings-sync-to.png)

<div class='highlight note'>If you don't see the <i>Sync to Phrase</i> option, see the <a href='/integrations/phrase_strings_setup/' target='_blank'>Phrase Integration setup doc here</a></div>

### Translate with Phrase TMS

Sync your block localizations with your Phrase TMS project the same way you would editable email content with the
<a href="/localization/phrase_localization/" target="_blank">Phrase TMS integration</a>.

![Sync to Phrase TMS option in the Email Builder](https://docs.dyspatch.io/img/localizations/phrase-tms-sync-to.png)

<div class='highlight note'>If you don't see the <i>Sync to Phrase</i> option, see the <a href='/integrations/phrase_strings_setup/' target='_blank'>Phrase Integration setup doc here</a></div>

### Translate with Smartling

Sync your block localizations with your Smartling project the same way you would editable email content with the
<a href="/localization/smartling_localization/" target="_blank">Smartling integration</a>.

![Sync to Smartling option in the Email Builder](https://docs.dyspatch.io/img/localizations/sync-to-smartling.png)

<div class='highlight note'>If you don't see the <i>Sync to Phrase</i> option, see the <a href='/integrations/smartling_setup/' target='_blank'>Smartling Integration setup doc here</a></div>

## Preview a Localization

### Preview in the Block Editor

Select the locale you'd like to preview from the **localizations** list.

<img class="img-border" src="https://docs.dyspatch.io/img/localizations/preview-block-localizations.gif" alt="Selecting the French locale for a block, showing the french translation" />

### Preview Localizations on Devices

Once the block is included in an email, the localizations you’ve created are available for
<glossary-term word="device previews"></glossary-term> and test sending in the Preview area. Select a localization from
the drop-down to preview the localized version of your email on selected devices.

<img class="img-border" src="https://docs.dyspatch.io/img/emails/device-preview-localizations.gif" alt="Previewing a localized block on different devices from the Email Builder" />

## Enable Block in Themes

If you're not seeing your block in the Email Builder, it may not be assigned to the theme that your emails use.

Each theme that the block will be used in must be enabled by selecting the **Settings > Theme Assignment** tab and
toggle on all themes that the block will be used in.

![Toggle item list for each theme that a block will need to be accessible in.](https://docs.dyspatch.io/img/emails/block-theme-assignment.png)

<div class='highlight tip'>You can also preview how the block will look with each theme's stylings by using the <i>Preview</i> button</div>

## Export Localizations

Once you're happy with your translated content and have published your email, all locales will export to your integrated
ESP or be included in your export files. See the full list of [integration options here](/integrations/).