translate_logo

Google has provided web developers foreign language translation api. Web content translation is not a problem anymore, with google’s Google Translate, research from different countries is now made possible.

This is a big help especially for researchers on the net, we can now easily understand web contents and even text from outside sources which also serves as a document translation services. Google allows us to copy and paste phrases, sentences and paragraphs from outside sources to their google translate and by selecting the language you desire we can now get translation to it.

But how do we add google translate on our website? I have provided 3 different ways on how to achieve google translate on your website. The easiest is for wordpress users, you can add a web content translation by downloading the plugin Global Translator . Follow the steps carefully and you can provide your users translation of different languages according to your choice as set on the administration panel.

The second way of adding a web content translation software by google is by adding a snippet of codes which they have provided on their site Google Translate or just copy and paste the code below and add it on your website. This is also the code I used in this blog.

<div id=”google_translate_element”></div><script>

function googleTranslateElementInit() {

new google.translate.TranslateElement({

pageLanguage: ‘en’

}, ‘google_translate_element’);

}

</script><script src=”http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit”></script>

If you want to have your own design and style you can still add translation to your site below is an example of the code. Make sure you have images of the flags as what I used in the code.

<form action=”http://www.google.com/translate” >

<script language=”JavaScript”>

<!–

document.write (“<input name=u value=”+location.href+” type=hidden>”)

// –>

</script>

<table width=”185″ height=”100%” align=”right” style=”margin-right:5px;”>

<tr>

<td colspan=”5″ style=”background:#C9E2FF;color:#000099;padding:5px; border:1px solid #ACC5EF;”><span style=”font-size:10px; “><b>Click flag to change language</b></span></td>

</tr>

<tr>

<td align=”center”>

<input name=”hl” value=”en” type=”hidden”>

<input name=”ie” value=”UTF8″ type=”hidden”>

<input name=”langpair” value=”" type=”hidden”>

<input name=”langpair” value=”en|fr” title=”French” src= “images/flags/french.jpg” onClick=”this.form.langpair.value=this.value”  type=”image” /></td>

<td align=”center”><input name=”langpair” value=”en|ko” title=”Korean” src= “images/flags/korean.jpg” onClick=”this.form.langpair.value=this.value”  type=”image” /></td>

<td align=”center”><input name=”langpair” value=”en|da” title=”Danish” src= “images/flags/denmark.png” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

<td align=”center”><input name=”langpair” value=”en|cy” title=”Welsh” src= “images/flags/welsh.gif” onClick=”this.form.langpair.value=this.value”  type=”image” /></td>

<td align=”center”><input name=”langpair” value=”en|zh-CN” title=”Chinese Simplified” src= “images/flags/chinese.jpg” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

</tr>

<tr>

<td align=”center”><input name=”langpair” value=”en|de” title=”German” src= “images/flags/german.jpg” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

<td align=”center”><input name=”langpair” value=”en|it” title=”Italian” src= “images/flags/italian.jpg” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

<td align=”center”><input name=”langpair” value=”en|sl” title=”Slovenian” src= “images/flags/slovenian.jpg” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

<td align=”center”><input name=”langpair” value=”en|ru” title=”Russian” src= “images/flags/russia.jpg” onClick=”this.form.langpair.value=this.value”  type=”image” ></td>

<td align=”center”><input name=”langpair” value=”en|pt” title=”Portuguese” src= “images/flags/pt.jpg” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

</tr>

<tr>

<td align=”center”><input name=”langpair” value=”en|es” title=”Spanish” src= “images/flags/spanish.jpg” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

<td align=”center”><input name=”langpair” value=”en|ja” title=”Japanese” src= “images/flags/japanese.jpg” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

<td align=”center”>

<input name=”langpair” value=”en|cs” title=”Czech” src= “images/flags/czech.jpg” onClick=”this.form.langpair.value=this.value” type=”image” />

</td>

<td align=”center”><input name=”langpair2″ value=”en|no” title=”Norwegian” src= “images/flags/norwegian.jpg” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

<td align=”center”><input name=”langpair2″ value=”en|ar” title=”Arabic” src= “images/flags/arabic.gif” onClick=”this.form.langpair.value=this.value” type=”image” /></td>

</tr>

</table>

</form>

An example of the snippet can be found in this link.

Google Translate

Did find the post very useful? Maybe you want to buy me a glass of beer!