multilingual sites made fast

[JeremyBASS]

Here is a trick I use a lot.. Mostly cause I don't speak or write in any other language  but my own.. Now this is a simple example for a simple need.. I have to translate on toggle from English to Spanish for this page

in your head:  (or better yet at the bottom above the )

Code: Select all

<__script__ type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></__script>
<__script__ type="text/javascript" src="http://www.google.com/jsapi"></__script> 

in your js file below the call to the google jsapi file.

Code: Select all

google.load("language", "1"); 
var currentTrans='en';
$(document).ready(function(){ 
	$('#link1').toggle(function(){ 
		$("p,a,span").each(function(){ 
			var element = $(this); 
			google.language.translate($(this).html(), ''+currentTrans+'', 'es', function(result){ 
				$(element).html(result.translation); 
			});
		});
		currentTrans='es';
		$(this).html('English'); 
	}, function(){ 
		$("p,a,span").each(function(){ 
			var element = $(this); 
			google.language.translate($(this).html(), ''+currentTrans+'', 'en', function(result){ 
				$(element).html(result.translation); 
			});
		});
		currentTrans='en';
		$(this).html('En Espanol'); 
	}); 
});

And the last thing.. somewhere in your file place a


En Espanol

or what have you as long at the id's line up.. That's it.. real simple.. you can expand on it alot and I use a much more soup’ed up version of this where I use more of the api.  But you get the idea.. Try it out..

Cheers -Jeremy


Note you should read Google AJAX Language API.  In particular.. Branding and Google Attribution and what not..

[JeremyBASS]

I already got the "what about from page to page.. " here is how.. Note I used the $.cookie plugin for jquery, and like your suppose to, includes the google branding..

Code: Select all

<div id='langBox'>
<a name='en' class='translateTo'>English</a>
<a name='es' class='translateTo'>En Espanol</a>
</div>

Code: Select all

google.load("language", "1"); 
var currentTrans='en';
var orginalTrans='en';

var COOKIE_NAME = 'ur_lang';
var ADDITIONAL_COOKIE_NAME = 'additional';
var options = {expires: 7, path: '/'};


$(document).ready(function(){ 
	$('#langBox').append(google.language.getBranding('test1'));
	if($.cookie(COOKIE_NAME)&&orginalTrans!=$.cookie(COOKIE_NAME)){
		$("p,span,a,h4,h6,h5,h3,h2").not('.countdown-box span').each(function(){ 
			var element = $(this);
			var transTo=$.cookie(COOKIE_NAME); 
			google.language.translate($(this).html(), ''+currentTrans+'',''+transTo+'', function(result){ 
				$(element).html(result.translation); 
			});
		});
		currentTrans=$.cookie(COOKIE_NAME);
	}else if(orginalTrans==$.cookie(COOKIE_NAME)){
		$.cookie(COOKIE_NAME, null, options);
	}
	$('.translateTo').click(function(){ 
		var transTo=$(this).attr('name'); 
		$("p,span,a,h4,h6,h5,h3,h2").not('.countdown-box span').each(function(){ 
			var element = $(this); 
			google.language.translate($(this).html(), ''+currentTrans+'', ''+transTo+'', function(result){ 
				$(element).html(result.translation); 
			});
		});
		currentTrans=transTo;
		$.cookie(COOKIE_NAME, currentTrans, options );
	}); 
	

});

enjoy.. Cheers -Jeremy

[JeremyBASS]

Oh.. here is a live example of the code below..

http://www.steelheadderby.com

the translate is down at the bottom menu..

[nicmare]

interesting script. thank you!