Watch Webinar: Figma - Design to Code in 80% Less Time

Announcing Visual Copilot - Figma to production in half the time

Builder.io logo
Talk to Us
Platform
Developers
Talk to Us

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

growth 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:

Tip: In addition to a Builder Enterprise 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.

Tip: 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