URL Setup

Example: https://example.com/?lang=de

• Simplest to implement
• No server configuration required
• Less ideal for SEO
• Works out of the box with anything
• Easy to switch between languages client-side

​

Implementation

No extra setup is needed for query parameter routing. It works out of the box with most web frameworks and is automatically implemented client-side by Locadapt.

Example: https://example.com/de/

• Fair balance of SEO and ease of implementation
• Requires configuration on either server-side or client-side
• Better for SEO than query parameters
• Cleaner URL structure

​

Implementation

The implementation approach depends on your tech stack. You’ll typically need to choose either server-side or client-side configuration, not both.

const express = require('express');
const app = express();

const supportedLanguages = ['de', 'fr', 'es', 'ja', 'zh-CN', 'hi', 'he', 'ar'];

app.use((req, res, next) => {
  const langPath = req.path.split('/')[1];
  if (supportedLanguages.includes(langPath)) {
    req.language = langPath;
  }
  next();
});

const express = require('express');
const app = express();

const supportedLanguages = ['de', 'fr', 'es', 'ja', 'zh-CN', 'hi', 'he', 'ar'];

app.use((req, res, next) => {
  const langPath = req.path.split('/')[1];
  if (supportedLanguages.includes(langPath)) {
    req.language = langPath;
  }
  next();
});

import { type NextRequest, NextResponse } from 'next/server';

const supportedLanguages = new Set(['de', 'fr', 'es', 'ja', 'zh-CN', 'hi', 'he', 'ar']);

export async function middleware(request: NextRequest) {
  const pathname = request.nextUrl.pathname;
  const pathnameIsMissingLocale = supportedLanguages.every(
    (lang) => !pathname.startsWith(`/${lang}/`) && pathname !== `/${lang}`
  );

  if (pathnameIsMissingLocale) {
    const locale = 'en'; // Default language
    return NextResponse.redirect(new URL(`/${locale}${pathname}`, request.url));
  }
}

export const config = {
  matcher: ['/((?!api|_next/static|_next/image|favicon.ico).*)'],
};

Choose the approach that best fits your application architecture. If you’re using a full-stack framework, you might need to configure both server and client sides - refer to your framework’s internationalization guide, our site-specific integration guides on the sidebar, or contact support for specific instructions.

Example: https://de.example.com

• Best for SEO — guaranteed indexing by search engines
• Requires DNS configuration
• Slightly more complex setup
• Cleaner URL structure
• Can be perceived as separate sites by search engines

​

Setup Steps:

1. Configure your DNS: Add a CNAME record pointing your wildcard subdomain, *.example.com, to our reverse proxy at proxy.locadapt.com:

   *.example.com  CNAME  proxy.locadapt.com
   

   In case the above sounds unfamiliar — your DNS is your website’s current registrar (usually but not always where you bought it, e.g. GoDaddy, Namecheap, Wordpress, etc.). If you Google “add CNAME record <my DNS provider>”, you’ll find detailed instructions for how to do so. There’s typically an intuitive admin dashboard for your domain where you can add this in just a few clicks.

2. Update your Allowed Domains in the Locadapt config page, adding in *.yoursite.com

   ..., *.example.com, ...
   

   Or if you want to be more specific:

   ..., de.example.com, zh-CN.example.com, ...
   

   The subdomains here will be ISO language codes.

   With subdomains, only one primary domain is allowed per project. (i.e. you can list app.locadapt.com, locadapt.com, fr.locadapt.com as allowed domains as they all point to the same domain, but not e.g. mysite.com and *.myothersite.com.)

   Create separate projects if you want Locadapt to run on multiple primary domains (best practice is to do this anyway).

3. Wait a couple minutes for DNS changes to propagate, then visit your site at (e.g.) https://de.example.com!

   For SEO to work optimally, the translated page must be first visited by a real user before Google’s bot crawls it. This ensures the content is properly generated and stored on our servers.

   We choose to do this, instead of translating the content on the server if it’s not in our servers, as this leads to a much faster page load for your end users. Either way, the content will be translated client-side for the end user as well.