Glide Experts are skilled no code developers who build Glide apps professionally. Gideon Lahav has been an Expert for four years, building over 100 apps for more than 70 clients. In this series, he shares some of the things he has learned about how to build high-performing Glide apps for yourself or others.
As apps become increasingly global, delivering a multi-language interface is essential to enhance user accessibility and engagement. As Glide builders, we often want to deliver apps that cater to a global audience. This includes offering multi-language support within a single app or across apps tailored to specific languages.
When building In Glide, language options can be integrated into your app to provide a smooth user experience—though there are some limitations in text direction changes. In this article, I’ll guide you through two main approaches to integrating multi-language functionality within Glide.
The first is using user profiles to dynamically control language visibility within a single app—ideal for languages that share the same text direction.
The second approach involves creating separate apps for LTR and RTL languages, offering a full solution for languages like Hebrew and Arabic that require RTL support.
The first approach is best suited for apps offering multiple languages with the same text direction (LTR or RTL). This method allows a single app to serve diverse language needs without requiring duplicated content management across separate apps.
Start by adding a language field in the user’s profile. You can use a dropdown or choice component to allow users to select their preferred language. This selection will be the basis for all visibility conditions applied across the app.
With Glide’s visibility conditions, components can be shown or hidden based on the user’s selected language. By setting conditions according to the chosen language in the user’s profile, you can create a customized user experience in their native language.
There are three main strategies for handling component-based translations within a single page:
For apps requiring both LTR and RTL language support, creating separate apps is the only approach. This method is ideal for apps targeting just a single LTR or RTL language, such as English, Arabic, and Hebrew.
Begin by developing the primary app in one language direction, then duplicate it to create a version for the second language direction. Ensure that both apps share the same data source (such as Google Sheets or Glide Tables) to maintain synchronized data across both versions.
To achieve RTL alignment for specific languages, custom CSS is essential. This feature is available only on Glide’s paid plans, which allows you to apply CSS modifications to enhance the text direction and layout for RTL languages. Below is a CSS snippet that can be used to adjust key elements for RTL alignment:
Copy code
/* Set direction to RTL for specific classes */
[class*=”main-content”],
[class*=”wire-container”],
[class*=”wire-switch”],
[class*=”mobile-nav-bar”],
[class*=”wire-hero”],
[class*=”card-collection-list”],
[class*=”wire-field”],
[class*=”wire-base-picker”],
[class*=”wire-choice”],
[class*=”wire-hint”],
[class*=”mobile-tab-bar”],
[class*=”pages-checkbox”],
[class*=”wire-dropdown”],
[class*=”slide-in-content”],
[class*=”overlay-content”] {
text-align: start;
direction: rtl;
}
/* Reset direction for specific class */
[class*=”charts”] {
direction: ltr;
}
/* Adjust padding for navigation bar */
[class*=”desktop-nav-bar”] {
padding-left: 4px;
padding-right: 0px;
}
/* Adjust image style for specific classes */
[class*=”card-collection-list”] img,
[class*=”sc-pFZIQ”],
[class*=”sc-bBXqnf”],
[class*=”nav-bar-common”] img {
max-height: 50px;
object-fit: contain;
max-width: 188px;
}
Note: Adding CSS to a Glide app is a powerful way to achieve customized design, but it requires ongoing maintenance. Glide frequently updates and enhances its components, which can affect custom CSS functionality. Developers need to be vigilant about adjusting CSS as Glide evolves to ensure compatibility and maintain the intended layout. This ongoing effort is essential to ensure that the app remains user-friendly and visually consistent over time.
When creating separate apps for different languages, it’s essential to keep the data synchronized between them to ensure a consistent user experience. Both versions will rely on shared data sources. This setup ensures that any changes in data, like user profiles or content updates, are reflected in both language versions simultaneously, making it easier to manage user interactions across different languages.
Maintaining Consistency Across Features and Design
In addition to data, any updates made to app features, layouts, or design elements in one version must be replicated in the other. This might include adjusting page structures, navigation menus, or component visibility settings to keep the user experience uniform. Glide’s “Duplicate App” feature can simplify initial setup, but ongoing updates require careful attention to ensure both apps remain aligned over time.
Using Glide’s Manual Publishing for Unified Releases
To streamline updates across both language versions, Glide offers a “manual publishing” option. This feature allows you to make all updates within each app and hold off on releasing them until you’re ready. Once the updates in both apps are complete, you can publish them simultaneously, ensuring users experience a seamless transition across both language versions without unexpected discrepancies.
By managing data and feature synchronization carefully and using manual publishing, you can maintain a cohesive experience across all language versions. This approach supports a professional and polished appearance, making it easier for users to switch languages without encountering inconsistencies in the app’s functionality or appearance.
Once the separate apps for each language are ready, it’s crucial to provide users with an easy way to navigate to the appropriate language version. Add a button with an “Open Link” action to redirect users to the version they need based on their language preference. This helps create a seamless experience, allowing users to quickly switch to their preferred language app.
Tip: To make the experience even smoother, consider setting up subdomains or domains with language-specific initials. This can help users recognize and remember the links to different language versions more easily. Here’s an example:
This approach also simplifies sharing links with users in different languages, reinforcing a professional, multi-language brand identity.
Creating a multi-language application in Glide requires strategic planning and consideration of text direction. By leveraging user profiles for visibility-based translations, developers can offer language support within a single app for languages that share the same direction. For apps needing both LTR and RTL support, duplicating the app with custom CSS ensures proper alignment and readability. Both methods have unique advantages and limitations, allowing developers to provide a localized experience that enhances accessibility and engagement.
With the right guidance, you can turn your vision into a real, working app — no code needed.
