Skip to main content
Version: 5.x.x

In-context translating

For local development, supply apiUrl, apiKey options (see Integration) and DevTools plugin. If you set everything properly, you can use in-context translating:

  1. Press and hold Alt/Option key
  2. Navigate mouse over any translation on your website
  3. It should get highlighted
  4. Click on it to open "Quick translation" dialog
  5. You can edit translations (changes will get stored to Tolgee platform)

NOTE: If you use Tolgee without any integration, make sure you call run method.

One-click screenshots

To generate screenshots automatically, you have to have installed Tolgee Tools plugin for Google Chrome browser. With this plugin, you can generate screenshots by clicking camera icon in Tolgee UI translation dialog.

In-context on production

To enable in-context translating on production you can pass apiKey and apiUrl through Tolgee Tools plugin, that way Tolgee will switch to development mode (plugin will also supply @tolgee/ui package automatically).

danger

Never include apiKey in Tolgee configuration on production. This property is intended only for local development, as it's not meant to be publicly visible.

  1. Install Tolgee Tools plugin
  2. Go to the production version of your website
  3. Click on Tolgee Tools extension and apply your API key (you might need to reload if you just installed the plugin)
  4. In-context translating should work

You can also check Step-by-step tutorial

A few notes about Tolgee Tools plugin

  • You can turn off development mode by switching "Applied" toggle, which will turn it off, but stores credentials locally so you don't have to fill it again next time
  • Plugin will supply apiUrl from Tolgee configuration if it's present (if not you can fill it manually)
  • Plugin changes its icon if Tolgee is present on the page or if credentials are set