Thursday, December 11, 2008

Lindungi Artikel dari Pembajakan (Copy Paste)

Diantara teman-teman blogger mungkin ada yang pernah mengalami pembajakan artikel milik kita oleh orang lain. Sungguh suatu tindakan yang kadang membuat kita emosi dikala kita menemukan artikel yang telah kita buat dengan susah payah, dengan menguras waktu ternyata dijiplak dan bahkan diakui sebagai artikel milik pembajaknya tanpa menyebutkan sumber artikel sebenarnya. Sebenarnya ada tindakan preventif yang bisa kita lakukan untuk mempersulit tindakan pembajakan artikel.
Pada dasarnya para penjiplak artikel biasanya menggunakan fasilitas bawaan dari Browser yaitu dengan menyeleksi artikel tersebut, klik kanan tombol mouse dan pilih menu copy. Itulah tindakan para pembajak yang sering dilakukan. Untuk mencegah pembajakan dapat dilakukan dengan menonaktifkan fasilitas pada browser yaitu "seleksi" dan "klik kanan". Ikuti langkah dibawah ini untuk memproteksi atau melindungi artikel dari aksi pembajakan.

CARA I : Menonaktifkan Seleksi Teks (Disable Select Text)

Langkah 1
Login ke Blogger
Langkah 2
Masuk ke bagian "Tata Letak - Edit HTML" dan jangan lupa "Expand Widget Template"
Langkah 3
Cari kode
</head>
Langkah 4
Letakan (copy paste) kode dibawah ini tepat diatas kode langkah 3
<script language='JavaScript1.2'>

//Disable Select Text script (IE4+, NS6+) - By Blogger Tune-Up
//For full source code, visit http://modification-blog.blogspot.com
function disableselect(e){
return false
}
function reEnable(){
return true
}
//if IE4+
document.onselectstart=new Function (&quot;return false&quot;)
//if NS6
if (window.sidebar){
document.onmousedown=disableselect
document.onclick=reEnable
}
</script>
<script language='JavaScript'>curPage=1;
document.oncontextmenu = function(){return false}
if(document.layers) {
window.captureEvents(Event.MOUSEDOWN);
window.onmousedown = function(e){
if(e.target==document)return false;
}
}
else {
document.onmousedown = function(){return false}
}
</script>
Langkah 5
Simpan Template

CARA II : Menonaktifkan Klik Kanan Copy (Disable Right Click)

Langkah 1
Login ke Blogger
Langkah 2
Masuk ke bagian "Tata Letak - Edit HTML" dan jangan lupa "Expand Widget Template"
Langkah 3
Cari kode
</head>
Langkah 4
Letakan (copy paste) kode dibawah ini tepat diatas kode langkah 3
<script language=JavaScript>
<!--

//Disable right click script - By Blogger Tune-Up
//For full source code, visit http://modification-blog.blogspot.com

var message="";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}

document.oncontextmenu=new Function("return false")
// -->
</script>
Langkah 5
Simpan Template

Mudah-mudahan dengan metode ini langkah para pembajak artikel lebih sulit dan berkurang. Happy Blogging :)

Friday, December 5, 2008

Menghilangkan Langgan : Entri (Atom)

Banyak para blogger yang menggunakan DotCom atau OpenID dengan dasar blog dari account blogger ingin tampilan blognya terlihat professional, mereka tidak ingin terlihat seperti menggunakan blogger account. Untuk bisa mewujudkan hal ini banyak cara yang bisa kita lakukan untuk mengubah tampilan asli blog kita menjadi terlihat professional, hal ini yang kemudian dikenal dengan istilah Blogger Hack oleh sebagian pengguna blogger account. Dalam artikel kali ini kita akan menghilangkan salah satu tampilan standar dari blog milik blogger, yaitu Langgan: Entri (Atom) atau Subscribe to: Posts (Atom). Menggunakan kata menghilangkan karena bisa berarti "membuang" atau "menyembunyikan".
Ada dua (2) cara untuk menghilangkan Langgan: Entri (Atom).
Cara I
Langkah 1
Login ke blogger
Langkah 2
Pilih tab "Pengaturan - Feed Situs"
Langkah 3
Ubah "Izinkan Feed Blog" menjadi "Tak Satupun"
Langkah 4
Klik "SIMPAN SETELAN"

Perhatian !
  • Jika menggunakan cara ini maka secara otomatis Langgan : Entri (Atom) dan Langgan : Komentar (Atom) akan hilang dari halaman blog. Tapi hal ini juga membuat para pembaca setia blog kita yang menggunakan feed tidak akan menerima lagi update artikel terbaru kita. Hal ini silahkan diterapkan pada blog kita jika kita tidak perduli dengan para pembaca setia blog kita, tetapi jika kita peduli silahkan gunakan cara II (kedua) dibawah ini.

Cara II
Langkah 1
Login ke blogger
Langkah 2
Pilih tab "Tata Letak - Edit HTML"
Langkah 3
Jangan lupa checklist "Expand Template Widget"
Langkah 4
Cari kode dibawah ini (berwarna biru) :
<b:if cond='data:blog.pageType != &quot;item&quot;'> <!-- Blog feed links -->
<b:if cond='data:feedLinks'>
<div class='blog-feeds'>
<b:include data='feedLinks' name='feedLinksBody'/>
</div>
</b:if>
Langkah 5
Hapuslah kode Langkah 4 atau beri tanda komentar seperti dibawah ini :
<b:if cond='data:blog.pageType != &quot;item&quot;'> <!-- Blog feed links -->
<b:if cond='data:feedLinks'>
<div class='blog-feeds'>
<!--<b:include data='feedLinks' name='feedLinksBody'/>-->
</div>
</b:if>
Langkah 6
Klik "SIMPAN TEMPLATE"

Perhatian!
  • Jika kita menemukan 2 kode seperti pada Langkah 4 (warna biru) buanglah keduanya atau beri tanda komentar keduanya seperti pada Langkah 5 (warna biru).
  • Dengan menggunakan Cara II (kedua) ini para pembaca setia blog kita yang menerima update melalui feed akan tetap menerima artikel kita.

Thursday, December 4, 2008

Float Navigation Bar

Float Navigation Bar atau dalam bahasa Indonesia kurang lebih sama dengan Baris Navigasi Terapung. Dalam artikel kali ini kita akan mencoba membuat suatu navigasi blog dengan posisi yang terapung atau seperti ditempelkan dalam blog kita, bisa ditempatkan diatas atau dibawah blog dan posisi tersebut selalu tetap tidak berubah walaupun kita menggeser scrollbar keatas dan kebawah. Navigas ini sangat membantu bagi blog yang pembuatan artikelnya tidak tetap dalam pemenggalannya (readmore...), dan atau blog yang memiliki halaman panjang, sehingga pengunjung tidak harus kembali lagi keatas halaman jika ingin mencari artikel lain dalam blog kita.

Berikut tahap pembuatan Float Navigation Bar :
Langkah 1
Login ke blogger
Langkah 2
Aktifkan Tab "Tata Letak - Edit HTML" jangan lupa check "Expand Widget Template"
Langkah 3
Cari kode dibawah ini :
]]></b:skin>
Langkah 4
Masukan (copy/paste) kode dibawah ini diatas kode Langkah 3 :
/********************************
* Float Navbar *
*********************************/
#float-navbar
{
align: center;
position: fixed;
border-top: 1px solid #ddd;
border-bottom: 1px solid #f5f5f5;
background-color: #f5f5f5;
width: 100%;
left: 0px;
color: #000;
z-index:10000;
opacity: 0.8;
filter: alphaundefinedopacity: 80);
bottom:0;
}
#float-navbar:hover
{
opacity: 1;
filter: alphaundefinedopacity: 100);
}
#float-navbar a
{
color: #000;
font-weight:bold;
}
/********************************
* Left Float Navbar *
*********************************/
.l_floatmnu
{
float:left;
list-style-type:none;
padding:0;
margin:3px 0 3px 5px;
}
.l_floatmnu li
{
padding: 0 0 0 3px;
margin-left:2px;
float:left;
color:#000000;
font:normal 11px arial;
}
.l_floatmnu li a
{
display:block;
font:normal 11px arial;
width:auto;
float:left;
text-decoration:none;
}
.l_floatmnu li a:hover
{
text-decoration:underline;
}
/********************************
* Right Float Navbar *
*********************************/
.r_floatmnu
{
float:right;
list-style-type:none;
padding:0;
margin:3px 5px 3px 0;
}
.r_floatmnu li
{
padding: 0 0 0 3px;
margin-left:2px;
float:left;
color:#000000;
font:normal 11px arial;
}
.r_floatmnu li a
{
display:block;
font:normal 11px arial;
width:auto;
float:left;
text-decoration:none;
}
.r_floatmnu li a:hover
{
background-color: #f5f5f5;
opacity:1;
color:#ff0000;
}
Langkah 5
Cari kode dibawah ini :
</div>
Kode tersebut harus diakhir template, hati-hati karena kode diatas akan ditemukan banyak sekali, dan kode ini harus yang diakhir template.
Langkah 6
Masukan (copy/paste) kode dibawah ini dibawah kode Langkah 6 :
<!-- Awal Float Navigation Bar -->
<div class='section' id='float-navbar'>
<ul class='l_floatmnu'>
<li><a expr:href='data:blog.url' title='Halaman Utama'>Home</a></li>
<li>|</li>
<li><a href='http://NAMA-BLOG.blogspot.com/search?max-results=300' title='Daftar isi'>Daftar Isi</a></li>
<li>|</li>
<li><a href='http://www.feedburner.com/fb/a/emailverifySubmit?feedId=2264909' target='_blank' title='Berlangganan via eMail'>Langganan</a></li>
<li>|</li>
<li><a href='http://www4.shoutmix.com/?hendriono' target='_blank' title='Tinggalkan Pesan'>Shout Chat</a></li>
<li>|</li>
<li><a href='http://dedehendriono.blogspot.com/' target='_blank' title='Tentang Hendriono'>Tentang Saya</a></li>
</ul>

<ul class='r_floatmnu'>
<li><a href='ymsgr:sendIM?dedehendriono@yahoo.com' title='Chatting bersamaku'>Chatting</a></li>
<li>|</li>
<li><a href='javascript:window.printundefined)' title='Print Halaman Ini'>Print Artikel Ini</a></li>
<li>|</li>
<li><a href='http://dedehendriono.blogspot.com' target='_blank'><script src='http://fastonlineusers.com/on2.php?d=NAMA-BLOG.blogspot.com' type='text/javascript'/> User Online</a></li>
<li>|</li>
<li><a href='http://easyhitcounters.com/stats.php?site=hendriono' target='_blank'><img alt='Free Web Counters' border='0' src='http://beta.easyhitcounters.com/counter/index.php?u=hendriono&amp;s=tiny'/></a><script src='beta.easyhitcounters.com/counter/script.php?u=hendriono'/></li>
</ul>
</div>
<!-- Akhir Float Navigation Bar -->
Langkah 7
Simpanlah template dengan klik tombol "SIMPAN TEMPLATE"

Keterangan :
  • Ubahlah NAMA-BLOG sesuai dengan nama/alamat blog anda
  • Ubahlah feedId=2264909 dengan feedId anda yang dapat diperoleh di Feed Burner
  • Ubahlah shoutmix.com/?hendriono dengan alamat ShoutMix anda
  • Ubahlah alamat web counter yang anda peroleh dari sini
  • Untuk mengubah posisi Float Navigation Bar, ubahlah bottom menjadi top pada CSS (Cascading Style Sheet)

Friday, November 28, 2008

Menambah Animasi Tampilan Blogger

Artikel kali ini bener-bener bingung membuat judulnya, tapi yang jelas para pengunjung bisa melihat animasi bendera Merah Putih pada blog ini, entah sebelah mana ya? dan entah apa disebutnya. Tips ini termasuk sederhana dalam penerapan pada template blogger. Mau coba manambah animasi pada tampilan blogger kita? silahkan ikuti langkah berikut ini.

Langkah Menambah Animasi Tampilan Blogger

Langkah 1
Login ke Blogger
Langkah 2
Masuk ke bagian "Tata Letak - Edit HTML"
Langkah 3
Cari kode dibawah ini :
]]></b:skin>
Langkah 4
Masukan kode dibawah ini tepat diatas Langkah 3 :
#animasi_gambar {
position:fixed;_position:absolute;top:0px; left:0px;
clip:inherit;
_top:expressionundefineddocument.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expressionundefineddocument.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
Langkah 5
Cari lagi kode dibawah ini yang paling bawah dari template :
</body>
Langkah 6
Masukan kode dibawah ini tepat dibawahnya :
<div id='animasi_gambar'>
<a href='http://modification-blog.blogspot.com'>
<img border='0' src='http://URL.com/gambar_animasi.gif'/></a>
</div>
Langkah 7
Klik "SIMPAN TEMPLATE"

Perhatian!
  • Ubah URL pada Langkah 6 (baris 2) sesuai dengan alamat blog kita
  • Gantilah animasi pada Langkah 6 (baris 3) sesuai dimana URL tempat kita menyimpan animasi
  • Animasi harus berformat GIF
  • Background Animasi GIF harus transparant
  • Ubah kode pada pada Langkah 4 (berwarna biru) untuk menempatkan posisi gambar, top=atas, bottom=bawah, left=kiri, right=kanan

Wednesday, November 26, 2008

Memanajemen Arsip Blog

Memanajemen arsip blog sangatlah penting, karena pengunjung akan merasa nyaman dan betah berlama-lama mengunjungi blog kita jika navigasi dalam blog kita mudah dicerna, menarik dan cepat dalam proses pencarian artikel. Manajemen arsip blog sangat cocok digabungkan dengan artikel sebelumnya "Menampilkan Judul Artikel Tanpa Isi Halaman", mudah-mudahan sudah memahami dan menerapkan trik blog tersebut. Manajemen arsip memudahkan pengunjung untuk menemukan arsip artikel yang dicari. Ketika pengunjung mencari artikel sesuai dengan kategori/label, biasanya blog akan menampilkan artikel secara keseluruhan (baca: judul artikel dan isi halaman artikel) dan dalam jumlah yang sudah kita set, hal ini akan memperlambat loading page halaman blog kita dan hal ini akan membuat pengunjung malas meneruskan pencarian artikel dalam blog kita. Mencegah pengunjung kabur dari blog kita, ikutilah trik mamanjemen Arsip blog berikut.

Membuat Daftar Isi Artikel Blog
Layaknya sebuah buku, kadang kita merasa malas harus membuka halaman satu persatu untuk mencari artikel yang kita inginkan pada sebuah buku jika jumlah halamannya banyak. Untuk mencari sebuah artikel dalam sebuah buku biasanya kita akan melihat daftar isi, membaca judul dan melihat halaman artikel tersebut, lebih cepat dan efektif. Begitupun dengan blog, kita buatkan pengunjung daftar isi supaya mereka mudah dalam proses pencarian artikel yang dibutuhkan, tapi sebelumnya blog kita sudah menerapkan "Menampilkan Judul Artikel Tanpa Isi Halaman", jika tidak "Manajemen Arsip Blog" tetap tidak akan efektif bahkan akan jadi bumerang bagi kita pemilik blog, pengunjung kabur dan trafik anjlok. Kalau sudah seperti itu "Tamatlah Riwayat Blog" kita.
Berikut langkah pembuatan daftar isi artikel blog :
Langkah 1
Login ke Blogger
Langkah 2
Masuk kebagian "Tata Letak - Elemen Halaman" dan buatlah "LinkList"
Langkah 3
Masukan Link dibawah ini pada LinkList :
http://ALAMAT-BLOG.blogspot.com/search?max-result=300
Jangan lupa beri nama link tersebut (misal: Daftar Isi)
Langkah 4
Klik "Tambah URL" dan klik tombol "SIMPAN"

Keterangan :
  • Ganti ALAMAT-BLOG dengan url blog anda.
  • Angka 300 menunjukan jumlah artikel yang akan ditampilkan, ubahlah sesuai keinginan anda.
  • Jangan lupa blog anda harus sudah menerapkan "Menampilkan Judul Artikel Tanpa Isi Halaman" sehingga ketika pengunjung meng-klik Link "Daftar Isi" maka blog hanya akan menampilkan judul artikelnya saja.

Membuat Daftar Isi per Kategori/Label
Label atau kategori ibarat BAB didalam buku, didalam BAB tersebut terdapat sub BAB dan seterusnya. Dengan mengatur jumlah artikel per kategori/label, proses pencarian artikel lebih cepat, karena blog akan menampilkan artikel sesuai kategori/label yang pengunjung inginkan serta jumlah artikel yang akan ditampilkan bisa kita atur.
Berikut langkah pembuatan daftar isi per kategori/label :
Langkah 1
Login ke Blogger
Langkah 2
Masuk kebagian "Tata Letak - Edit HTML" dan "Expand Template Widget" (Jangan lupa untuk mem-backup template terlebih dahulu)
Langkah 3
Cari kode dibawah ini :
data:label.url
Langkah 4
Tambahkan kode dibawah ini (berwarna biru) :
data:label.url + &quot;?max-results=300&quot;
Langkah 4
Klik "SIMPAN TEMPLATE"

Keterangan :
  • Ubahlah angka 300 untuk menentukan jumlah artikel yang akan ditampilkan
  • Kode pada langkah 3 biasanya ada sekitar 3 kode, tambahkanlah seluruh kode seperti pada langkah 4

Membuang Header Tanggal Artikel
Sebenarnya dengan tidak membuang header tanggal artikel juga tidak menjadi masalah, tapi bagi yang ingin blognya terlihat rapi silahkan ikuti trik blog dibawah ini. Header tanggal artikel akan ikut ditampilkan jika pengunjung melihat daftar isi. Hal ini akan membuat ruang halaman blog menjadi bertambah dan terlihat tidak rapi, apalagi bagi blogger yang update blognya tidak teratur, maka pada saat menampilkan daftar isi judul artikel akan terselipi header tanggal artikel.
Untuk membuang header tanggal artikel ikuti langkah berikut :
Langkah 1
Login ke Blogger dan "Backup Template"
Langkah 2
Masuk kebagian "Tata Letak - Edit HTML" dan "Expand Template Widget" (Jangan lupa untuk mem-backup template terlebih dahulu)
Langkah 3
Cari kode dibawah ini dan buang/delete:
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
Atau jika hanya ingin menyembunyikan (tanpa membuang) tambahkan kode (warna biru) seperti dibawah ini :
<!--<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>-->
Langkah 4
Klik "SIMPAN TEMPLATE"

Happy Blogging...:)

Saturday, November 22, 2008

Menampilkan Komentar dengan Grazr

Komentar dari para pengunjung itu kadang membuat kita tersenyum, marah atau biasa-biasa saja. Tapi terkadang kita jenuh harus scroll jauh-jauh karena yang memberi komentar banyak, coba silahkan berkunjung ke Ningtyas, Lyla atau Fatamorgana, jujur saja aku sampai males harus baca komentar-komentar para pengunjung. Supaya komentar-komentar tersebut terlihat rapi dan mudah dibaca (baca:mudah dalam navigasi) kita bisa menggunakan fasilitas gratis yang telah diberikan oleh Grazr. Sebelum memasang pada blogger silahkan lihat hasilnya disini.

Pemasangan Komentar Grazr
Langkah 1
Login ke Blogger
Langkah 2
Tambah Gadget HTML/JavaScript
Langkah 3
Masukan kode dibawah ini pada bagian konten :
<center><div style="height:150px;width:99%;"><a href="http://grazr.com/read?view=s&theme=default&file=http://NAMA-BLOG.blogspot.com/feeds/comments/default"><img alt="Grazr" style="border:none" src="http://static.grazr.com/images/grazrbadge.png"/></a><script src="http://static.grazr.com/gzloader.js?view=o&amp;theme=default&amp;addbar=on&amp;file=http://NAMA-BLOG.blogspot.com/feeds/comments/default" defer="defer" type="text/javascript"></script><br/><a href="http://modification-blog.blogspot.com/2008/11/menampilkan-komentar-dengan-grazr.html" target="_blank">Grab this widget</a></div></center>

Keterangan :
  • Ubah NAMA-BLOG dengan nama/alamat url blog anda
  • Ubah height:150px untuk menentukan tinggi widget
  • Ubah width:99% untuk menentukan lebar widget atau ubah 99% dengan px
  • Ubah view=o menjadi s atau 3p untuk menentukan cara pemunculan isi komentar; o=outline, s=slider dan 3p=3pane
  • Ubahlah theme=default untuk menentukan theme, ada sekitar 14 theme
  • Buanglah kode addbar=on jika kita tidak ingin menampilkan link url komentar blog kita
Theme Komentar Grazr :
  • Default = default
  • Default Big Title = default_big_title
  • Gloss Black = gloss_black
  • Gloss Blue = gloss_blue
  • Gloss Red = gloss_red
  • Gloss Silver = gloss_silver
  • Home Silver = home_silver
  • Milk Coco = milk_coco
  • Milk Pink = milk_pink
  • Milk White = milk_white
  • Sateen Black = sateen_black
  • Sateen Blue = sateen_blue
  • Sateen Green = sateen_green
  • Sateen Red = sateen_red

Tuesday, November 18, 2008

Widget Google Translator untuk Blogger

Google tidak henti-hentinya melakukan perbaikan dan penambahan fasilitas, salah satunya Google Translator. Walaupun belum semua bahasa didukung dan masih ada beberapa bahasa dalam versi beta. Dengan adanya fasilitas Google Translator maka seluruh pengunjung dari berbagai belahan dunia (baca: yang didukung Google Translator) akan dengan mudah memahami detail artikel yang kita tulis. Beberapa waktu kebelakang Google Translator belum mendukung Bahasa Indonesia, tapi kini (walaupun terlambat) Google Translator telah mendukung Bahasa Indonesia, makanya bagi para pemilik blog/website memasang Google Translator adalah menjadi keharusan supaya pembaca setianya tidak berasal dari lokal saja (satu daerah atau satu keturunan atau satu bahasa).
Pada artikel ini kita akan mencoba membahas tiga jenis Google Translator, yaitu :

Google Translator Widget (W3C Recommended)
Google translator jenis ini menurut informasi telah diakui oleh W3C (World Wide Web Consortium), artinya sudah disahkan dan sudah tidak terdapat kesalahan dalam script Google Translator tersebut dan merupakan widget yang paling mudah dalam pemasangan pada blogger.
Langkah pemasangan Google Translator Widget (W3C Recommended) :
Langkah 1
Tambah Gadget - HTML JavaScript silahkan baca disini
Langkah 2
Masukan (copy paste) kode dibawah ini :
<script src=http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&amp;up_source_language=en&amp;w=160&amp;h=60&amp;title=&amp;border=&amp;output=js></script>
Atau klik tombol "Tambah Widget Google Translator" dibawah ini :

Google Translator Widget Menu Dropdown
Widget yang satu ini sangat sederhana dalam tampilan tapi cukup lengkap dengan beberapa bahasa yang didukung, lebih dari 30 bahasa.
Langkah pemasangan Google Translator Widget Menu Dropdown :
Langkah 1
Tambah Gadget - HTML JavaScript silahkan baca disini
Langkah 2
Masukan (copy paste) kode dibawah ini :
<form action='http://translate.google.com/translate_c?' target='_blank'>
<table id='gotrans'>
<tr><td> <select name='tl' style='width: 15em;'>
<option value='ar'>Arabic</option>
<option value='bg'>Bulgarian</option>
<option value='ca'>Catalan</option>
<option value='zh-cn'>Chinese undefinedSimplified)</option>
<option value='zh-tw'>Chinese undefinedTraditional)</option>
<option value='hr'>Croatian</option>
<option value='cs'>Czech</option>
<option value='da'>Danish</option>
<option value='nl'>Dutch</option>
<option selected='en'>English</option>
<option value='tl'>Filipino</option>
<option value='fi'>Finnish</option>
<option value='fr'>French</option>
<option value='de'>German</option>
<option value='el'>Greek</option>
<option value='iw'>Hebrew</option>
<option value='hi'>Hindi</option>
<option value='it'>Italian</option>
<option value='ja'>Japanese</option>
<option value='ko'>Korean</option>
<option value='lv'>Latvian</option>
<option value='lt'>Lithuanian</option>
<option value='no'>Norwegian</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='sv'>Swedish</option>
<option value='uk'>Ukrainian</option>
<option value='vi'>Vietnamese</option>
</select>
<script language="JavaScript">
<!--
document.write undefined'<input name=u value='+location.href+' type=hidden>')
// -->
</script>
<input name='sl' type='hidden' value='id'/>
<input name='hl' type='hidden' value='en'/>
<input name='ie' type='hidden' value='UTF-8'/>
<input style='width: auto;' type='submit' value='Translate'/>
</td></tr></table></form>
Atau klik tombol "Tambah Widget Google Translator" dibawah ini :

Google Translator Widget Mini Flags
Jenis ini paling banyak diminati, karena lebih bagus dalam hal tampilan. Terdapat bendera yang mewakili bahasa tertentu sehingga pengunjung tinggal memilih bendera untuk menentukan bahasa yang dikehendakinya.

Google Translator Widget Mini Flags Bujur Sangkar :
Langkah pemasangan Google Translator Widget Mini Flags Bujur Sangkar:
Langkah 1
Tambah Gadget - HTML JavaScript silahkan baca disini
Langkah 2
Masukan (copy paste) kode dibawah ini :
<table width="99%" border="0" bgcolor="#00FFFF">
<tr>
<td width="99%">
<center>Translate this blog!<br/>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cen&amp;hl=en&amp;ie=UTF8'); return false;" title="English"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="English" src="http://dedehendriono.googlepages.com/UnitedKingdomGreatBritain.png" height="32" title="English"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Car&amp;hl=en&amp;ie=UTF8'); return false;" title="Arabic"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Arabic" src="http://dedehendriono.googlepages.com/SaudiArabia.png" height="32" title="Arabic"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cvi&amp;hl=en&amp;ie=UTF8'); return false;" title="Vietnamese"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Vietnamese" src="http://dedehendriono.googlepages.com/VietNam.png" height="32" title="Vietnamese"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Ces&amp;hl=en&amp;ie=UTF8'); return false;" title="Spanish "><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Spanish " src="http://dedehendriono.googlepages.com/Spain.png" height="32" title="Spanish "/></a>
<br/>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Czh-CN&amp;hl=en&amp;ie=UTF8'); return false;" title="Chinese undefinedSimplified)"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Chinese undefinedSimplified)" src="http://dedehendriono.googlepages.com/China.png" height="32" title="Chinese undefinedSimplified)"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cfr&amp;hl=en&amp;ie=UTF8'); return false;" title="French "><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="French " src="http://dedehendriono.googlepages.com/France.png" height="32" title="French "/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cde&amp;hl=en&amp;ie=UTF8'); return false;" title="German"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="German" src="http://dedehendriono.googlepages.com/Germany.png" height="32" title="German"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cit&amp;hl=en&amp;ie=UTF8'); return false;" title="Italian"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Italian" src="http://dedehendriono.googlepages.com/Italy.png" height="32" title="Italian"/></a>
<br/>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cja&amp;hl=en&amp;ie=UTF8'); return false;" title="Japanese BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Japanese BETA" src="http://dedehendriono.googlepages.com/Japan.png" height="32" title="Japanese BETA"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cko&amp;hl=en&amp;ie=UTF8'); return false;" title="Korean BETA"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Korean BETA" src="http://dedehendriono.googlepages.com/SouthKorea.png" height="32" title="Korean BETA"/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://www.google.com/translate?u='+encodeURIComponentundefinedlocation.href)+'&amp;langpair=id%7Cru&amp;hl=en&amp;ie=UTF8'); return false;" title="Russian BETA "><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Russian BETA " src="http://dedehendriono.googlepages.com/RussianFederation.png" height="32" title="Russian BETA "/></a>
<a target="_blank" rel="nofollow" onclick="window.openundefined'http://modification-blog.blogspot.com'); return false;" title="Grab this widget"><img border="0" style="cursor:pointer; cursor:hand;" width="32" alt="Grab this widget" src="http://dedehendriono.googlepages.com/hendriono.png" height="32" title="Grab this widget"/></a></center></td></tr>
</table>
Atau klik tombol "Tambah Widget Google Translator" dibawah ini :

Google Translator Widget Mini Flags Memanjang :
Langkah pemasangan Google Translator Widget Mini Flags Bujur Memanjang:
Langkah 1
Tambah Gadget - HTML JavaScript silahkan baca disini
Langkah 2
Masukan (copy paste) kode dibawah ini :
<form action="http://translate.google.com/translate_c?" target="_blank">
<script language="JavaScript">
<!--
document.write undefined"<input name=u value="+location.href+" type=hidden>")
// -->
</script>
<input name="hl" value="id" type="hidden">
<input name="ie" value="UTF8" type="hidden">
<input name="langpair" value="" type="hidden">
<input name="langpair" value="id|en" title="English" src= "http://dedehendriono.googlepages.com/UnitedKingdom24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|fr" title="French" src= "http://dedehendriono.googlepages.com/France24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|de" title="German" src= "http://dedehendriono.googlepages.com/Germany24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|it" title="Italian" src= "http://dedehendriono.googlepages.com/Italy24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|pt" title="Portuguese" src= "http://dedehendriono.googlepages.com/Portugal24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|es" title="Spanish" src= "http://dedehendriono.googlepages.com/Spain24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|ja" title="Japanese" src= "http://dedehendriono.googlepages.com/japan24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|ko" title="Korean" src= "http://dedehendriono.googlepages.com/SouthKorea24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair" value="id|zh-CN" title="Chinese Simplified" src= "http://dedehendriono.googlepages.com/China24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24">
<input name="langpair2" value="id|ar" title="Arabic" src= "http://dedehendriono.googlepages.com/SaudiArabia24.png" onclick="this.form.langpair.value=this.value" height="24" type="image" width="24" />
</form>
Atau klik tombol "Tambah Widget Google Translator" dibawah ini :
Happy Blogging :)