Easily restore your project to a previous version with our new Instant One-click Backup Recovery

How to build and manage multilingual products with Hygraph and Lokalise

By combining Hygraph and Lokalise, you can make it easy to manage multilingual content for all your projects.
Ilya Krukowski

Ilya Krukowski

Sep 25, 2024
How to build and manage multilingual products with Hygraph and Lokalise

Making your product available in multiple languages is not just beneficial, but essential if you want to reach a global audience. But how do you manage all your content in multiple languages? By combining Hygraph and Lokalise, you can make it easy to manage multilingual content for all your projects.

A bit about Lokalise

Lokalise is a localization and translation platform that helps teams manage translation and other localization tasks in one place. Its seamless integration with Hygraph consolidates your localization workflow, offering AI-powered translations, automation, and quality checks. This integration helps you meet deadlines and deliver consistent content to users around the world.

In this guide, I’ll walk you through what you need to think about when localizing your software, the benefits of using the Hygraph-Lokalise integration to make your workflow smoother and faster, and finally, how to start using Lokalise with Hygraph.

How to prep codebases for global audiences

Need to get your products ready before you start making products multilingual? Join us in London on 8th October for a free localization training course.

Register for free here

#Understanding the components of good localization

When localizing your product, translating text is just one part of the equation. You also need to consider how your content aligns with the cultural and regional expectations of your audience. Key factors include:

Layout adjustments

Does your product need to support right-to-left (RTL) languages like Arabic or Hebrew? If so, your design must be flexible enough to accommodate this. You might also need to adjust fonts or spacing. For example, Asian users often prefer tighter layouts with less space between content, while European audiences might favor more open designs.

User preferences

Localization involves adapting to local user behaviors, not just language. You may need to change how users navigate your site or how payments are processed to meet regional expectations. What's intuitive in one market might be confusing in another.

Target markets

How many markets or locales are you supporting? Each may require specific adjustments, from font changes to unique user experience preferences. It's crucial to account for these differences as you scale.

Scaling localization

In Hygraph, you can create schemas for different languages — one for French, one for English, and so on. This works well for one-off projects and when you're only handling a few languages.

However, as your multilingual audiences grow and translation work becomes part of everyday product updates, this method doesn’t work. Managing localization for 35 languages and 60 markets manually is unscalable, and relying on large Excel sheets is inefficient and error-prone.

To effectively manage large-scale localization, integrating Hygraph with a platform like Lokalise is essential. This integration automates much of the process, allowing you to handle hundreds or thousands of content pieces across multiple languages and markets without manually updating every field.

#Benefits of using the Hygraph-Lokalise Integration

Managing content for multiple locales can be complex. However, integrating Hygraph and Lokalise simplifies the process and offers several key advantages. Here's how this powerful combination streamlines multilingual product management:

One source of truth

A major benefit of combining Hygraph with Lokalise is establishing a single source of truth for all your content. By centralizing strings, variables, and key descriptions, managing translations and collaborating across teams becomes significantly easier.

Instead of juggling Excel files, JSON files, or multiple versions scattered among developers and project managers, everything is organized and accessible in one place.

This centralized approach is especially helpful when dealing with subtle differences between locales. For example, while both France and Belgium use French, localized content might require adjustments. Keeping everything in a central repository prevents inconsistencies and errors that can occur when content is dispersed across various formats or stored on individual machines.

Simplified content updates and version control

With your content centralized, handling updates and tracking version control becomes much simpler. When teams in different countries localize content, everyone works from the same data set. This avoids version conflicts and duplication of work, ensuring that the latest content is always available. Consistency across teams is maintained, and any changes are synchronized automatically.

Optimized localization workflow

By using Lokalise for translations and Hygraph as your CMS, you can optimize your entire localization workflow. Automating repetitive tasks reduces the time spent on manual updates and minimizes errors. This automation ensures that localized content is updated efficiently across all languages and regions, so nothing slips through the cracks.

Consistency across languages

Maintaining consistency is crucial when managing content in multiple languages. Integrating Hygraph and Lokalise ensures that your content remains uniform in terminology, tone, and formatting. Centralizing everything guarantees that your message stays clear and on-brand across all languages and locales.

#Key features and tips for Hygraph-Lokalise Integration users

Before diving into the integration, assessing your specific needs is important.

What challenges are you facing, and which tasks could be automated?

Lokalise provides several tools to simplify and accelerate your workflow.

Consider these features:

  • Pre-built SDKs: Simplify the integration process with ready-to-use software kits
  • Over-the-air (OTA) updates: Push content updates without releasing new product versions
  • Lokalise API: Automate workflows and connect Lokalise to your other tools
  • Solutions architects: Access expert advice from Lokalise for complex localization needs
  • Variables: Customize translations based on dynamic data for different locales
  • Lokalise AI: Use AI to automatically translate content quickly without sacrificing quality
  • Automations: Reduce manual work and improve efficiency with automated processes
  • Batch Editing: Save time by making changes to multiple translations at once
  • Content Editor: Manage translations through Lokalise’s intuitive content editor
  • Quality Assurance (QA): Catch translation errors before they go live with built-in quality checks

#Tutorial: Setting up the Hygraph-Lokalise integration

Step 0: How the Hygraph-Lokalise integration is built

Before setting up the integration, you might want to understand how Hygraph and Lokalise work together.

Hygraph employs a management SDK to connect with various processes and integrate tools like Lokalise. This SDK is loaded with hooks and customizable points in the code, enabling you to plug localization services directly into your CMS. Lokalise, as a dedicated localization platform, connects to this structure to manage translations effectively.

At the core of your multilingual product lies Hygraph, which stores and organizes all your content. With everything in place, you can use GraphQL to query specific content for each locale, retrieving exactly what's needed. This setup not only simplifies localization but also scales efficiently, ensuring that as your content expands, your workflow can handle it smoothly.

Now, let's go through the steps to configure the Hygraph-Lokalise integration.

Step 1: Sign up to Lokalise and create a new project

If you don’t have a Lokalise account yet, start by signing up for a free trial.

Follow the setup wizard to create a new translation project or follow the instructions below:

Create a translation project:

Head to the Lokalise project dashboard and click New Project. Choose the Web and Mobile project type:

undefined

Adjust the following options:

Project name: Add a descriptive name that fits your project
Base language: Choose the original language of your content. This is the language you’ll be translating from.
Target languages: Select one or more languages you want to translate into. You can also choose region-specific languages if necessary (e.g., French Canada - fr_CA).

Once you’ve set everything, click Create Project.

undefined

After your Lokalise project is created, click More > Settings from the top menu.

Find the Project ID section and take note of the value. You’ll need this ID later when setting up the integration.

undefined

Now, click on your avatar in the bottom left corner and select Profile settings.

undefined

Go to the API tokens tab and click Generate new token.

undefined

Choose the token type Read and write access to your projects and click Generate.

undefined

Tip: Take note of the generated token, as you’ll need it in the next step to connect Lokalise with Hygraph. Be sure to keep this token secure and do not expose it publicly.

Step 2: Register on Hygraph and configure your project

If you don’t already have a Hygraph account, sign up here.

Next, follow the quickstart guide to create a new Hygraph project. Once the project is created, it’s time to configure the locales and schema.

Open your project and go to Project Settings > Locales.

undefined

Add all the locales (languages) you’ll be translating into. Make sure to use the exact same language codes as those you selected in Step 1 when creating your Lokalise project.

undefined

After setting up your locales, you’ll need to adjust your schema to support localization.

Go to Schema and select one of your models.

undefined

To make a field translatable, click Edit field next to the field you want to localize.

undefined

In the field settings, check the Localize field option and save your changes.

undefined

Repeat this process for any other fields that need localization.

Step 3: Install the Lokalise app for Hygraph

Now that your Hygraph project is set up, it’s time to install the Lokalise app to connect the two platforms.

Go to the Lokalise app on the Hygraph marketplace at hygraph.com/marketplace/apps/hygraph-lokalise-app and click Install Lokalise for Hygraph.

Choose your project, select the environment, and then click Install app.

undefined

Review the requested permissions and click Authorize app.

You’ll be prompted to enter the Lokalise API token and project ID you obtained in Step 1. Additionally, choose at least one model that you want to use the app with, then click Save.

undefined

And that’s it! The Lokalise app is now installed and connected to your Hygraph project. If you need to adjust the app's settings later, you can always return to your Hygraph project, click Apps, find Lokalise in the list, and click Edit.

Step 4: Submit content for translation

Once your Lokalise app is set up in Hygraph, it’s time to submit your content for translation.

Open the Content tab in Hygraph and switch to the Lokalise app view.

undefined

Select the content you want to translate by ticking the corresponding checkboxes. Once done, click Submit to Translate.

undefined

Next, choose the locales you wish to submit the content for.

undefined

  • If this is your first time exporting content and it hasn’t been translated into any other locales yet, select only the base language (e.g., English).
  • If you already have content in other locales, you can select those as well. However, keep in mind that any existing content in Lokalise for the chosen locales will be overwritten by this submission.

After selecting your locales, click Submit to Translate and wait for the process to complete.

Step 5: Manage and translate your content on Lokalise

Now that your content has been submitted for translation, head back to your Lokalise project. Under the Editor tab, you’ll see all your content neatly organized.

undefined

To begin translating manually, simply click on any Empty word, and you can start entering translations right away.

Alternatively, you have the option to invite new contributors to help with translations, request professional translation services, and more. You can check out Lokalise's onboarding guides for more detailed instructions on these features.

In this tutorial, we’ll focus on how to use Lokalise AI to easily translate large volumes of content into multiple languages.

In the Editor, tick the translation keys you want to work with and choose Create a task from the dropdown. Click Proceed, then click Confirm.

undefined

Choose Automatic translation, give your task a name, and optionally provide additional instructions for the AI.

undefined

Click Scope and assignees. Ensure that the source language (e.g., English) and the target languages are selected properly. Then, click Create task.

undefined

Wait for the AI to complete the task. Once it’s finished, you’ll see the translated content in your Lokalise project.

undefined

Step 6: Import translated content to Hygraph

Once your translations are ready in Lokalise, it’s time to bring them back into Hygraph.

Go back to your Hygraph project and navigate to Content > Lokalise app view. Select the items you want to import and click Import Translation.

undefined

Choose the locales for which you want to import translations. Keep in mind that any existing data in these locales will be overwritten. When you’re ready, click Import Translation.

undefined

Now, open your content, and you’ll see the translated values. Use the Localizations tab on the right side to show or hide different locales.

undefined

And that’s it! Your translated content is now imported into Hygraph. And within minutes.

Note: you can translate as many words at one time with Lokalise AI – it all depends on how tight your deadlines are.

#Conclusion

Managing multilingual content across various markets and languages can be a complex task, but by integrating Hygraph with Lokalise, the process becomes much smoother and more efficient.

With Hygraph as your content hub and Lokalise handling the translations, you can centralize your workflows, automate repetitive tasks, and ensure consistency across all locales.

In this tutorial, we walked through how to set up the integration, submit content for translation, manage translations with Lokalise AI, and finally import everything back into Hygraph. With these tools working together, your team can easily scale localization efforts and maintain high-quality content across all languages.

By following these steps, you’re now equipped to deliver a user-centric, multilingual product that resonates with audiences worldwide.

Blog Author

Ilya Krukowski

Ilya Krukowski

Technical Content Lead, SDK/integrations dev

Ilya is head of content, documentation, and onboarding at Lokalise, an IT tutor and author, web developer, and ex-Microsoft/Cisco specialist. His primary programming languages are Ruby, JavaScript, Python, and Elixir. He enjoys coding, teaching people and learning new things. In his free time he writes educational posts, participates in OpenSource projects, goes in for sports and plays music.