Learn why Gartner just named Builder a Cool Vendor

Announcing Visual Copilot - Figma to production in half the time

Builder.io logo
Contact Sales
Platform
Developers
Contact Sales

Blog

Home

Resources

Blog

Forum

Github

Login

Signup

×

Visual CMS

Drag-and-drop visual editor and headless CMS for any tech stack

Theme Studio for Shopify

Build and optimize your Shopify-hosted storefront, no coding required

Resources

Blog

Get StartedLogin

Pro plans

With the Phrase connector Plugin for Builder, you can translate your Builder content with Phrase.

The following video demonstrates toggling the locale in the Builder Studio to display the Phrase translation:

To get the most out of this document, make sure you meet the following:

In addition to a Builder Pro plan subscription, you must have a Phrase Ultimate plan or higher on your Phrase account.

To install the Phrase plugin:

  1. Go to the Integrations section for the Space.
  2. Click on the Phrase tile Enable button.
  3. When the Builder UI refreshes, follow the prompt to continue configuring the plugin. If you miss this prompt, click on the Settings button on the Phrase tile.
  4. In the Edit Phrase Settings dialogue, enter your username and password for Phrase (Note: your username is generated by Phrase and not necessarily the same as your email. You can find your username by checking your account in Phrase)
  5. Click the Connect Your Phrase Account button.
  6. On the next prompt, click Ok to approve the plugin's access to your content.

The video below demonstrates this process:

  1. Click the Publish button for your content.
  2. Click the three dots in the upper right of the Visual Editor.
  3. Select Translate.
  4. The dialogue that opens features the locales that you've already configured. Choose the Source Languages.
  5. Choose the Target Languages. You can choose more than one.
  6. Click the Translate button. This causes Builder to contact Phrase and create a new project for this entry. This also causes Phrase to create a job for each of the target languages that you chose.
  7. When the translation is complete, Builder displays a notification badge that reads Auto-Generated Requested translation from memsource. To open the notification, click on the bell icon at the upper right of the Visual Editor. This opens the project in Phrase.

To exlude a block from translation, right click on the block and choose Exclude from future translations at the bottom of the Builder context menu. As an alternative to scrolling, you can search for it at the top of the context menu.

Phrase opens when you click on the Auto-Generated notification Requested translation from memource. When your Phrase project opens, it features the Builder model name, Builder content entry name, and the jobs for the languages you selected.

  1. In the Jobs section, click your job.
  2. Within the job, enter the value for each target. For example, if your source were en-US and your target fr-FR, you'd enter values for the French.
  3. Approve each translation by clicking on the red X to the right of each value.
  4. When Phrase prompts you to accept or cancel the job, click the Accept job button.
  5. After the acceptance process is done, click the Complete button.
  6. Repeat the Phrase translation for each job.

At this point, in the Project section of Phrase, each job should be translated and 100% confirmed with a status of Completed.

The following video demonstrates this process.

  1. Go back into the content entry in Builder.
  2. Click the three dots at the upper right of the Visual Editor.
  3. Select Apply Translation. This requests the new translation from Phrase and appends it to the content.

If you have suggestions or comments about this or any of the Builder.io documentation, please share your feedback through the widget to the right of this page. Thank you!

Was this article helpful?

Product

Visual CMS

Theme Studio for Shopify

Sign up

Login

Featured Integrations

React

Angular

Next.js

Gatsby

Get In Touch

Chat With Us

Twitter

Linkedin

Careers

© 2020 Builder.io, Inc.

Security

Privacy Policy

Terms of Service

Newsletter

Get the latest from Builder.io

By submitting, you agree to our Privacy Policy

Product

Platform Overview

Integrations

What's New

Open Source

Builder

Builder

Mitosis

Mitosis

Mitosis

AI Shell

Mitosis

Micro Agent

Mitosis

GPT Crawler

Qwik

Qwik

Partytown

Partytown

Popular Guides

From Design to Code Guide

Composable Commerce Guide

Headless CMS Guide

Headless Commerce Guide

Composable DXP Guide

Design to Code

Resources

Blog

Knowledge Base

Community Forum

Partners

Templates

Success Stories

Showcase

Resource Center

Frameworks

React

React

Next

Next.js

Qwik

Qwik

Gatsby

Gatsby

Angular

Angular

Vue

Vue

Svelte

Svelte

Remix logo

Remix

Nuxt

Nuxt

Hydrogen

Hydrogen

See All

© 2024 Builder.io, Inc.

Security

Privacy Policy

SaaS Terms

Security & Compliance

Cookie Preferences

Gartner Cool Vendor 2024