Made in Builder.io

Ship Your First Personalized Web Experience webinar on June 15 @ 10AM PT. Register Now

Talk to Us
Product
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

In the Builder Visual Editor, you can configure individual blocks to deliver content specific to language and region preferences.

For example, if you wanted to differentiate copy or images for a visitor in Germany or a visitor in Mexico, you could adjust a few settings on the block and add locale-specific content in the block's localization settings.

You can individually localize many blocks, including the following, in the Visual Editor:

  • Text
  • Images
  • Colors
  • Symbol inputs

The process is the same for each in that you hover over the label in the Edit dialogue to show the Localize icon, click the icon, and add content to each locale.

To successfully use localization in Builder, make sure you've already done the following:

The last part of setting up localization is to integrate. For instructions, continue to Integrating Builder Localization with your code.

  1. Double click the block to open the Edit dialogue.
  2. Hover over the label of the block; for example, the label Text in a Text edit dialogue, and click the Localize icon.
  3. In the locale dropdown, choose the locale you'd like to edit. As a best practice, always set a value for the Default locale in case none of the other locales are in the user's settings.
  4. Enter content per locale.

The following video demonstrates adding localized content with two examples:

  • A Text block
  • An Image block

This video also shows how to select the locale for the entire content entry, which you can do by selecting the local at the top of the work area.

Tip: If you don't have any locales, click the link to Add a new locale, which displays when you hover over the locales dropdown. You can also add multiple locales in a single dialogue as outlined in Adding locales in Account settings.

To remove localization from a selected block:

  1. Open the Edit dialogue for the block. Do this by double-clicking the block or selecting the block and clicking the Edit button.
  2. This step removes the localized content. Hover over the dialogue label and click on the Localize icon.

By toggling off localization for a block, the localization dropdown no longer displays, and the content is removed. The following video demonstrates this process.


Looking to hire a third party to help with your project?

Submit a project request and our partnerships team will reach out to connect you with an Expert from our partner ecosystem.

Connect with us

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

Get the latest from Builder.io

Developer Newsletter

Latest tips, tricks, and news for frontend developers from our blog

Product Newsletter

Latest features and updates on the Builder.io platform

By submitting, you agree to our Privacy Policy

Product

Features

Pricing

What's New

Resources

Documentation

Blog

Community Forum

Templates

Partners

Submit an Idea

Use Cases

Landing Pages

Headless CMS

Headless Storefront

Customer Showcase

Customer Success Stories

Builder.io logo

Visually build and optimize digital experiences on any tech stack. No coding required, and developer approved.

Get Started

Log In

Product

Features

Pricing

Integrations

Use Cases

© 2023 Builder.io, Inc.

Security

Privacy Policy

SaaS Terms