Cara Menambahkan Widget di Samping Kiri dan Kanan Blog

Musoshare Note -

Cara menambahkan widget pada di samping kiri dan kanan blog, inilah yang akan saya bahas pada kesempatan ini, mengingat masih banyaknya sahabat blogger yang menggunakan iklan melayang (floating) sementara di lain sisi ada beberapa publisher iklan melarang bahkan tidak mengizinkan seorang blogger memasang iklannya dengan cara melayang tadi.

Ok, dari pada lama-lama membahas tentang iklan melayang, ntar agan-agan pada lari. Langsung saja menuju ke TKP.... 

1. Login ke akun blog sobat
2. Pilih template
3. Edit HTML
4. Cari kode ]]></b:skin>
5. Tempatkan kode dibawah ini tepat di atassnya ]]></b:skin>

.content{z-index:1;}
.ad-left, .ad-left img {left:0px}
.ad-right, .ad-right img {right:0px} 
.ad-left, .ad-right {bottom:0px;
min-width:0px; max-width:120px;
height:100%; text-align:center;
white-space: nowrap; position: absolute;
z-index:0; overflow:hidden;
margin:0px; padding:0px}
.ad-left .widget, .ad-right .widget, 
.ad-left .widget-content, 
.ad-right .widget-content {
margin:0px;padding:0px;}
.ad-left h2, .ad-right h2 {display:none}
.ad-left .widget-content,
.ad-right .widget-content {line-height:1;}
.ad-left img, .ad-right img {
top:32px; position:fixed;
z-index:-1; opacity:0.7;
width:120px; height:600px;}
.ad-left a:link, .ad-right a:link {
width:120px; height:600px;
display:block; position:relative;}
.ad-left:hover, .ad-right:hover{z-index:2}
.ad-left .widget .widget-item-control img,
.ad-right .widget .widget-item-control img {display:none;}

6.      Selanjutnya cari kode </body> dan sisipkan kode dibawah ini tepat di atasnya

<b:section class='ad-right' id='ad-right' showaddelement='yes'></b:section>
<b:section class='ad-left' id='ad-left' showaddelement='yes'></b:section>

7.      Simpan template

Nah, sekarang tinggal kembali ke tata letak, perhatikan tambahan gadget di bagian bawah...

NB :

      Ganti 120px jika ingin ukuran iklannya 160px