Skip to main content

Translate my page with google translate

As we all know the world is getting multilingual,in our daily lives, specially on internet we find the things which are in another language and we need a way to translate it into the language we understand

As we all know about Google Translate is the place we all will go and paste the content that we want to translate,but what if we have power of that tool into our website or web page,yes it is possible with GOOGLE TRANSLATE (which is able to translate the page into more than 50 languages) to have that integrated into your own website,today we will see how with example



This tool is available from quite sometimes now,but the point is very less of the people from developer community are aware of this,so the reason behind this post is to show how any developer can make use of it and make it so simple to translate their pages...


The process...


The only need to have the power of translation on your website is copy and paste snippet of following code into your web page

<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>

Just put above snippet in your HTML mark up and run the page,you will get standard google translator logo as well as few options which we are interested in right now,see the image below




now you have the full control over language change,just select the language from available languages and see how google translate it for you

What if i do not want to translate some of the content???
Now question comes is what if there are certain portion which you do not want to translate and you want to keep it as it is,so that fix is also there,say there is copyright text or email address which you want to keep as it is,so you just have to add one CSS class to it and gogle will take care of it like following

Contact us at <span class="notranslate">daivagnas@gmail.com</span>

Now if you do not want to translate whole page so just add following

<meta name="google" value="notranslate"></meta>

I was quite amazed with the power which google provides,i hope you also do...i hope this post was useful


To see live demo just have a look at the gadget on this page at top-right-most corner
Labels:

Comments

  1. KamalAugust 31, 2010 at 3:29 AM

    Thanks buddy very useful information.
    Keep sharing such information.

    ReplyDelete
  2. Mitul NakumAugust 31, 2010 at 3:38 AM

    This comment has been removed by the author.

    ReplyDelete
  3. Daivagna NanavatiAugust 31, 2010 at 3:52 AM

    hi mitul

    i have also describe the same thing in my blog as well,that if you want to translate only part of the page you can also do it...you just have to put class="notranslate" and rest will be taken care,and yeah thxs for pointing the mistake out..i have fix it :)

    ReplyDelete
  4. Daivagna NanavatiAugust 31, 2010 at 3:56 AM

    Hi kamlesh

    thxs for the comments,i will be posting some useful posts in coming days,i think you will get notification as you are in my post mailling list...

    ReplyDelete
  5. TarjSeptember 1, 2010 at 2:11 AM

    Useful post and really nice, informative and useful blog for IT Departments.

    ReplyDelete
  6. AnonymousSeptember 28, 2010 at 11:57 AM

    Great job buddy..... I tried same code & implemented in first try.....
    Thanks a lot for this kind of post...Keep going...

    ReplyDelete
  7. AnonymousDecember 29, 2010 at 4:04 AM

    this shows the power of technology and the extent the web has gone these days.
    good post.

    ReplyDelete

Post a Comment

Popular posts from this blog

Why SitecoreAI - Getting into the shoes of the customer how to select right CMS

Hi Team, Lately, I have been talking to lot of our customers / potential customers and having pre-sales demos where one question always comes is "Why Sitecore" ?  Now this question can be for any product which is out for sell. And as a technician I always get into product technical features, but at the same time as a pre-sales guy, it also makes me think, surely all competitive products have same features, so definitely answer to this is not in the technicalities.  If you step back and think, we are also a customer in our daily life and buy lot of things, what is that process we go through? When we buy, how can your customer decide if this is a right fit for you or not, why we select A over B? Is it price? is it service? Is it a brand? Is it about features? Is it about brand loyalty?  When it is a technical product, I am sure it cannot start with the technicalities of the product or selecting product itself, 100% not, I feel decision is always business strategy first and ...
1 comment
Read more

Hell of sitecore aliases pipeline breaking the site with 500 error

Hello Friends, I belive this blog post is very important for everyone because, It has some very serious effect on working of your headless website, i will share my experience what we faced and how we resolved it Issue we started facing Our site started giving "Key cannot be null or empty" with YSOD like following  Side affect Because of this 500 error, Our site pages were showing 500 custom error page intermittently and our MAU (Monthly Active User) drop rate increased. Sitecore KB There is already Sitecore KB article talking about this error but the patch which is provided on this link is confusing as well as very huge and it could bring other issues along with it as that upgrade patch also has lot of other things too which i did not want to introduce in our stable CMS. Known Issues - Retrieving the child items of resource items is not thread-safe Observation Though the surfaced exception was looking similar and giving same error and behavior given on this article, We looked...
Post a Comment
Read more

Zero to Hero - A real life RCA of exact issue in Sitecore Managed Cloud environment

Hello All, The purpose of today's post is to share a real life burning and escalated scenario which was new to me and how did I approach it and how big the escalations were and what was the outcome Sitecore's goodwill was at stack not because Sitecore is not capable of handling it but just because our environment was Sitecore Managed Cloud, and any issue that comes if its infra, back end code, front end code will be first pointed as Sitecore issue and that is where our consultancy and experience will play a role to prove that it is not Sitecore issue.  Issue we faced Out of the blue our site started giving "504 Gateway Time-out", and it was reported that almost everyone is getting this error, but when we used to browse the site, everything looked good and never 504. 504 Gateway Time-out error tells that, That the request went to Content Delivery servers of Sitecore from gateway, but gateway did not get response in time from those CDs and hence it gave time out error. ...
3 comments
Read more