Custom localisation service

Hi there!

I’m currently working on a demo of a builder for the customer, and I’m looking for the best way to integrate a custom localisation service.

Currently, our product uses one of the headless CMSes and service for translations. We are fetching data from CMS, then requesting localization service with content to translate.

Can we achieve something like this using builder.io? Somehow gather list of copies on the site and then forward it to our translations provider?

thanks,
Krzysztof

Hi @krzysztof ! Thanks for the question!

So if I understand this correctly, you have 3 entities here…

  1. a 3rd party CMS
  2. a 3rd party translation service
  3. Builder

You want to take content from CMS #1 and send it to translator #2 and then populate pages in Builder with the translated text coming from #2?

This should be fairly straight forward actually with Builder. I am assuming the content will be available from an API, and if so you can easily connect your data to any Builder page and then use data bindings to populate your page with the data.

We even have multiple ways in which you can localize your page, either by localizing specific fields, or creating entire content entries for each localized content block. You can find more on localization here: Localization Intro - Builder.io

Do you think this approach would work for you? Is there a different flow you had in mind? Let us know!

Hi @TimG!

Actually, I was not clear enough. We want to remove our current headless CMS service and replace it with builder.io.

Let’s take an example of a simple section with a caption inside - We are fetching CMS data, and retrieving payload with this caption (in English), then we are making a request for a translation service to reach translation of this caption for the user-specific locale.

Now we want to recreate such behavior using a visual builder. Is there any possibility to, for example, create a visual component then reach every caption inside, and at the end replace it with some specific translations?

example with simple, visual builder section:

I want to reach the caption which is inside (“Hello”) and send it to the translation service. Then after I’ll receive translated text, I want to replace it.

Thanks for your help!

Hi @krzysztof got it, and one last thing this translation you want to happen real time? When the user hits the page?

There are a lot of options for field and page level localization with Builder, so ideally the content would be translated before render within Builder and then you could use targeting to serve the correct page/content to an end user.

If you want to do it in the browser through an API that is also possible, using custom JS either on the entire page, or within data bindings for individual content.

If you have a page in Builder where you have the content and any API for your translation service I am happy to take a further look!

Lastly, do you have a specific translation service that you are currently using? I can let you know if it is something we are looking to integrate in near future.

@TimG
We are using NextJs, and I wanted translation to happen on the server-side - then replace content from blocks with translated data.

I’ve seen localization by using content targeting, but it seems like the content editor needs to place translations - the same thing for field localization, and we have a service for this.

For translations, we are using OneLink from Transperfect.

Do you think it’s possible to gather every text placed into a visual builder, and then replace it with translations?

Thanks!

Do you have more information on how OneLink works? Do we just need to send them our content, perhaps just the content JSON from your pages and they would be able to translate the text inputs? How do you pass them your content and mark it to be translated?