Monday, November 9, 2009

Memasang Terjemahan Bahasa Ke Berbagai Negara (Google Language Translation) Beserta Ikon Benderanya (Flag Icon)

Agar Website atau Blog kita bisa diakses oleh seluruh penduduk dunia, maka alangkah baiknya jika kita pasang fasilitas terjemahan kedalam berbagai bahasa.

Apabila Anda menyangka bahwa Bahasa Inggrislah yang paling banyak digunakan... maka anda salah. Bahasa Inggris bukanlah bahasa yang paling populer di dunia. Bahkan, menurut banyak laporan, bahasa Cina-lah (Mandarin) yang paling banyak digunakan, tentu saja ini berkaitan dengan banyaknya jumlah penduduk selain juga tingkat kemajuan IT negara bersangkutan. Di komuniitas masyarakat internet, beberapa platform bahasa populer lainnya adalah Spanyol, Rusia, Arab, Portugis, Melayu (maksudnya termasuk Bahasa Indonesia), Italia, Perancis, Jepang, dan Korea.

Ada beberapa alat penterjemah on line populer yang cukup bagus dan gratis.. Misalnya Altavista Babel Fish's translator dan Google Language Translator. WorldLingo sekarang ini tidak lagi menjadi alat yang direkomendasikan sebagai website translator, karena memiliki batas terjemahan hanya 500 kata.

Untuk situs ini, saya menggunakan Google Language Translator. Google mampu menerjemahkan isi website ke dalam bahasa Inggris, Arab, Cina, Perancis, Jerman, Italia, Jepang, Korea, Portugis, Rusia, dan Spanyol.. Google Language Translator menggunakan JavaScript yang dapat diterapkan pada sebagian besar situs blog seperti Blogspot, TypePad dan Wordpress. Inti dari Alat ini adalah Script JS itu sendiri, jadi bagi Anda yang ingin menggunakannya, Copy script dibawah dan paste di bagian template di mana Anda ingin agar penterjemah bahasa Anda muncul nantinya.

Bagi Anda yang menggunakan Blogger, caranya sebagai berikut :

1. Silahkan Login ke Blogger Anda.
2. Pada Dashboard Anda, pilihlah (Click) Layout, lalu Click Page Elements.
3. Pada Halaman Page Elements tersebut buatlah sebuag Gadget baru dengan cara Click "Ad a Gadget" (di blog ini saya meletakkannya di sidebar paling atas).
4. Pada jendela "Ad aGadget" yang muncul kemudian, Pilihlah/Click HTML/JavaScript.
5. Pada jendela "Configure HTML/JavaScript", masukkan judul yang Anda inginkan pada kolom Title. misal : Google Language Translator.
6. Salin kode JavaScript di bawah ini dan masukkan di kolom content.
<form action="http://www.google.com/translate">

<script language="javascript" type="text/javascript">

<!--

document.write ("<input name=u value=" location.href " type=hidden>")

// -->

</script>

<noscript><input value="http://free-blogger-blog.blogspot.com/" name="u" type="hidden"/></noscript>

<input value="id" name="hl" type="hidden"/>

<input value="UTF8" name="ie" type="hidden"/>

<input value="" name="langpair" type="hidden"/>


<input onclick="this.form.langpair.value=this.value" title="Arabic" value="id|ar" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/358406/gse_multipart12399.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="&#20013;%u6587%uFF08%u7B80%u4F53%uFF09/Chinese (Simplified)" value="id|zh-CN" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/546049/gse_multipart12397.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="&#20013;%u6587%uFF08%u7E41%u4F53%uFF09/Chinese (Traditional)" value="id|zh-TW" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/208681/gse_multipart12398.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="Fran&#231;ais/French" value="id|fr" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/327620/gse_multipart12413.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="Deutsch/German" value="id|de" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/734899/gse_multipart12400.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="Italiano/Italian" value="id|it" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/306145/gse_multipart12401.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="&#26085;%u672C%u8A9E/Japanese" value="id|ja" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/443122/gse_multipart12402.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="&#54620;%uAD6D%uC5B4/Korean" value="id|ko" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/581031/gse_multipart12403.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="Portugu&#234;s/Portuguese" value="id|pt" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/670301/gse_multipart12404.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="&#1056;%u0443%u0441%u0441%u043A%u0438%u0439/Russian" value="id|ru" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/111692/gse_multipart12405.png" width="30" name="langpair"/>


<input onclick="this.form.langpair.value=this.value" title="Espa&#241;ol/Spanish" value="id|es" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/998398/gse_multipart12407.png" width="30" name="langpair"/>

</form>
7. Setelah selesai,, rubahlah alamat blog http://free-blogger-blog.blogspot.com ke alamat Anda. Kemudian tekan Save.       Selamat... Google Language Translator telah terpasang di Blog Anda.

Script code di atas, sudah Saya ubah sedikit karena aslinya Script tersebut dipasang untuk menterjemahkan atau di pasang pada blog berbahasa Inggris, sehingga pada saat pertama kali terpasang, Anda tidak akan menemukan terjemahan ke dalam bahasa Inggris. Tapi dengan sedikit modifikasi anda bisa menambahkannya.

Untuk menambahkan  terjemahan ke dalam bahasa lain, maka anda sebaiknya mempunyai Icon Flag negara yang bersangkutan untukdipasang. Baik Silahkan perhatikan Script yang Saya salin dari paragraf terakhir sebelum </form> di bawah ini, supaya lebih jelas Saya bikin Bold.

<input onclick="this.form.langpair.value=this.value" title="Espa&#241;ol/Spanish" value="id|es" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/998398/gse_multipart12407.png" width="30" name="langpair"/>
Salin dan tempatkan di bawah paragraf terakhir sebelum </form> 


Espa&#241;ol/Spanish ..... Script ini akan tampak saat kursor mouse kita berada di atas bendera
id|es                                        ..... Script ini berarti terjemahan dari indonesia ke espanol (spanyol).
20                                            ..... Ini ukuran tinggi dari ikon bendera.

30                                           . .... Ini ukuran lebar dari ikon bendera.
http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/998398/gse_multipart12407.png        .... Ini alamat gambar ikon bendera.

Jika ingin menambahkan penterjemah dalam bahasa inggris, maka  Espa&#241;ol/Spanish kita ganti dengan English/Amerika, id|es "harus" kita ganti dengan id|en en = english. dan http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/998398/gse_multipart12407.png  silahkan diganti dengan alamat gambar ikon bendera (Inggris/Amerika) yang telah anda siapkan. Apabila anda merasa gambar bendera terlalu besar/kecil, Anda bisa mengaturnya dengan mengubah-ubah nilai 20 dan 30 , terakhir jangan lupa untuk menyimpannya (Click Save)


Sehingga hasil akhirnya sbb:
<input onclick="this.form.langpair.value=this.value" title="Espa&#241;ol/Spanish" value="id|es" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/998398/gse_multipart12407.png" width="30" name="langpair"/>

<input onclick="this.form.langpair.value=this.value" title="English/English" value="id|en" type="image" height="20" src="http://photos1.blogger.com/x/blogger2/6075/564571464515337/1600/z/998398/gse_multipart12407.png" width="30" name="langpair"/>

</form>
Perhatikan...!!!, karena saat ini Saya belum memiliki ikon bendera Inggris atau Amerika, maka saya tidak merubah alamat gambar, sehingga pada gambar bendera akan terdapat 2 bendera Spanyol, yang terakhir mewakili Inggris atau Amrik...