Integration Guide (for non-Isomer websites)
Instructions for non-Isomer websites to have Polyglot integrated and ready to serve translations.
Polyglot will only work when your website's URL is registered with the Polyglot team. If you are unsure, contact us for assistance.
Step 1: Add the script tag
The script tag has to be added before the closing tag in each and every page that you want translated.
Script tag to add
<script src="https://assets.polyglot.gov.sg/widget.js"></script> |
|---|
Step 2: Whitelist for Content Security Policy (CSP)
If your site enforces a Content-Security-Policy header, add the widget and server domains to it. Otherwise the browser will block the widget's script and API calls.
CSPs to whitelist
Directive | What to add | Why |
|---|---|---|
script-src | loads widget.js | |
connect-src | widget calls /config and /translate | |
style-src | 'unsafe-inline' | the widget uses a Shadow DOM and injects a <style> tag plus inline style attributes on its icons, no nonce or hash support yet |
frame-src | needed to allow editors to use the in-page translation editor (Alt+Shift+P), which opens a hidden iframe to Studio to isolate the auth token |
Step 3: Verify if Polyglot widget appears
Verify the pages that you have added the script on to see if the Polyglot widget appears.
Step 4: Log in to Polyglot Studio
Log in to Polyglot Studio (opens in new tab) to start editing your translations.
