Cara Buat Widget Transralet Keren Abis

Sobat disini saya akan memberikan Triks buat Widget Transralet yang keren abis buat anda, sahabat blogger yang memang belum tau caranya. Widget Transralet Blogger berguna untuk bagi para pengunjung blog anda dari berbagai negara, agar bisa memahami pada setiap artikel dan menu halaman anda yang berbahasa indonesia. Mungkin anda sahabat Blogger membutuhkan widget ini agar memudahkan bagi para pengunjung blog anda. Sreenshot widgetnya sama percis seperti pada gambar dibawah ini :

Buat Widget Transralet Keren Pada Blog Blogger

Dan bila anda berminat ingin memiliki widget yang seperti pada gambar di atas, silahkan saja anda ikuti cara-caranya dibawah ini :

  • Login pada blog anda.
  • Masuk ke edite tempelate dan masukan scrift html dibawah ini di bawah kode </b:skin>
<style type='text/css'>
#translator-wrapper {
  display:block;
  width:200px;
  border:1px solid #055;
  background-color:#eee;
  overflow:hidden;
  position:relative;
}
#translator-wrapper select {
  border:none;
  background:transparent;
  font:normal normal 11px Tahoma,Verdana,Arial,Sans-Serif;
  width:100%;
  color:#055;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  -webkit-appearance:none;
  cursor:pointer;
  padding:5px 10px;
  border-radius: 9px;
  box-shadow: 1px 1px 5px #eee;
}
#translator-wrapper a,
#translator-wrapper a:hover {
  display:block;
  background-color:#055;
  border:none;
  color:white;
  margin:0 0;
  text-decoration:none;
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  cursor:pointer;
  width:30px;
}
#translator-wrapper a:before {
  content:&quot;&quot;;
  display:block;
  width:0;
  height:0;
  border:5px solid transparent;
  border-left-color:white;
  position:absolute;
  top:50%;
  left:13px;
  margin-top:-5px;
}
#translator-wrapper a:hover {background-color:#0A2C0A}
#translator-wrapper a:active {background-color:#082408}
#translator-wrapper select:focus,
#translator-wrapper a:focus,
#translator-wrapper select:active,
#translator-wrapper a:active {
  border:none;
  outline:none;
  cursor:pointer;
}
</style>

  • Setelah anda masukan scrift di atas, kemudia save atau simpan.
  • Lalu anda kembali ke Tataletak Widget.
  • Kemudian anda tambahkan widget dan pilih HTML/JavaScrift, dan masukan scrift HTML dibawah ini (atur letaknya sesuai keinginan anda).
<div id="translator-wrapper">
    <select id="translate-language">
        <option value="en" selected />English
        <option value="id" />Indonesian
        <option value="af" />Afrikaans
        <option value="sq" />Albanian
        <option value="ar" />Arabic
        <option value="hy" />Armenian
        <option value="az" />Azerbaijani
        <option value="eu" />Basque
        <option value="be" />Belarusian
        <option value="bn" />Bengali
        <option value="bg" />Bulgarian
        <option value="ca" />Catalan
        <option value="zh-CN" />Chinese
        <option value="hr" />Croatian
        <option value="cs" />Czech
        <option value="da" />Danish
        <option value="nl" />Dutch
        <option value="en" />English
        <option value="eo" />Esperanto
        <option value="et" />Estonian
        <option value="tl" />Filipino
        <option value="fi" />Finnish
        <option value="fr" />French
        <option value="gl" />Galician
        <option value="ka" />Georgian
        <option value="de" />German
        <option value="el" />Greek
        <option value="gu" />Gujarati
        <option value="ht" />Haitian Creole
        <option value="iw" />Hebrew
        <option value="hi" />Hindi
        <option value="hu" />Hungarian
        <option value="is" />Icelandic
        <option value="id" />Indonesian
        <option value="ga" />Irish
        <option value="it" />Italian
        <option value="ja" />Japanese
        <option value="kn" />Kannada
        <option value="ko" />Korean
        <option value="la" />Latin
        <option value="lv" />Latvian
        <option value="lt" />Lithuanian
        <option value="mk" />Macedonian
        <option value="ms" />Malay
        <option value="mt" />Maltese
        <option value="no" />Norwegian
        <option value="fa" />Persian
        <option value="pl" />Polish
        <option value="pt" />Portuguese
        <option value="ro" />Romanian
        <option value="ru" />Russian
        <option value="sr" />Serbian
        <option value="sk" />Slovak
        <option value="sl" />Slovenian
        <option value="es" />Spanish
        <option value="sw" />Swahili
        <option value="sv" />Swedish
        <option value="ta" />Tamil
        <option value="te" />Telugu
        <option value="th" />Thai
        <option value="tr" />Turkish
        <option value="uk" />Ukrainian
        <option value="ur" />Urdu
        <option value="vi" />Vietnamese
        <option value="cy" />Welsh
        <option value="yi" />Yiddish
    </select><a id="translate-me" href="http://translate.google.com/translate?u='+' data.blogURL'+'&langpair=id%7Cen&hl=en" title="Translate!"></a>
</div>

  • Setelah anda masukan scrift HTML di atas, kemudian anda klik save atau simpan saja.
  • Dan lihat hasilnya sobat.
Bagaimana hasilnya?, keren bukan?, bila anda tidak suka dengan warnanya tinggal anda ubah saja warnanya. Atau bila anda yang bingung cara mengubah warnanya tinggal tulis saja di komentar, nanti saja jelaskan biar gampang gimana caranya.
Perhatian Copas !!! "Mohon bagi anda para sahabat blog, jangan sekali-kali copy paste dengan tanpa mencantumkan link sumber kami dan menulis tanpa anda tulis dalam narasi atau kalimat anda sendiri saya akan mengapus url anda sesuai kebijakan privasi google DMCA/DMCA.com. Atas perhatiannya, saya ucapkan terimakasih."
Next
Previous

1 comment

aturan berkomentar pada blog ini !.
1. berkomentarlah dengan baik, sesuai konten yang dibahas dan berkualitas.
2. kalimat yang tidak berkenan saya akan hapus.
3. jika menaruh "LINK HIDUP" akan dimasukan ke folder spam.
4. dilarang mempromosikan produk melalui komentar.

Emoticon