# Best way to go about multiple languages

**URL:** <https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385>\
**Category:** App Organization\
**Created:** [August 9, 2017, 12:06pm UTC](https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385 "2017-08-09T12:06:01Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![IljaIljitsj](https://avatars.discourse-cdn.com/v4/letter/i/958977/32.png) [@IljaIljitsj](https://forum.bubble.io/u/IljaIljitsj)\
**Post date:** [August 9, 2017, 12:06pm UTC](https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385/1 "2017-08-09T12:06:02Z")

</div>

I was wondering how you guys think multi-language functionality is best implemented on Bubble. I want to offer two languages to my users, and the way I see it there are two main options:

**Different pages for different users**  
This would mean a separate page for Language A and a separate page for language B. No conditionals required, but you end up having more pages. Would having more pages (probably around 35 in the end) slow the app down?

**Conditionals**  
Another option is working with single pages, which have conditionals for all the elements. Therefore, if user’s language is A, the text element will show text AAA. If user’s language is B, then the element will show BBB. It is with this option that I’m really worried about the speed, because I have quite some elements on each page, and almost all of these elements will have multiple conditionals (not just the languages, but sometimes a count of items).

Both options would work equally well for my visitors in terms of ease of use. They don’t need to be able to switch quickly between languages, so the speedy use of conditionals doesn’t really offer an advantage compared to loading a new page. What do you think? Your ideas are greatly appreciated!

---

<div class="post-metadata">

**Author:** ![ericterii](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ericterii/32/26668_2.png) [@ericterii](https://forum.bubble.io/u/ericterii)\
**Post date:** [August 8, 2018, 2:41am UTC](https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385/2 "2018-08-08T02:41:56Z")

</div>

Hi,  
I have similar needs, have you been working on a solution ?  
Tks

---

<div class="post-metadata">

**Author:** ![tggrandia](https://avatars.discourse-cdn.com/v4/letter/t/c57346/32.png) [@tggrandia](https://forum.bubble.io/u/tggrandia)\
**Post date:** [October 29, 2018, 9:56pm UTC](https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385/3 "2018-10-29T21:56:52Z")

</div>

Me too! I’m trying to create a portal that supports multiple languages, and the easier solution I find right now is making the user decide beforehand, and they either go through the English or Spanish flow, however, this isn’t very user-friendly.

What would be the best way for them to be able to choose at any moment in the portal (i.e. a basic language toggle)?

---

<div class="post-metadata">

**Author:** ![dan1](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/dan1/32/23411_2.png) [@dan1](https://forum.bubble.io/u/dan1)\
**Post date:** [October 29, 2018, 10:43pm UTC](https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385/4 "2018-10-29T22:43:57Z")

</div>

@tggrandia - welcome to Bubble. I have a few [LearnTo](https://learnto.app?source=forum) tutorials that cover languages/localization.

There are two go-to methods for setting a language in the application:

- A URL parameter (better for temporary, ex. visiting a marketing site)
- Setting a language field on the user (ie. saving a language preference directly on the user)

[Most readily, this tutorial video walks you through a toggle-based approach](https://youtu.be/_eFD4w8QNM0) using URL parameters.

The basic concepts at play are a mix of URL parameters and conditional states. When you update the parameter in the URL, you have different state-based values for the text to show either the English version or Spanish version.

As well, when you have a defined language (either in a URL parameter or saved on the user), Bubble will automatically apply the alerts (ex. passwords don’t match), in the specified language.

* * *

Dan (creator of [LearnTo](https://learnto.app?source=forum) - 15+ hours of Bubble tutorials and [live coaching](https://www.usesixty.com/users/841-dan-smolkin?m=true&r=841))

---

<div class="post-metadata">

**Author:** ![keith](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/keith/32/56020_2.png) [@keith](https://forum.bubble.io/u/keith)\
**Post date:** [October 29, 2018, 11:38pm UTC](https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385/5 "2018-10-29T23:38:25Z")

</div>

[![](https://media.giphy.com/media/3o85xIO33l7RlmLR4I/200w_d.gif) ](https://media.giphy.com/media/3o85xIO33l7RlmLR4I/200w_d.gif)

Like the meme, says, why not both? One’s pages can essentially “default” to keying off of a previously-set user preference, but, if a language parameter is used in the URL (or say a handy dropdown is changed), the page elements can easily just display in that language.

The real issue is if one wants to enable a multi-lingual experience via essentially duplicating pages (this seems dumb to me in any but the simplest of sites) versus creating the equivalent of Bubble’s “app data” feature (data types representing translations of various interface components, including longer form content like descriptive text on landing pages, product info pages, etc.).

But if you do go the latter route, it’s quite easy to modify one’s pages to display as follows:

(1) current user has no language preference (display default language components as the page was originally designed.

(2) current user has some language preference set (display components in that target language, likely via a conditional on all translated elements)

(3) if a language keyword appears in the URL, override #2 and force the URL’s target language

(4) if an interface component allows language selection and user has used it, override all of the above.

This can all be accomplished in Bubble without anything like coding simply by the order of conditions from top to bottom.

Here’s an example of a page that basically does exactly what I describe above:

> **[GRUPZ.com Vacation Rental Calendar for BLUE BELL KNOLL TEST 1](https://grupz.com/avail-calendar-medium-18/1533598513737x940983987061391400?legend=yes&langselect=yes)**
>
> BLUE BELL KNOLL TEST 1 Calendar by GRUPZ.com.

Visited from the link above, we get a calendar with default US English language components. But there is also a language selector dropdown. Changing it changes the language in the calendar to whatever is selected.

If we want to override the default language and force the page to start in German we can pass a lang parameter with value “de”:

> **[GRUPZ.com Vacation Rental Calendar for BLUE BELL KNOLL TEST 1](https://grupz.com/avail-calendar-medium-18/1533598513737x940983987061391400?legend=yes&langselect=yes&lang=de)**
>
> BLUE BELL KNOLL TEST 1 Calendar by GRUPZ.com.

This isn’t a very elaborate example as the page doesn’t have a lot of text on it, but you get the idea.

UPDATE: I recently published a free plugin, “Browser Timezone and Locale” that can be used to get Locale strings (like “en-US”, etc.) from the visitor’s browser — giving an automatic way to detect language preference.

---

<div class="post-metadata">

**Author:** ![spali](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@spali](https://forum.bubble.io/u/spali)\
**Post date:** [May 29, 2021, 10:27am UTC](https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385/6 "2021-05-29T10:27:10Z")

</div>

Hi @dan1 thanks for your tutorial on using URL parameters. I have a follow-up question: your approach focuses on one page in the application, can we apply this approach to be valid for all pages in the app. Having the language toggle in a reusable header element? Thanks for your help.

---

<div class="post-metadata">

**Author:** ![cmarchan](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/cmarchan/32/253062_2.png) [@cmarchan](https://forum.bubble.io/u/cmarchan)\
**Post date:** [May 29, 2021, 12:53pm UTC](https://forum.bubble.io/t/best-way-to-go-about-multiple-languages/16385/7 "2021-05-29T12:53:35Z")

</div>

Other than using Bubble’s native functionality to provide multiple languages in your app, which I recommend, this is another alternative that could be useful to some folks:

> **[Weglot | Translate your website - Multilingual for WordPress, Shopify and more](https://weglot.com/)**
>
> Make your website multilingual using Weglot. Translate your website within minutes in multiple languages. Reach a wider audience and increase your sales. No code required. Integrates easily to your website using a dedicated WordPress plugin, Shopify...
