Guides

Introduction and usage

Suggest Edits

Usage via Active Serve

👍

Use Active Serve method in production

This is the recommended method to use MotaWord Active in production environment. It lets MotaWord serve your translations much faster and immediately reflects your configuration changes from your MotaWord dashboard.

Simply insert Active JS <script> tag inside your <head> tag.

<script src="https://serve.motaword.com/{your-unique-ID}.js"></script>

Recommendations for including <script> tag

  • Put it inside <head> tag, as early as possible

  • Add crossorigin attribute to the <script> tag

    <script src="https://serve.motaword.com/{your-unique-ID}.js" crossorigin></script>
  • Use async
    <script src="https://serve.motaword.com/{your-unique-ID}.js" crossorigin async></script>

This way, Active JS will load asynchronously, as early as possible, and will start putting the translations as the DOM elements become available.

  • Do not use defer in your <script> tag as it delays translating the DOM and increases blink experience

Usage from our CDN

Simply insert Active JS <script> tag inside your <head> tag.

<script src="https://active.motaword.com/index.js" crossorigin data-token="token" data-project-id="project-id"></script>

Recommendations for including <script> tag

  • Put it inside <head> tag, as early as possible

  • Add crossorigin attribute to the <script> tag

    <script src="https://active.motaword.com/index.js" crossorigin></script>
  • Use async
    <script src="https://active.motaword.com/index.js" crossorigin async></script>

This way, Active JS will load asynchronously, as early as possible, and will start putting the translations as the DOM elements become available.

  • If your page is large, enable useDynamicTranslations or data-use-dynamic-translation in your Active configuration along with async loading of the script. This is enabled for you by default.

  • Do not use defer in your <script> tag as it delays translating the DOM and increases blink experience

Usage as a library from CDN

Simply insert the script in your page, and then you can use the window.Active object to initialize Active JS.

<script src="https://active.motaword.com/index.js" crossorigin></script>

let Active = window.Active.default;
let Configuration = window.Active.Configuration;

const config = new Configuration();
const activeInstance = new Active(config);
// .........

Usage as an NPM library

import Active from 'motaword-active-js';
import Configuration from 'motaword-active-js/configuration';

const config = new Configuration();
const activeInstance = new Active(config);
...

Updated about 2 years ago