Localization & Translation Overview

Sending emails in multiple languages is essential for global brands, and the Email Love Figma Plugin makes it easier by automating the most tedious part of the process: adding translation tags to your HTML.

This overview explains how translation works in the plugin and which integrations are supported.

The general workflow for translating an email built with the Email Love plugin follows three steps:

1. Design your email in Figma. Build your email as you normally would, using any combination of pre-built components and custom layouts. Your content should be in your base language (typically English).

2. Export with translation tags enabled. When exporting to a supported ESP, check the "Add localization tags" option in the plugin. The plugin will automatically wrap all translatable content — headings, body text, button labels, alt text, and optionally URLs — in your ESP's translation tag syntax. This eliminates the need to manually add tags to your HTML.

3. Translate using your translation management system (TMS). Connect your ESP to your TMS (Smartling, Lokalise, Crowdin, or others). The TMS extracts the tagged content, sends it for translation (human or AI), and pushes the translations back to your ESP. Your email design and HTML structure remain untouched — only the text content changes per language.

When you enable localization tags during export, the plugin wraps:

The tagging format is ESP-specific. For example, Braze uses {% translation_tag %} syntax, while other ESPs may use different formats.

The plugin currently supports automatic translation tagging for these ESP + TMS combinations:

Braze + Smartling

The plugin adds Braze's native {% translation_tag %} syntax. Smartling connects directly to Braze to pull tagged content for translation and push translations back. See How to Translate Braze Email Templates Using Smartling for the full walkthrough.

Iterable + Lokalise

The plugin exports to Iterable with properly structured HTML that Lokalise can parse for translation. Lokalise connects to Iterable via API to sync translations. See How to Translate Iterable Email Templates Using Lokalise for the full walkthrough.

Other Combinations

If you're using a different ESP or TMS (such as Crowdin, Phrase, or Transifex), the general workflow still applies — export your HTML from the plugin, then import it into your TMS. You may need to configure your TMS to recognize the translation tags or handle the HTML parsing. Contact support@emaillove.com if you need guidance on a specific integration.

Design for text expansion. Languages like German and French often require 20–40% more space than English for the same content. Leave breathing room in your layouts and avoid fixed-height text containers in Figma (use Auto Height instead).

Use simple, translatable copy. Idioms, wordplay, and culturally specific references don't translate well. Keep your email copy straightforward.

Test each language. After translations are synced, preview every language variant in your ESP. Check for text overflow, broken layouts, and character encoding issues (especially for languages with special characters like Japanese, Arabic, or Thai).

Consider right-to-left (RTL) languages. If you're translating into Arabic, Hebrew, or other RTL languages, you may need to adjust your layout direction. MJML supports RTL with the dir attribute on sections.