Tutorial : Make Your Website Multilingual with a Proxy Server

By Brian McConnell
May 7, 2010

Building a multilingual site is often a difficult and expensive task, not because there is anything especially difficult about hiring translators, but because web publishing and application development tools tend to treat translation as an after thought. However, there is a cheap and easy way to do this, using a translation proxy server.

The Worldwide Lexicon, an open source translation platform which I developed, has released just such a beast. With it, turning a monolingual website into a polyglot website is as simple as making a few DNS entries. It's easy to demo, and you can grab the PHP source code to host your own.

Here's all you need to do:

  • Create a domain, such as fr.yoursite.com
  • Map it to 72.51.37.41 (this is a test server, which you're welcome to use for testing)
  • Go to fr.yoursite.com and your site is in French (pretty easy, oui?)

The proxy server simply loads a page and inserts the best available translations into the page. While it typically uses machine translation as a placeholder (we support Google Translate, Apertium and several other engines), it also allows users to edit translations via an inline editor, and it can call out to SpeakLike to request professional translations. SpeakLike has a mechanical turk style translation service that makes the whole process automatic.

You control the proxy server by embedding meta tags in your page header, or using div elements within a page, for example, to lock a section of a page so it cannot be edited. You can enable and disable machine translation, allow or deny various types of user translations, and can even control it at the paragraph level. You can do this on a static basis by editing your site template, or you can control this dynamically by inserting tags as needed upstream.

Page Level Controls

You can control the system behavior at the page level simply by inserting the following meta tags in the page header, in the form

  • allow_machine : y/n
  • allow_anonymous : y/n
  • allow_edit : y/n
  • require_professional :y/n
  • languages : string, comma-separated list
  • machine_translation_languages : string, comma-separated list
  • community_translation_languages : string, comma-separated list
  • professional_translation_languages : string, comma-separated list

Examples

<meta name="languages" content="es, fr, br, ar, de" /> <meta name="allow_edit" content="n" />

Text Level Controls

You can fine-tune whether a give section of the page can be translated / edited using CSS:

Usage: <{tag} class="{setting}"> allow_edit
disallow_edit

Examples:

<div class="header disallow_edit"> . . . . </div> <p id="callout" class="highlight allow_edit"> . . . . </div>

Language Switcher

Then, to insert a language switcher in your page (you can also link to __.yoursite.com where __ is an ISO language code), just insert the following comment:

<!-- wwl_language_selector -->

Source Code

The proxy server works pretty nicely "out of the box", but you can also grab the PHP source code and customize it as needed, for example, to control who can edit translations by querying your existing user database, or to deal with site specific layout issues, scripts, etc.

We also offer several other translation addons, including Word Press and Drupal addons, a social translation addon for Firefox, and TransKit, a family of libraries for popular programming languages that make embedding best effort translation in websites and apps simple and fairly idiot proof. We'll be releasing several more modules, and will also be following up on the initial release of the proxy server with some more features soon.


You might also be interested in:

News Topics

Recommended for You

Got a Question?