Skip to
Introduction
Adding a "Translate" button to your website is a great way to cater to the global online audience.
Using the handy TranslateThis service, you can add a button to your site-wide template in just seconds - enabling visitors to translate your pages into over 50 different languages.
Note: In this article, we'll be adding the button to our site-wide template, however if you'd like to limit the pages the button is rendered on, you can simply include the code in the desired module layout (eg. your Blog Post Details layout).
Step 1 - Select Template
Navigate to Admin > Manage Site-Wide Templates and select the template you'd like to add the translate button to. For this example, we'll just choose our default "Main Template".
Step 2 - Insert HTML / Javascript
Switch over to the HTML mode of the online editor and insert the following code where you'd like the button rendered:
<!-- Begin TranslateThis Button -->
<div id="translate-this"><a href="http://translateth.is/" class="translate-this-button">Translate</a></div>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://x.translateth.is/translate-this.js"></script>
<script type="text/javascript">
TranslateThis();
</script>
<!-- End TranslateThis Button -->
Step 3 - Save and Publish
Click "Save and Publish" to save your changes.
Switching over to the front end of your site, you should now see the "Translate" button rendered on all of your pages that use the template we just edited.
Naturally, you can customize the look and feel of the button using CSS / JavaScript. For more details on advanced customization options, refer to the TranslateThis documentation page at: http://translateth.is/docs
1
Reply
AdChoices