azure b2c - custom UI - localize custom label

Question

I'm new into azure and I'm trying to setup b2c with custom html that contains some additional labels and css.

Here is simple example of my template

<!DOCTYPE html/>
<html>
  <body>
    <h1>It worked!</h1>
    <div id="api"></div>
  </body>
</html>

I uploaded this template into blob storage:

https://mydomain.blob.../b2c-pages/signin-ui.html

In azure b2c I'm using "Sign up and sign in" policy, enabled custom page content and this part is working, on login screen I see my custom page. Now I'm also requested to add support for multiple languages so I've enabled language customization and everything is working out of the box except text into h1 tag. I'm wondering how to provide azure b2c translation for this string? Can I specify new UXElement in my template?

After some research I've founded this link https://docs.microsoft.com/en-us/azure/active-directory-b2c/custom-policy-localization but as I can see, here there is using custom policy.

Can I fulfill my request without custom policy setup?

Edit1: Thanks to comment form Chauncy (https://docs.microsoft.com/en-us/azure/active-directory-b2c/user-flow-language-customization) I was able to figure out that I can use wildcard value {Culture:RFC5646} in url for custom UI.

So I setup Custom page URI like:

https://mydomain.blob.../b2c-pages/signin-ui_{Culture:RFC5646}.html

and I uploaded files like

https://mydomain.blob.../b2c-pages/signin-ui_en.html
https://mydomain.blob.../b2c-pages/signin-ui_fr.html

My question is, dose this approach is correct or I misunderstand the docks?

see this.docs.microsoft.com/en-us/azure/active-directory-b2c/… — Chauncy Zhou
are you referring to "Customize the page UI by using language customization" section? To be honest this section is not clear for me what to do? Can you please clarify it for me? Thanks. — surzyn

Chauncy Zhou Chauncy Zhou · Accepted Answer · 2020-08-25T02:43:03

I tried to test your method and you are right.We can customize the language in this way. Here's how I tested it.Thank you for discovering this method.

The important thing is that the parameters must be passed in here.

azure b2c - custom UI - localize custom label

1 Answers