Cara Buat Widget Transralet Keren Abis di Blog


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.

Widget Translate Keren di Blog

Mungkin anda sahabat Blogger membutuhkan widget ini agar memudahkan bagi para pengunjung blog anda. Untuk masalah tampilannya, silahkan dicoba terlebih dahulu pada blog anda. Bila ada yang kurang dimengerti, mohon tanyakan saja pada komentar.

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

Membuat Widget Translate Blog Keren

  • 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 Widget Translate Blog-nya?, 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.


1 comment:

Sebelum menuliskan komentar, Anda harus baca syarat dibawah ini :
1. Tidak diperbolehkan menaruh link aktif,
2. Tidak boleh ada unsur huru hara dan pornograpi,
3. Jika membuat spam, komentar Anda akan dihapus, dan
4. Silahkan bertanya dan berbagi pikiran dengan kalimat yang baik dan membangun.

AK NEW SITE. Powered by Blogger.