Add 5 Languages to Your SaaS with One Script Tag

Introduction

International growth is a top priority for B2B SaaS companies. Adding multilingual support not only widens your addressable market but also improves SEO, because search engines index each language version separately. SiteLocaleAI makes this painless: a single script tag can power translation, price localization, and SEO‑friendly pre‑rendering for any framework.

Step‑by‑Step Implementation

1. Include the library

Add the CDN script to the <head> of your main HTML template. No build step, no Node.js, just plain HTML.

<script src="https://cdn.sitelocaleai.com/v1/locale.js"></script>

2. Initialise the locale manager

Right after the script tag, configure the languages you want to support. The example below adds English, Spanish, French, German and Japanese. Replace YOUR_LLM_API_KEY with the key for the LLM you prefer (Claude, GPT‑4o‑mini, etc.).

<script>
  Locale.init({
    languages: ['en', 'es', 'fr', 'de', 'ja'],
    defaultLang: 'en',
    llmApiKey: 'YOUR_LLM_API_KEY',
    priceRounding: true,          // psychological rounding per currency
    seoPreRender: true            // generate static HTML for crawlers
  });
</script>

3. Mark translatable elements

SiteLocaleAI scans the DOM for data-locale-key attributes. Add them to any text that should be translated, e.g.:

<h1 data-locale-key="hero.title">Powerful analytics for your team</h1>
<p data-locale-key="hero.subtitle">Turn data into decisions in seconds.</p>

If you use a templating engine (React, Vue, Blade, etc.) you can generate the attributes dynamically. The library works the same way because it runs entirely in the browser.

4. Localise prices

Wrap price values in a <span> with data-price and the ISO currency code. SiteLocaleAI will fetch the latest exchange rate, apply psychological rounding (e.g., $9.99 → $9.95) and replace the text.

<span data-price="USD">49.99</span>

The output for a Japanese visitor becomes ¥5,500 (rounded to a clean figure) while a German visitor sees €45,00.

5. SEO pre‑rendering (optional but recommended)

Run the CLI on your build server to generate static, translated snapshots. The command crawls your site, renders each language, and writes the HTML to the dist/locale/ folder.

npx locale-cli prerender --output ./dist/locale --langs en,es,fr,de,ja

Deploy the generated folder alongside your normal assets. Search engines will request /es/about.html and receive a fully translated page, boosting organic traffic.

6. WordPress integration (if you run a blog)

If your SaaS site includes a WordPress blog, install the SiteLocaleAI plugin. It adds the same script automatically and creates a settings page where you paste your LLM API key. No Node.js is required on the server.

Testing & Validation

1. Language switcher – Add a simple dropdown that calls Locale.setLang('es') etc. Verify that text, dates, and prices update instantly.
2. Crawler test – Use Google Search Console’s URL Inspection tool on a pre‑rendered URL (/de/pricing.html). The rendered HTML should contain the translated strings, not just placeholders.
3. Performance audit – Because the translation happens client‑side after the initial load, the first‑paint time remains comparable to a monolingual site. The SEO pre‑rendered pages add virtually zero latency for bots.

Best Practices

• Cache LLM responses – Store translations in a CDN edge cache for 24 h to avoid hitting rate limits.
• Fallback language – Always keep English as a fallback in case the LLM service is unavailable.
• Currency rounding – Use the priceRounding flag to apply market‑specific rounding rules; it improves conversion rates.
• Analytics – Track localeChange events to understand which languages drive the most sign‑ups.

Conclusion

With SiteLocaleAI you can launch a fully localized B2B SaaS experience in minutes. A single script tag, a few configuration lines, and optional CLI pre‑rendering give you multilingual UI, price‑aware displays, and SEO‑ready pages without rewriting your front‑end.

Ready to go global? Try SiteLocaleAI today and add 5 languages with a single script tag.