LogoLogo
  • AppFlowy
    • ⭐Start here
      • Welcome to AppFlowy Docs
      • How to get help
      • Install AppFlowy
    • 🛠️Installation
      • 🖥️System Requirements
      • 💿Installation methods
        • Mac / Windows / Linux Packages
          • Installing on Linux
            • Installing & Setting up Flutter on Linux from Source
        • Docker
    • 🌱Community
      • 🤙Get in contact
      • 📔AppFlowy Mentorship Program
        • Program Guidance
        • Proposal Template
        • Pull Request Template
        • Mentorship 2023
          • Mentee Projects
            • Calendar View for AppFlowy Database
            • Custom Themes
            • Shortcuts and Customized Hotkeys for AppFlowy
            • Table
            • ⭐Favorites
            • Code Block
            • Outlines
            • Importers
            • AI Writers
            • Templates
          • Project Ideas
      • ✍️Write for AppFlowy
        • 📃Drafts
          • [Draft] Use Case: Software Engineer
          • [Draft] Use Case: High School Students
          • [Draft] How to add a new property to appflowy database
      • 🍂Hacktoberfest
    • 🛣️Roadmap
    • 🌋Product
      • 💽Data Storage
      • 🎨Customize and Style Content
      • ⏮️Duplicate, Delete, and Restore
      • 💎Databases
        • 🔢Database Properties
        • 🗃️Manage Properties
      • Ⓜ️Markdown
      • ⌨️Shortcuts
      • 🪄AppFlowy AI
      • 🦙AppFlowy Local AI - Ollama
      • 🎨Themes
      • ☁️AppFlowy Cloud
      • 🧩AppFlowy Plugins
        • Table-view Databases
        • Kanban Board
        • Calendar
        • Auto Generator
        • Smart Edit
        • Code Blocks
        • Math Equations
        • Cover
        • Emoji
  • Documentation
    • 💎Software Contributions
      • 🟢Get started
      • 💀Architecture
        • Frontend
          • Tauri
            • 🗺️CodeMap
          • Web
            • 🌟Design Philosophy
          • Flutter
            • 🗺️Project Structure: CodeMap
            • 🧮Grid
            • ⚙️Setting
          • Inter-Process Communication
          • User
            • User Data
            • Events & Notifications
          • Folder
            • Events & Notifications
          • Document
          • Database View
            • Events & Notifications
            • Grid
            • Calendar
            • Kanban Board
        • Backend
          • Initialize
          • Events
          • Delta(WIP)
          • Profiling
          • Database
        • Domain Driven Design
        • Proposals
      • 🏗️Conventions
        • 🔤Naming Conventions
        • ⌨️Code Conventions
          • 🐦Flutter
        • 🐙Git Conventions
      • 💛Submitting Code
        • 🏦Setting Up Your Repositories
        • ⤴️Submitting your first Pull Request
      • 🤟Coding Standards and Practices
        • 👽Rust Backend
    • 🚀AppFlowy
      • 👾How to contribute to AppFlowy
      • 🏗️Building from Source
        • 🌳Flutter Setup
          • 🐧Building on Linux
          • 🍎Building on macOS
          • 🪟Building on Windows
        • 🌐Web Setup
        • 📡Tauri Setup
      • ☁️Debugging with AppFlowy Cloud
      • 🔁Debugging in VS Code
      • ☎️Translate AppFlowy
      • ❓Troubleshooting
      • 👮‍♀️Licenses
    • 🏍️AppFlowy Editor
      • ⌨️How to Implement Markdown Syntax To Style Text In AppFlowy Editor
      • 🧩How to Create a Plugin for AppFlowy Editor
      • 👮‍♀️Licenses
    • ☁️AppFlowy Cloud
      • 🌈Architecture
      • ☀️Deployment
  • Guides
    • Sync Desktop and Mobile
    • Self-Hosting AppFlowy
      • ☁️Self-hosting AppFlowy with AppFlowy Cloud
      • 🆓Self-hosting AppFlowy for free Using Supabase
    • Import From Notion
  • Blog Highlights
    • 🔮Demystifying AppFlowy Editor's Codebase
  • Handbook
    • Core values
Powered by GitBook
On this page
  • Modify an Already-Supported Language
  • Using the inlang no-code editor
  • Directly in the source code
  • Add an Unsupported Language
  • How to test your changes

Was this helpful?

Edit on GitHub
  1. Documentation
  2. AppFlowy

Translate AppFlowy

PreviousDebugging in VS CodeNextTroubleshooting

Last updated 1 year ago

Was this helpful?

We'd like AppFlowy to be usable by people from all over the globe. You can help us reach that goal by contributing to our translation efforts. See below on how to fill out missing translations, modify existing translations, or add a language that isn't supported yet.

Modify an Already-Supported Language

Using the inlang no-code editor

  1. Open the

  2. Edit translations (filter & search can help)

  3. From the frontend directory, run sh ./scripts/code_generation/language_files/generate_language_files.sh on Linux and macOS, or .\scripts\code_generation\language_files\generate_language_files.cmd on Windows to generate.

  4. Alternatively, run the AF: Generate Language Task from VSCode by hitting F1, selecting Tasks: Run Task, then searching for the task.

  5. Verify that the translation has changed appropriately by compiling and running the app.

Directly in the source code

  1. Modify the specific translation file located at: frontend/resources/translations/<language-code>-<country_code>.json

  2. From the frontend directory, run sh ./scripts/code_generation/language_files/generate_language_files.sh on Linux and macOS, or .\scripts\code_generation\language_files\generate_language_files.cmd on Windows to generate.

  3. Alternatively, run the AF: Generate Language Task from VSCode by hitting F1, selecting Tasks: Run Task, then searching for the task.

  4. Verify that the translation has changed appropriately by compiling and running the app.

Add an Unsupported Language

Adding new languages from within the inlang editor is not supported yet, but you can add the language and then do the translations in inlang. (Adding via inlang is coming soon)

  1. Create a JSON file that contains the translation tokens and values. You can simply copy frontend/resources/translations/en.json and edit it from there.

  2. From the frontend directory, run sh ./scripts/code_generation/language_files/generate_language_files.sh on Linux and macOS, or .\scripts\code_generation\language_files\generate_language_files.cmd on Windows to generate.

  3. Alternatively, run the AF: Generate Language Task from VSCode by hitting F1, selecting Tasks: Run Task, then searching for the task.

  4. In frontend/appflowy_flutter/lib/startup/tasks/app_widget.dart, search for the InitAppWidgetTask class and add the new language (e.g. Locale('en', 'IN')) to the supportedLocales list :

    runApp(
      EasyLocalization(
        supportedLocales: const [
          Locale('am', 'ET'),
          Locale('ar', 'SA'),
          Locale('ca', 'ES'),
          Locale('de', 'DE'),
          Locale('en'),
          ...                // <---- Add locale to this list
        ],
        path: 'assets/translations',
        fallbackLocale: const Locale('en'),
        child: app),
    );
  5. Add the name of the language in that language to the list of language names in frontend/appflowy_flutter/packages/flowy_infra/lib/language.dart.

    String languageFromLocale(Locale locale) {
      switch (locale.languageCode) {
        case "en":
          return "English";
        case "zh":
          return "简体中文";
        case "de":
          return "Deutsch";
        case "es":
          return "Español";
        case "fr":
          return "Français";
        ...                   // <- add your language here.
        default:
          return locale.languageCode;
      }
    }

How to test your changes

Once you are pleased with your translations, compile AppFlowy, select the language and see your work come to life! If everything is working fine, don't forget to create a PR on Github so that others can also benefit from your effort.

The name of the file should be <language_code>-<country_code>.json, where language_code follows the and the country_code is a valid . For example, Spanish in Venezuela would be es-VE.json. If the language doesn't change much between countries that use it, you can simply use the language code instead, e.g. pl.json.

🚀
☎️
inlang-editor
ISO-639-1 standard
ISO3166 alpha2 country code
Change your language in the settings page of AppFlowy