Karya-Reza

Mengerti Kebutuhan Pengunjung

Select Menu
  • Home
  • Seputar Dunia Blogging
  • Template Untuk Blog
  • Widget Blog
  • Dan Lainnya
    • Tukar Link !
    • Daftar Banner Yang Sudah Tukar Link
  • Error Page
Home » Widget Blogging » Membuat Widget Translator Halaman

Thursday, July 31, 2014

Membuat Widget Translator Halaman

Reza Syahputra Rizal
12 Comments
Widget Blogging
Thursday, July 31, 2014

Membuat Widget Translator Halaman - Membuat Widget Translator mungkin ini sangat
Banyak dilakukan oleh bloggger , Karena mereka takut bahwa Pengunjung yang tidak
Mengerti bahasa dari artikel mereka dan mereka meninggalkan blog tersebut karena tidak
mengerti bahasa yang penulis bawakan di artikel tersebut , Mungkin jika anda tidak ingin
Menaruh widget translator di Sidebar mungkin widget ini bisa jadi pilihan anda

Langkah Pembuatan

1. Masuk Ke Blog Anda

2. Masuk Ke Tata Letak

3. Dan Klik Bagian HTML/Java Script

4. Dan Masukan Kode Dibawah Ini Di Dalam HTML/Java Script
 <style type="text/css">
#translator-wrapper {
  display:block;
  width:200px;
  border:1px solid #0A340A;
  background-color:white;
  overflow:hidden;
  position:relative;
}
#translator-wrapper select {
  border:none;
  background:transparent;
  font:normal normal 11px Tahoma,Verdana,Arial,Sans-Serif;
  width:100%;
  color:black;
  -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:#0A340A;
  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:"";
  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>
<h3>Translate this page to:</h3>
<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>

Share

Like

G+

Tweet

Tweet
12 Komentar untuk "Membuat Widget Translator Halaman"

Berkomentarlah Sesuai Isi Artikel Diatas :)

Klik Untuk Komentar
Unknown
Balas
Unknown August 1, 2014 at 12:09 AM
delete

kerenn gan
kalo ada bule nyasar di blog kita jadi lebih mudah hehe

Unknown
Balas
Unknown August 1, 2014 at 12:13 AM
delete

waaah, boleh juga nh gan... supaya visitor yang liat blog kita ngerti isi blog dengan bahasanya sendiri :)

Unknown
Balas
Unknown August 1, 2014 at 12:17 AM
delete

Wow! Update lagi nih...
Langsung saya coba dulu untuk blog baru. :D

Hilman Singgih Wicaksana
Balas
Hilman Singgih Wicaksana August 1, 2014 at 12:20 AM
delete

Terima kasih gan udah share tipsnya. Bermanfaat sekali gan :)

Unknown
Balas
Unknown August 1, 2014 at 12:42 AM
delete

ternyata caranya simple yah om thnk atas infonya

Unknown
Balas
Unknown August 1, 2014 at 12:45 AM
delete

wah ini yang ane cari cari kang
izin coba ya kang reza

Reza Syahputra Rizal
Balas
Reza Syahputra Rizal August 1, 2014 at 6:26 PM
delete

Memang Gan ^_^

Reza Syahputra Rizal
Balas
Reza Syahputra Rizal August 1, 2014 at 6:26 PM
delete

Memang Gan ^_^

Reza Syahputra Rizal
Balas
Reza Syahputra Rizal August 1, 2014 at 6:29 PM
delete

Ok Gan ^_^

Reza Syahputra Rizal
Balas
Reza Syahputra Rizal August 1, 2014 at 6:31 PM
delete

OK Silahkan

Intan Sudibjo
Balas
Intan Sudibjo August 8, 2014 at 12:01 AM
delete

widget yang satu ini memang sangat dibutuhkan, tak jarang orang asing banyak juga yang nyasar ke blog :)

ryano93
Balas
ryano93 August 11, 2014 at 3:06 AM
delete

kadang" blog ane dikunjungi sama orang luar nih, kadang ada link translate dr google, tapi kalo ada yg ini mungkin orang" bule bisa kebantu hehe

makasih gan izin nyoba nih

Berkomentarlah Sesuai Isi Artikel Diatas :)

Newer Post Older Post Home
Subscribe to: Post Comments (Atom)

Contact Me !

  • Semua Niche

    Popular Posts

    • Membuat Navigasi Halaman Dengan Keyboard
    • Template Ramai Blogger !
    • Cara Membuat Tombol 3 Dimensi Dengan CSS
    • FND Blogger Template
    • Keren! Membuat Spoiler Dengan JavaScript
    • Fianetcakep Blogger Template Download
    • Cara Membuat Widget Sosial Media Lengkap
    • Cara Membuat Tombol Back To Top Dengan Efek Bounce Ala Kang Ismet
    • BENCLUNX RESPONSIVE BLOGGER TEMPLATE DOWNLOAD

    Berlangganan

    Dapatkan Informasi Dari Blog Karya-Reza Melalui Email

    Follow blog

    Subscribe To

    Posts
    Atom
    Posts
    Comments
    Atom
    Comments

    About Me

    Reza Syahputra Rizal
    View my complete profile

    © 2025 Karya-Reza Published By Karya-Reza powered by Blogger.com.
    All Right Reserved By Blog Dian Anarchyta.