Cara Memasang Google Translate Pada Blog - Blogspot dengan Mudah

Cara Memasang Google Translate Pada Blog - Blogspot dengan Mudah

Assalamualaikum wr.wb.Selamat siang sobat semua .Semoga di siang kali ini urusan kita di mudahkan Alloh SWT .amin amin amin.Pada kesempatan kali ini saya akan berbagi tutorial cara memasang widget google translate dengan mudah . 

Google translate sendiri adalah salah satu widget yang di sediakan oleh google pada blogpsot untuk memudahkan penerjemahan pengunjung blog apabila ingin menerjemahkan bahasa pada blog tersebut. Google translate yang di sediakan google sendiri ada 3 gaya , pertama vertikal ,kedua horizontal dan yang ketiga hanya naik turun.

Dengan ,adanya fasilitas google translate ini tentunya sangat memudahkan para blogger dan internet marketer apabila ingin membidik visitor dari luar negeri . 

Berikut ini saya akan share tutorial memasang google translate. 

1.

Silahkan sobat masuk dashboard blog sobat masing masing . Kemudian pilih Menu Tata Letak
2.

Klik Tambahkan Gadget sesuai yang saya garis panah merah di atas.

3.

4. Setelah muncul macama macam widget sobat scroll saja ke bawah dan pilih langsung Terjemahan pada tombol + seperti di atas.

5. Silahkan sobat pilih gaya tampilan translate google seperti di atas sesuai kebutuhan , kalau saran saya pilihlah yang vertikal atau hanya naik turun ,karena berdasarkan pengalaman saya gaya horizontal lebih memakan ruang sehingga menjadikan tampilannya kurang bagus.
Untuk tampilan Vertikal kurang lebih seperti ini .

Untuk tampilan hanya naik turun kurang lebih seperti di bawah ini

Ada tutorial satu lagi sobat yang akan saya share kepada sobat semua .Dari mbak arlina . Founder dari website http://www.arlinadzgn.com
Caranya sangat mudah dan ini saya terapkan pada salah satu blog saya . 

Buka blogger sobat Klik > Tata Letak ,Kemudian Klik pada menu Tambahkan Gadget, Kemudian klik HTML/Java Script,Kemudian salin/copy code script di bawah ini di dalam nya kemudian Simpan .

<style type="text/css"> #translator-wrapper { display:block; width:90%; max-width:300px; border:none; background-color:#fff; color:#444; overflow:hidden; position:relative; height:40px; line-height:40px; border:1px solid #e0e0e0; } #translator-wrapper select { border:none; background:transparent; font-family:'Verdana',Arial,Sans-Serif; font-size:12px; width:100%; color:#444; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-appearance:none; cursor:text; padding:5px 10px; } #translator-wrapper a, #translator-wrapper a:hover { display:block; background-color:#4791d2; border:none; color:#fff; margin:0 0; text-decoration:none; position:absolute; top:0; right:0; bottom:0; cursor:pointer; width:14%; transition:all 0.3s ease; } #translator-wrapper a:before { content:""; display:block; width:0; height:0; border:6px solid transparent; border-left-color:white; position:absolute; top:50%; left:45%; margin-top:-5px; } #translator-wrapper a:hover {opacity:0.9;} #translator-wrapper a:active {opacity:0.9;} #translator-wrapper select:focus, #translator-wrapper a:focus, #translator-wrapper select:active, #translator-wrapper a:active { border:none; outline:none; cursor:pointer; } option { background:#444; color:#e0e0e0; } </style> <div id="translator-wrapper"> <select id="translate-language"> <option value="en" selected="selected">English</option> <option value="id">Indonesian</option> <option value="af">Afrikaans</option> <option value="sq">Albanian</option> <option value="ar">Arabic</option> <option value="hy">Armenian</option> <option value="az">Azerbaijani</option> <option value="eu">Basque</option> <option value="be">Belarusian</option> <option value="bn">Bengali</option> <option value="bg">Bulgarian</option> <option value="ca">Catalan</option> <option value="zh-CN">Chinese</option> <option value="hr">Croatian</option> <option value="cs">Czech</option> <option value="da">Danish</option> <option value="nl">Dutch</option> <option value="en">English</option> <option value="eo">Esperanto</option> <option value="et">Estonian</option> <option value="tl">Filipino</option> <option value="fi">Finnish</option> <option value="fr">French</option> <option value="gl">Galician</option> <option value="ka">Georgian</option> <option value="de">German</option> <option value="el">Greek</option> <option value="gu">Gujarati</option> <option value="ht">Haitian Creole</option> <option value="iw">Hebrew</option> <option value="hi">Hindi</option> <option value="hu">Hungarian</option> <option value="is">Icelandic</option> <option value="id">Indonesian</option> <option value="ga">Irish</option> <option value="it">Italian</option> <option value="ja">Japanese</option> <option value="kn">Kannada</option> <option value="ko">Korean</option> <option value="la">Latin</option> <option value="lv">Latvian</option> <option value="lt">Lithuanian</option> <option value="mk">Macedonian</option> <option value="ms">Malay</option> <option value="mt">Maltese</option> <option value="no">Norwegian</option> <option value="fa">Persian</option> <option value="pl">Polish</option> <option value="pt">Portuguese</option> <option value="ro">Romanian</option> <option value="ru">Russian</option> <option value="sr">Serbian</option> <option value="sk">Slovak</option> <option value="sl">Slovenian</option> <option value="es">Spanish</option> <option value="sw">Swahili</option> <option value="sv">Swedish</option> <option value="ta">Tamil</option> <option value="te">Telugu</option> <option value="th">Thai</option> <option value="tr">Turkish</option> <option value="uk">Ukrainian</option> <option value="ur">Urdu</option> <option value="vi">Vietnamese</option> <option value="cy">Welsh</option> <option value="yi">Yiddish</option> </select><a id="translate-me" href="#" title="Translate"></a> </div> <script type="text/javascript"> (function() { var mylang = "id", // Your website language anchor = document.getElementById('translate-me'); anchor.onclick = function() { window.open('http://translate.google.com/translate?u=' + encodeURIComponent(location.href) + '&langpair=' + mylang + '%7C' + document.getElementById('translate-language').value + '&hl=en'); return false; }; })(); </script>

Hasilnya kurang lebih akan seperti di bawah ini :

Kelebihannnya menurut saya adalah  jika kita ingin mentranslate dalam bahasa inggris , akan langsung muncul di paling atas ,berbeda dengan google translate bawaan blogspot yang untuk mencari traanlate bahasa inggris kita harus menscroll ke bawah . Biasanya ini menyulitkan visitor yang ingin menerjemahkan ke dalam bahasa inggris atau bahasa lainnya.
Demikian tutorial yang bisa saya buat semoga bermanfaat untuk teman teman semua.