How do i change Firebase-ui language?

Viewed 5389

How can i change the default language of the firebase-ui login ?

LanguageLogin

2 Answers

I achieved firebaseUI translation to my local language by following these steps:

    1. Clone firebaseui-web repository
git clone https://github.com/firebase/firebaseui-web

    1. Once the repo is cloned, go inside the just created firebaseui-web folder and run:
npm install 
npm run build build-js-pt-BR && npm run build build-npm-pt-BR

*Note: In my case I wanted to set firebaseUI to brazilian portuguese, therefore I used the language code pt-BR when running 'npm build'. Consequently the generated files will have a pt_br suffix. Just replace this with your desired language code to have firebaseUI working on the language you want. Here you find a list of all supported languages and its codes: https://github.com/firebase/firebaseui-web/blob/master/LANGUAGES.md


    1. In the created firebaseui-web/dist/ folder, copy the "firebaseui__pt_br.js" and "npm__pt_br.js" files and paste them into your project's node_modules/firebaseui/dist/ folder
    1. Go to your your project and replace the standard firebaseui import: Instead of importing from firebaseui, refer now to the firebase/dist/npm__pt_br.js file you just added into node_modules, like this:
import * as firebaseui from 'firebaseui/dist/npm__pt_br'
    1. That's it! Now you should have firebaseUI configured to our language of choice!

picture of firebaseUI translated to brazilian portuguese

More details on these links:

https://github.com/firebase/firebaseui-web#building

https://github.com/RaphaelJenni/FirebaseUI-Angular/issues/42

This answer was obtained from https://pt.stackoverflow.com/questions/423285/alterar-idioma-do-template-do-firebaseui. Thanx @Klebers for the having this issue solved!

From the documentation:

Localized versions of the widget are available through the CDN. To use a localized widget, load the localized JS library instead of the default library:

<script src="https://www.gstatic.com/firebasejs/ui/3.4.0/firebase-ui-auth__{LANGUAGE_CODE}.js"></script>
<link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/3.4.0/firebase-ui-auth.css" />

where {LANGUAGE_CODE} is replaced by the code of the language you want.

For a longer explanation read the docs on Github linked above.

Related