Membuat Multibahasa Blog Menggunakan Jquery

Tadinya saya mau menggunakan widget google translate, namun masalahnya adalah saya ga bisa kustom tampilan, selain itu efek menggunakan w...

Tadinya saya mau menggunakan widget google translate, namun masalahnya adalah saya ga bisa kustom tampilan, selain itu efek menggunakan widget adalah di speen, performance web jadi makin lambat nah tentunya tidak bagus dong buat SEO, melihat hal tersebut saya akhirnya menemukan cara menggunakan kehebatan jquery sebagai alternatif, selain bisa kustomisasi tampilan bentuk icon translate Membuat Multibahasa Blog Menggunakan Jquery lebih mudah. Ok langsung aja ya 

  1. Kamu masuk dulu ke bagian edit html (Kalo belum tahu caranya coba lihat halaman http://www.gee.web.id/2013/10/cara-memasang-content-locker-di-blogger.html disitu sudah saya jelaskan sebelumnya )
  2. Masukan kode script dibawah tepat sebelum tag </head>

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script><script> $(document).ready(function(){
                //JQuery code for getting current URL
                var URL = $(location).attr('href');
$('.translate').click(function(){
window.location.href = 'http://translate.google.co.id/translate?sl=id&amp;tl=en&amp;js=n&amp;prev=_t&amp;hl=id&amp;ie=UTF-8&amp;u=' + URL + '&amp;act=url'
});
                //alert("Current URL Using JQuery : " + URL);
            });
</script>

3. Kode dibawah ini adalah gambar yang akan kamu tempatkan ketika icon di klik yang secara otomatis menggunakan google translate untuk menterjemahkan.

<img alt='tranlate to english' class='translate' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGHwyOdm8W0-qh2dYOsUJXmjGoncwQ9D2-5qiU_5Ckz7dj46HHk4e6s-BI_8BtbYLjOi0KOfExQ0wseHkw8rRb6frSOI7d3Wwx_S9qcDSztW-LDfYWbu6Fte0AlmRu3aFhg7lBFmRoEeI7/s1600/translategee.png' title='translate to english'/>

Itu saja gampangkan selamat mencoba, buat demo test kamu bisa gunakan translate di pojok kanan atas buat mencoba.

Oh ya huruf merah diatas adalah class yang menghubungkan script jquery dan gambar, mudah-mudahan nanti akan ada tutorial mendalam lagi mengenai jquery. yang masih bingung komentar dibawah ya.


4.5

COMMENTS

BLOGGER: 2
  1. makasih ilmunya ... bermanfaat , saya selama ini make google translate.

    BalasHapus
    Balasan
    1. ini juga pake bantuan google hehehehe

      Hapus

Nama

AMP,3,BLOGGER,11,CSS,19,FREE TEMPLATE,1,GRATIS,1,HEADLINE,4,HTML,1,JQUERY,9,MARKETING,11,OPINI,69,PEMROGRAMAN WEB,41,PERFORMANCE WEB,4,PHP,9,SEO,9,SOCIAL MEDIA OPTIMIZATION,8,TIPS DAN TRIK,48,
ltr
item
Gee Web Studio - Tutorial, Share Web & Mobile: Membuat Multibahasa Blog Menggunakan Jquery
Membuat Multibahasa Blog Menggunakan Jquery
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJNufGsTKHKbnkZsLK6fMGIv-t8lML_o5iD_UOrHgmIpVbW3WK3vBGWAQyt-NS_dmw6dHw7VYpr0DBkliTBxtX2DvePfSTv834IJSZG48iQXueRJjVt8oiR4i-GTEBI3Lfgj_k2MN5nOil/s1600/Multibahasa-Blog.jpg
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJNufGsTKHKbnkZsLK6fMGIv-t8lML_o5iD_UOrHgmIpVbW3WK3vBGWAQyt-NS_dmw6dHw7VYpr0DBkliTBxtX2DvePfSTv834IJSZG48iQXueRJjVt8oiR4i-GTEBI3Lfgj_k2MN5nOil/s72-c/Multibahasa-Blog.jpg
Gee Web Studio - Tutorial, Share Web & Mobile
https://www.gee.web.id/2013/10/membuat-multibahasa-blog-menggunakan-query.html
https://www.gee.web.id/
https://www.gee.web.id/
https://www.gee.web.id/2013/10/membuat-multibahasa-blog-menggunakan-query.html
true
77827092934645996
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share to a social network STEP 2: Click the link on your social network Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy Table of Content