[Force.comでWeb制作]Google翻訳で特定の項目を多言語翻訳

By |4月 21, 2010|Force.comでWeb制作, Javascript, |


Googleが公開しているGoogle AJAX Language APIをつかえば、Webページ内の特定領域をAJAX処理で多言語翻訳することができます。サポートされている言語はかなりの数で、大抵の翻訳は対応できそうです。

このGoogle翻訳を使って、Salesforceの標準画面上で特定の項目を翻訳する処理を書いてみましょう。

参考:ゼロからはじめるGoogle AJAX Language API(翻訳API) – APIで翻訳してみる

ケースオブジェクトの「Description」項目を、「UserLanguage」の言語に翻訳する例
コントローラ

[php]
public class translationClass {

public translationClass(ApexPages.StandardController controller) {

}

public string getUsersLanguage(){
String userlang = UserInfo.getLanguage();
userlang = userlang.substring(0,2);
return userlang;
}

}
[/php]

Visualforceページ

[php]
<apex:page standardController="Case" extensions="translationClass"
<strong>standardStylesheets</strong>="true" >
<style>
body {
background-color:#F3F3EC;
color:#333333;
font-size:12px;
}
</style>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
//翻訳ライブラリ読み込み
google.load("language", "1");

function initialize() {
//Description項目をUsersLanguage言語に翻訳処理
google.language.translate(document.getElementById("Description").innerHTML.replace(/<br>/g, " ") , "", "{!UsersLanguage}", function(result) {
if (!result.error) {
//翻訳ができたら、translatedTextとして表示
var container = document.getElementById("translatedText");
container.innerHTML = result.translation;
}
}
);
}
google.setOnLoadCallback(initialize);
</script>
<table>
<tr>
<td style="font-size:91%;" align="right" width="135">
<b>Translated Text</b>
</td>
<td style="padding-left:18px;">
<div id="translatedText"></div>
</td>
</tr>
</table>
<div id="Description" style="display:none;">{!case.Description}</div>
</apex:page>
[/php]

こんな感じのVisualforceページを作って、インラインVisualforceページとしてケースレイアウトの項目として表示。すると以下のように、
ws000198
Description項目が英→日で翻訳されて表示されます。他の言語でも応用できるので、グローバル企業用に簡易な翻訳実装などで便利です。