All Collections
Localization Guides & Tips
Localization tips & workflows
The Complete Guide to Adding Context to Strings
The Complete Guide to Adding Context to Strings

Transifex provides multiple methods of providing context to translators in order to help them translate each string.

Jacob avatar
Written by Jacob
Updated over a week ago

Written Forms of Context

Developers and Project Maintainers can provide written instructions to translators to describe each string's context. The two forms of written context are:

  1. Developer Notes:

    This information appears in the translation editor here:

    These types of notes are added to source files by developers. Not all file formats support developer notes, though. The file types that support developer notes are the following: Android XML, Apple PLIST, Apple Strings, JSON (Chrome), Structured JSON, PO, Mozilla DTD, Windows Resx, Resw and Resjson, Xliff, xlsx (as context) and YAML.

  2. String Instructions:

    If your file type does not support developer notes, then written context can be added in the form of a string instruction either manually or via the API as metadata. String Instructions appear in the same location as developer notes.


Visual Forms of Context

Sometimes, a translator needs to see where the string resides on a screen to get a feel for how a string is translated. For such cases, Transifex provides the following options:

  1. Visual Context For Mobile Applications:

    Space constraints are a premium when creating mobile applications. We recommend our visual context feature, which maps strings to screenshots. This will enable translators to see where the strings reside on the screen physically. Screenshots can be uploaded manually or via the API. Conversely, strings can be mapped manually or via the API.

    The resulting mapping can be viewed in the translation editor. Source strings that have visual context are displayed with a little screen icon, as seen below:

    visual-context.jpg#asset:7973

    Clicking on the icon will allow you to view the mapping under the context tab in the editor, as seen below:

    vcontext2.jpg#asset:7974

    Clicking on the screenshot in the screenshot list will open up the mapping. Note a string can be associated with multiple screenshots. This feature requires the Growth plan and up.

  2. Visual Context For Web Applications (Context For Files):

    We highly recommend using the Context for Files feature with your web applications. This feature pinpoints the exact location of a string on your webpage without any manual effort or programming. All that is required is the installation of a small JavaScript snippet on each web page in your app. This three-line piece of code will then map your strings to your website.

    The context for files works by providing a list of URLs associated with a given string. As an example, see the image below:

    Clicking on a given URL in the list will open up the web page with the string highlighted as seen below:

    The original source text would be highlighted if the string was not translated. This feature is a paid add-on that can be added to any plan.

  3. Visual Context For Web Applications (Transifex Live):

    Within Transifex, you have the option to translate directly on your website. This is called Transifex Live. Because you are translating directly onto your website, you can see how all the strings are arranged.

    This project type is helpful if you translate a website that has never been localized, is not heavily SEO dependent, or would like to get started quickly without using your development team. More information can be found here. Transifex Live is included in any paid plan.

  4. Visual Context For Users of Figma:

    If your development team uses Figma as their design tool, then designs from Figma can be imported into Transifex, complete with strings mapped to the appropriate graphic. You'll need to select the strings in your Figma Layout that you wish to translate and click the push to Transifex button in our Figma Transifex Plugin. The strings are sent to Transifex, along with the Figma Layout. The translator then accesses the screenshot in the same manner as indicated in the Visual Context For Mobile Applications section (Item 1 above).

    More information can be found here. This plugin is a paid add-on available on any plan.


Other Forms of Context

When context is not provided, translators often ask for it via a comment or an issue. Issues differ from comments in that they need to be resolved. The responses to these issues and comments can be perceived as context and can be filtered in the translation editor. It is preferable, though, when responding to context-related comments and issues, to add String Instructions as well, as string instructions are more visible.

For more information on how to use context, please read the blog post here.


💡Tip

Looking for more help? Get support from our Transifex Community Forum!

Find answers or post to get help from Transifex Support and our Community.

Did this answer your question?