In-Context Editor

View and edit translations on your website in real-time!

Provide your translators with visual context when adding and editing translations, so they can see where translations appear in your website. Here's how it works.

In-Context Editor Video Tutorial

Watch this short video that shows how you can use the In-Context Editor to translate your website.

📘

Navigation

To navigate between pages in your website while in the In-Context Editor, double-click on any link or button in the page.

The new page will be displayed and you can continue to add/edit translations in the new page.

Using the In-Context Editor with In-Progress Disabled

Follow these instructions when you don't have the Advanced In-Progress Workflow enabled.

  1. Click on Manage Phrases in the left nav bar.
  2. Click on the In-Context Editor link.
  3. (1) Enter the desired URL into the address bar and press enter/return.
  4. (2) Select a target language on the left.
  1. (3) Select any content with a "box" around it that you want approved/edited.
  2. (4) Either click on the translation itself, or click the Edit button to edit the translation.
  3. When ready, click the Publish button.

Using the In-Context Editor with In-Progress Enabled

Follow these instructions when you do have the Advanced In-Progress Workflow enabled.

Depending on which bin a phrase is in will change the options available to you when working with translations in the In-Context Editor. The same workflow that is used in the Manage Phrases page will be used in the In-Context Editor.

Phrases in Needs Review

For phrases in the Needs Review bin, you can use the In-Context Editor to review the translation, and either:

  • Publish the translation
  • Decline the translation
  • Propose a new translation (edit the translation)

When viewing/editing a translation, the translation will appear in the context of the page.

Phrases in Pending or Needs Translation

For phrases in the Pending bin or Needs Translation bin, you can use the In-Context Editor to:

  • Propose a new translation (create the translation)

After creating a translation, the translation will appear in the context of the page.

Phrases in Published

For phrases in the Published bin, you can use the In-Context Editor to review the translation, and either:

  • Propose a new translation (edit the translation)
  • Unpublish the translation

Troubleshooting the In-Context Editor

The In-Context Editor can sometimes fail to load due to certain browser security restrictions.

Localize Editor Chrome Extension

🚧

Getting this message?

There was an error loading your website. Please verify that the localize.js Javascript snippet is installed on the website you entered. If localize.js is installed and you’re still seeing this message, your website may have restrictions in place preventing it from being loaded in an iFrame. Please read our help center doc to find out more.

The In-Context Editor can sometimes fail to load due to certain browser security restrictions, due to its use of iframes. You may need to adjust your HTTP headers to resolve the issue. MSDN has a great article explaining the problem.

The simplest solution is to install the Localize Editor Chrome extension to bypass the browser security restrictions.

Advanced Troubleshooting

Is Localize Installed?

Make sure that the Localize JavaScript library is active and properly installed on your website or application. The editor will not work without the JavaScript SDK active on the page.

HTTPS Required

Please note that TLS/SSL connections are required for utilizing the In-Context Editor. "HTTP" only websites will no longer load within the editor due to security restrictions.

This often presents a problem when using the editor with localhost or staging environments. In these cases, you may utilize a SSL certificate to enable "HTTPS" on local or staging environments.

Alternatively, tools such as ngrok may be used to tunnel localhost connections through a public and secured temporary endpoint.

If using a self-signed SSL certificate, you may have to load the webpage outside of the editor to override browser warnings that may be triggered by self-signed certificates.


Did this page help you?