Cara memasang widget di sudut / pojok blog

Mempercantik blog adalah salah satu hal yang harus blogger perhatikan. Blog yang cantik dan sedap dipandang akan membuat betah pengunjung untuk mengeksplor isi konten yang ada di dalam blog anda. Dan sudah pasti akan membuat pengunjung datang kembali untuk melihat update posting terbaru pada blog anda.

Salah satu cara mempercantik blog anda adalah memasang widget. Widget ini bisa berupa gambar/image, photo, animasi, traffic blog, ads/iklan, status yahoo messenger, badget facebook, shout box, jam, kalender, hit counter dan lain-lain.

Sebenarnya kita dapat memasang widget pada badget yang sudah ada dalam template yang kita pilih. 

Screenshot penambahan badged

Namun bagaimana bila kita ingin memasang widget pada tempat yang kita ingin?

Nah oleh sebab itu, saat ini alfin ingin memberi tutorial memasang widget di sudut/pojok blogger/blogspot. Maksudnya seperti apa? Coba lihat sebelah kiri bawah blog saya ini. atau lihat screenshot dibawah.

Screenshot contoh widget sudut / pojok

Ada sebuah status Yahoo Messenger yang selalu mengikuti walaupun scroll bar ditarik ke arah atas dan bawah. Apabila anda tidak tahu apa yang dimaksud dengan scroll bar, lihat screenshot dibawah

Screenshot scroll bar

Fungsi scroll bar ini adalah agar anda dapat melihat isi blog yang terlalu panjang karena isi blog yang begitu banyak.

Bukan hanya status Yahoo Messenger saja yang bisa di pasang, tetapi bisa juga gambar/image, photo, animasi, traffic blog, ads/iklan, badget facebook, shout box, jam, kalender, hit counter dan lain-lain.

Oke langsung saja ke tutorialnya.

Step 1 

-pertama anda harus login untuk masuk ke blogger anda.
-lalu masuk ke TATA LETAK/LAYOUT lalu pilih tab EDIT HTML.
-sebelumnya anda harus centang EXPAND TEMPLATE WIDGET.
-cari (Ctrl+F) kode ]]></b:skin> lalu copy paste kode dibawah ini tepat di atas nya.

#sudut-widget {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

Text yang berwarna merah adalah kode untuk posisi nya, jika anda ingin posisinya berubah tinggal mengganti:

bottom = untuk yang ingin widget nya di bawah
top = untuk yang ingin widget nya di atas
right = untuk yang ingin widget nya di sebelah kanan
left = untuk yang ingin widget nya di sebelah kiri

Step 2

- selanjutnya yaitu meletakan kode dibawah sebelum kode </body>

<div id="sudut-widget">
WIDGET YANG INGIN DIPASANG
</div>

Nah, kata WIDGET YANG INGIN DIPASANG itu yang harus kita ganti.

Step 3

Untuk widget gambar/photo (yang apabila di klik akan membawa ke halaman yang diinginkan) kita harus memasukan script:

<a href="ALAMAT LINK YANG DIINGINKAN">

<img src="LOKASI GAMBAR ANDA" border="0" /></a>

Sekian tips dari saya !

Jangan lupa ya di follow blog saya ini !