Frequently Asked Questions

Here are some common questions about the TranslateThis Button:

Functionality Questions

Language / Internationalization Questions

Display Questions


Functionality Questions


How can I undo translation?

At any time the user can stop the automatic translation either by clicking the "cancel" link during the translation or the "undo" link after the translation completes.

You can change the amount of time that the undo link appears, and even make it appear permanently - See here.

Additionally if the page is translated back into the original language, the automatic translation will stop (provided that the fromLang option is set - See here).

You can also disable the automatic translation altogether, see here.


Why does the script automatically translate pages?

Once a user translates a page on your site, any of the other pages they visit on your site will be automatically translated. This allows the script to translate your entire site, and won't effect other visitors.

If you would prefer not to use the automatic translation functionality at all, you can disable it. See here for more details


Why won't the button appear on my site?

First make sure you've included the embed code correctly. If you've included any custom options, make sure they're done according to these guidelines.

Otherwise there is probably an issue with the onload event. The TranslateThis Button has to wait for the entire page to load before initiating, so if the page doesn't load completely, the button never appears.

So first make sure that there isn't another script or content on the page that is timing out and thus preventing the page from loading completely.

Otherwise another script on the page might be hijacking the "onload" event. Try moving the script part of the widget embed code to the very end of your document...the widget will accommodate any onload events that occur previously on the page.


How do I enable Google Analytics tracking?

To enable Google Analytics tracking, pass the option GA set to true:

<!-- Begin TranslateThis Button -->

<div id="translate-this"><a href="http://www.translatecompany.com/"
class="translate-this-button">Translation Company</a></div>

<script type="text/javascript"
src="http://x.translateth.is/translate-this.js"></script>
<script type="text/javascript">
TranslateThis({
  GA : true
});
</script>

<!-- End TranslateThis Button -->

Then the TranslateThis Button will handle the rest, tracking each language translation as a pageview such as 'TranslateThis-es' for Spanish. See list of language slugs.

Note – If you're using the Wordpress Plugin, this option can be set from the settings page


How do I prevent translation on certain sections of my web page?

If you want to disable translation on a certain section of your page, simple add class="notranslate" to any HTML element to prevent it from being translated.

You can also restrict the scope to translate a specific portion of your web page. Then use the class="notranslate" method to prevent translation on elements within this scope element (which defaults to the entire page).


How do I disable automatic translation?

When a user chooses a language, a cookie is set so that the TranslateThis Button can translate other pages on your site automatically. If you want to disable this, set cookie to false :

<script type="text/javascript">
TranslateThis({
  cookie : false
});
</script>

Note – If you're using the Wordpress Plugin, this option can be set from the settings page


How is the TranslateThis Button different from Google Translate?

The TranslateThis Button leverages the Google Language API so the translation it provides is the same as Google Translate. However it provides a number of advantages over Google Translate's widget.

First Google Translate's widget is an ugly dropdown of languages, while the TranslateThis Button provides a nice user interface to access the languages.

But more importantly, the TranslateThis Button doesn't redirect users to translate.google.com, meaning that it allows you to retain the users on your site, along with any linkbacks, tracking data, etc.

Finally the scripts processes the translation with a number of parallel JavaScript calls, meaning that for most websites the translation is faster than Google Translate.


Language / Internationalization Questions


How do I change the languages in the dropdown?

You can set the languages in the dropdown passing the Google language codes as an array to the ddLangs option. For instance, let's take out Czech and add English at the top of the list:

<script type="text/javascript">
TranslateThis({
  ddLangs : [
    'en',
    'fr',
    'es',
    'ar',
    'zh-CN',
    'ko',
    'it',
    'iw',
    'de',
    'pt-PT',
    'ru',
    'ja',
    'vi',
    'el',
    'hi',
    'tr'
  ]
});
</script>

Note – If you're using the Wordpress Plugin, this option can be set from the settings page


Can I change the text to match my language?

Yes, you set a number of text options for the TranslateThis Button:

<script type="text/javascript">
TranslateThis({
  panelText : 'Translate Into:',
  moreText : '36 More Languages »',
  busyText : 'Translating page...',
  cancelText : 'cancel',
  doneText : 'This page translated by the',
  undoText : 'Undo »'
});
</script>

Note – If you're using the Wordpress Plugin, this option can be set from the settings page


Display Questions


How do I center the button?

You can center the button by adding this CSS to your page:

<style type="text/css">
#translate-this {
    text-align: center;
}

#translate-this .translate-this-button {
    float: none !important;
    margin: 0 auto;
}
</style>

How do I change the button image?

There are a couple ways to change the button image.

1. Easiest is to style the button with CSS using !important:

<style type="text/css">
#translate-this .translate-this-button {
   background-image: url(my-image-path.jpg) !important;
   width: 250px !important;
   height: 50px !important;
}
</style>

2. Or use an image inside the link and disable the button styling:

<!-- Begin TranslateThis Button -->

<div id="translate-this"><a href="http://www.translatecompany.com/"
class="translate-this-button"><img src="my-image-path.jpg" alt=""
style="border: 0" /></a></div>

<script type="text/javascript"
src="http://x.translateth.is/translate-this.js"></script>
<script type="text/javascript">
TranslateThis({
  noBtn : true
});
</script>

<!-- End TranslateThis Button -->

3. And finally the best way is to set it all with JavaScript:

<script type="text/javascript">
TranslateThis({
  btnImg : 'my-image-path.jpg',
  btnHeight : 50,
  btnWidth : 250
});
</script>

Note – If you're using the Wordpress Plugin, this option can be set from the settings page


How do I change the link color? / The link text isn't showing up on my site

The TranslateThis Button uses the default <a> styling to incorporate a bit of your site's look & feel. Unfortunately this causes an issue on sites that use white or another light color for their main <a> styling.

To get around this, attach this CSS anywhere in your site:

<style type="text/css">
div.ttb-panel a, div.ttb-translating a, div.ttb-undo a {
  color: #555;
}
</style>

You can change the color value to whatever you need.

If this doesn't fix the problem on your site, you may have to add more specific styling. Try adding an !important:

<style type="text/css">
div.ttb-panel a, div.ttb-translating a, div.ttb-undo a {
  color: #555 !important;
}
</style>