Migrating from the old InContext editor

The InContext Editor feature has been fundamentally changed. Now the InContext Editor is part of the locize UI and not a separate web component anymore.
​tl;dr: Make sure to load this script and paste your website url in the in-built InContext view of the locize UI.
If you are using the old locize-editor this guide will help you to migrate to the new approach.
Migration should be straight forward...
1) Replace the old locize-editor
Replace the old locize-editor with the new locize script
with i18next​
import { locizePlugin } from 'locize';
​
i18next.use(locizePlugin)
​
// Using react-i18next you might want to bind the editorSaved event to trigger a rerender:
i18next.init({
  // ...
  react: {
    bindI18n: 'languageChanged editorSaved'
  }
})
with locizify​
The locize script is already included in locizify >= v4.1.0
with other as module
import { addLocizeSavedHandler } from 'locize';
​
addLocizeSavedHandler((res) => {
  res.updated.forEach((item) => {
    const { lng, ns, key, data } = item;
    // load the translations somewhere...
    // and maybe rerender your UI
  })
});
with other in vanilla javascript
<script src="https://unpkg.com/locize/locize.min.js" />
window.locizeSavedHandler = (res) => {
  res.updated.forEach((item) => {
    const { lng, ns, key, data } = item;
    // load the translations somewhere...
    // and maybe rerender your UI
  })
};
2) The new InContext view
Follow this guide.
​

Last modified 11mo ago

Migrating from the old InContext editor

1) Replace the old locize-editor

with i18next​

with locizify​

with other as module

with other in vanilla javascript

2) The new InContext view

with i18next

with locizify