Toggling between languages

[hg_dxb]

Been playing around with the toggle component and I can see how in theory, I could place a toggle to switch the platform language.

In terms of implementation, would the toggle action basically link to another set of screens in the second language? I’m thinking I’d need to, at the start, limit which screens this language toggle is placed on.

My additional challenge is that it’s toggling between English and Arabic but I see that as a design issue to be addressed separately.

Has anyone tried this before? Any advice on the cleanest way to implement this?

[montetennis]

Currently there is no support on Adalo for language translation.

However, I think the cleanest way to implement language translation is:

• Finish your app in one language
• Keep the number of screens as limited as possible
• In the splash screen, make the user select the language
• Duplicate the app, and redirect people based on the language selected. Note that the toggle button might not be the best way to access one or the other application: I suggest you an image with the flag of each language

Best

Paolo

[hg_dxb]

Fair enough! Thanks for the suggestions on the components. My thoughts were exactly that - to redirect the user from the splash screen.

[Repackaged]

Hi @hg_dxb ,
I agree with @montetennis . I had the same use case and I added a language selector on the home screen.

I added a drop-down menu to read a Language Collection in Adalo. I found it to be cleaner that way as you can easily add languages down the road and keep track of your user’s language preferences for future marketing communications and segmentation.

Depending on which language they select, you will have to wire the next screen to the right app experience.

Hope this helps.
حظا سعيدا

[hg_dxb]

Good point about bring able to easily add languages in the future. The screenshots are helpful too

شكرا

[Maxi]

Thanks for the tip.
Personally, I was thinking to duplicate my app and translate it manually (I use only PWA).
The question is, how to be with a home screen if we can pick only one.

Does your app prompt users to choose the language every time they open your app?

[Repackaged]

Since we can only have one LoggedIn Entry screen, what I did is have as many screen actions as you have languages. Each of these actions will check the current user’s language preference and route them to the right language experience screens.

Here’s an example of how I route the experience to Spanish as I detect the current user’s preference for that language.

Hope this helps.

[Maxi]

Thank you sooo much.
I didn’t know that the app checks “user logged in” every time a user opens an app. But it totally makes sense. We live, we learn

[Maxi]

One remark though.
Your users still have to create an account using English (default) language, and then you redirect them, right?

[Repackaged]

When users sign up, they are asked to make a choice between English and other languages. This is where I take their answer and set it in a field in the User Collection. This will then determine which experience (and therefore screen) to route them to.

[Maxi]

I am a bit confused now. A bit earlier you said that we can have only one “Sign up” and “Log in” screens.

But you do actually use multiple “Sign up” and “Log in” screens in different languages, correct? And you ask users to pick a language before the “Sign up” screen?

[Repackaged]

I have several Sign Up/Sign In screens depending on languages, correct.
What I said is that we can only have one screen that’s tagged “LoggedIn Screen” which is the screen that will be shown if the user is logged in and comes back to the app. This is where I have actions running as “Screen Actions”, where I check for the current user’s language before I route them to the right experience.

You are also right in that I ask my users to chose a language before they sign up/sign in.
I hope this clarifies

[hg_dxb]

So the flow would be something like this

1. User opens app for the first time
2. User is on a landing page in EN (or whatever your primary language is) where they decide which language they want to continue in. In this case, the user picks FR.
3. User is redirected to the screen FR Signup.
4. On the sign up page, if user already has an account, they have a link to open FR Login
5. Once the user is logged in, they can go to FR Settings and switch language, let’s say to EN.
6. User is redirected to EN Settings and can continue navigating all the EN screens

Hope that helps!

[Repackaged]

That’s a good-looking home screen @hg_dxb. Can’t wait to try your app. Keep it up