Skip to main content

Server Mode

Server mode connects your site to a running Loco instance. Text nodes are discovered and registered in real-time, and translations are fetched from the server on demand.

Setup​

<script src="https://your-loco-server.com/cdn/loco.js"></script>
<script>
  Loco.init({
    apiUrl: 'https://your-loco-server.com',
    apiKey: 'YOUR_API_KEY'
  });

  // Apply a language (can be called anytime)
  Loco.apply('fr');
</script>

How it works​

  1. loco.js scans the DOM and extracts all translatable text nodes
  2. Text nodes are sent to POST /api/textnodes and appear in the dashboard as Pending
  3. A MutationObserver watches for new DOM nodes and registers them automatically
  4. Loco.apply('fr') fetches approved translations from GET /api/translations?lang=fr and swaps text in the DOM

Getting the API key​

The API key is printed on server startup. You can also find it in Dashboard → Settings.

Floatable language switcher​

Loco.widget({ position: 'bottom-right' }); // 'bottom-left' | 'top-right' | 'top-left'

Dynamic content (SPAs)​

The MutationObserver is active by default. Newly added DOM nodes are registered automatically with no extra code needed.

You can manually pause and resume scanning:

Loco.stopScan();   // pause observer
Loco.startScan();  // resume observer
Loco.rescan();     // force re-scan now

Security​

All API routes except /api/project require the X-API-Key header. The loco.js client sends it automatically after Loco.init().