php word cloud translation

Question

I have created a word cloud and I'd like to add a translation function in my webpage. My word cloud shows like a lot of words with different color and font size. My system is like analysis a text and generate word cloud words and then echo them out.

I use the Google translate and the result is like this: You can see that, what I really want to be translated remain change nothing. How can I solve this problem.

Thank you

Answer 1

How about Google Translator for website ?

I am not sure about the accuracy level. But if you want to project your website in world's most of popular languages you could give a try to this. Google translator works with JS. For that you just need to add some JS code as below,

<div id="google_translate_element"></div>
<script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'en',
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE,
    autoDisplay: false,
    includedLanguages: 'en,af,sq,ar,hy,az,eu,be,bg,ca,zh-CN,zh-TW,hr,cs,da,nl,et,tl,fi,fr,gl,ka,de,el,ht,iw,hi,hu,is,id,ga,it,ja,ko,lv,lt,mk,ms,mt,no,fa,pl,pt,ro,ru,sr,sk,sl,es,sw,sv,th,tr,uk,ur,vi,cy,yi,'
  }, 'google_translate_element');
}
</script>
<script type="text/javascript" src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

Note: You can customize the languages by modifying "includedLanguages" (contains short forms).

Now when you use the above code Google will put a small header over your website and it looks ugly. That's why I made a simple CSS Hack to remove that header and make your website as it was. For that add the following css into your code ,

<style type='text/css'>
    #goog-gt-tt {display:none !important;}
    .goog-te-banner-frame {display:none !important;}
    .goog-te-gadget-icon {background-image:url(http://joomla-gtranslate.googlecode.com/svn/trunk/gt_logo_19x19.gif) !important;background-position:0 0 !important;}
    .goog-te-menu-value:hover {text-decoration:none !important;}
</style>

Hope it will help you.. :)