Memasang Widget Google Translate

Memasang Widget Google Translate - Membuat translate dalam web\blog sangat penting apalagi untuk pengunjung dari luar negeri yang ingin membaca artikel kita dalm koneten bahasa indenesia,banyak pilihan dalam pembuatan tranlate google baik dalam bentuk dropdown atau dalam bentuk gambar bendera negara masing-masing,

Dalam widget bawaan google translateada 3 varian dari menu vertikal,horizontal dan simple atau hanya dropdown. Untuk menambahkan anda masuk blogger anda > Tata Letak > Kemudian klik pada Tambahkan Gadget > Translate, disitu ada 3 pilihan seperti yang sudah dijelaskan sebelumnya pilih salah satu yang menurut anda bagus,silahkan coba satu-satu terlebih dahulu.
web google translate
Widget Web Google Translate Blogger
Dari cara diatas ada pilihan lain untuk membuat widget google translate yang menarik dan tentuunya dengan gaya berbeda, untuk caranya sama seperti diatas hanya saja anda setelah menambahkan gadget silahkan anda pilih tambahkan HTML/Javascript > Masukan kode berikut pada kolom Konten dan pada kolom title anda bisa isi dengan "Translate" atau bisa dikosongkan saja.
<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:#27ae60;
  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="id" selected="selected">Indonesian</option>
        <option value="en">English</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 : bahasa website anda
        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>

Silahkan atur lebar, warna dan lainya sesuai selera anda, Semoga bermanfaat Memasang Widget Web Google Translate.
resource: http://arlinadesign.blogspot.com/2014/10/memasang-widget-google-translate.html

8 Responses to Memasang Widget Google Translate

  1. Kalo taruh di menu bar gimana caranya? saya pernah liat tapi lupa dan belum sempat sedot ilmunya...

    Salam dari Pulau Dollar

    ReplyDelete
    Replies
    1. bisa mas,, pada menu HTML gunakan kode ini <a expr:href='&quot;http://translate.google.com/translate?u=&quot; + data:blog.url + &quot;&amp;amp;langpair=id%7Cen&amp;amp;hl=en&quot;' rel='nofollow' target='_blank' title='English'>Translate &amp;#9658;</a>

      semoga membantu :)

      Delete
  2. kapan2 bisa saya coba untuk membantu pengunjung blog dari mancanegara, terimakasih sharenya

    ReplyDelete
  3. terimakasih banyak mas, artikelnya sangat menarik...

    http://obattraditional.com/

    ReplyDelete
  4. Dicaba berhasil gan tapi ko lama banget ya translatenya. Masuk ke safe mode

    ReplyDelete

Note:
► Silahkan Berkomentar Sesuai Tema.✔
► No LINK. SPAM & PROMOSI ✘
► Segala Komentar Yang Masuk tidak Saya Moderasi ✔
► Dilarang Promosi (kecuali Ijin Admin ) ✔
► Link Hidup = Hapus.✔