1. Help Center
  2. Phrase for Developers
  3. Installing and setting up the Phrase In-Context Editor (ICE)

Give translators direct links to your translatable content

Context View is an add-on for the In-Context Editor. It provides links from Phrase back to your app, so translators are always aware of the context while they work.

The In-Context Editor is available when you choose the Pro plan or a higher plan.

Context View is an add-on for the In-Context Editor. It’s automatically available after you’ve set up the In-Context Editor and used it recently. It provides translators with links from Phrase back to your application, so they always have access to contextual information while translating.

How Context View works

Context View collects information about which keys are rendered on which URLs in your web application and stores this information in Phrase. This lets Phrase generate links to your website from keys displayed in the Translation Center. Translators can click a link next to a key to go directly to its location on the site. From there, they can use the In-Context Editor to edit the translation on the page.

Setting up Context View

Context View is easy to set up:

  1. Activate the In-Context Editor by setting up a staging environment that uses it.
  2. Add the staging environment’s URL to your project settings (In-Context Editor URL).
  3. Browse your website with the installed In-Context Editor.

Information is collected automatically and stored in Phrase while you and your translators use the In-Context Editor.

Note: If your application or website uses anchor- or location hash-based routing, you’ll need to enable support for this in your project’s settings:

This will allow Phrase to collect and generate the URLs properly.

Working with Context View

Working with Context View is easy. Once Phrase has collected enough information for a key, it will automatically display a link to the correct URL next to the key in the translation view. Translators who click the link will be taken directly to the page where the key appears. The browser will automatically scroll to that exact location, and the In-Context Editor will load the key. This way, translators can edit the key’s translation right away, without having to hunt for it on the page.