How to embed translate.google.com without iframe/object (X-Frame-Options is SAMEORIGIN)

Question

I am trying to embed the google translator page . I would like to have the same behaviour as the google translator website has, two boxes, and 'arrow' to change the languages, etc.

I have tried with an iframe or with HTML5 object tag, but google has the X-FRAME-OPTIONS="SAMEORIGIN" so it is forbidden to frame anything and the new browsers don't show it.

Another option would be to use google gadgets , but I have read that they are going to be deprecated and the google translate gadget doesn't have the same features as the web has.

The last option is to use the google translate API , but it is a paid service. Besides I am not going to send thousands texts to translate and saturate google, the users devices will access to google servers and translate something if they want, so I doesn't has sense to paid for it.

Do you have any idea what can I do?

Thanks in advance.

Answer 1

If you want, you could always opt for something like what I put on the Organique page.

It's a JavaScript widget that's similar to Google translate -- you just put it on each page.

<!-- GTranslate: http://gtranslate.net/ -->
<style type="text/css">
<!--
#goog-gt-tt {display:none !important;}
.goog-te-banner-frame {display:none !important;}
.goog-te-menu-value:hover {text-decoration: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;}
body {top:0 !important;}
-->
</style>
<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: ''}, 'google_translate_element');}
</script><script type="text/javascript" src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>