Cara Membuat Kotak Banner 88x31 Melayang disamping Sidebar

Hai sobat blogger kali ini Blog Krizeer akan mengeposkan "Cara Membuat Kotak Banner 88x31 diSidebar - Smart Education", cara tidak terlalu sulit kok, daripada penasaran ayo kita simak secara bersama-sama.

Login ke blogger

1. Masuk ke template
2. edit HTML
3. Cari kode ]]><b:skin jika sudah ketemu
4. letakan script di bawah ini tepat di atas kode ]]><b:skin

#sidebarLank{
box-shadow: 0 0 15px white;
background: #0E090D;
border: 4px solid #9F1111;
border-left: 4px solid #9F1111;
float: left;
margin-top: 175px;
margin-left: -135px;
width: 88px;
height: auto;
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
z-index: 10px;
line-height: 10px;
box-shadow: 0 0 15px blackred;
background: #222;
background-image: -webkit-linear-gradient(top, #393939, #222);
background-image: -moz-linear-gradient(top, #393939, #222);
background-image: -o-linear-gradient(top, #393939, #222);
background-image: -ms-linear-gradient(top, #393939, #222);
background-image: linear-gradient(to bottom, #393939, #222);
position:absolute;
}
#sidebarLank img{opacity:0.5;-webkit-filter:saturate(0.0);-moz-filter:saturate(0.0);-ms-filter:saturate(0.0);-o-filter:saturate(0.0);filter:saturate(0.0);-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;transition:all 1s ease-in-out;padding:0}
#sidebarLank img:hover{opacity:1;-webkit-filter:saturate(1.1);-moz-filter:saturate(1.1);-ms-filter:saturate(1.1);-o-filter:saturate(1.1);filter:saturate(1.1);-webkit-transition:all .1s ease-in-out;-moz-transition:all .1s ease-in-out;-ms-transition:all .1s ease-in-out;-o-transition:all .1s ease-in-out;transition:all .1s ease-in-out}

Cari kode <div id='header'>, tidak semua template sama jadi jika tidak ketemu kode tersebut cari saja kode yang intinya "header", jika sudah ketemu dengan kode tersebut. Lalu kalian letakan kode di bawah ini tepat di atas kode <div id='header'>

<b:section id='sidebarLank' maxwidgets='5' showaddelement='yes'>
</b:section>

Keterangan :
Kode yang berwarna pink itu tinggi dari banner tersebut
Kode yang berwarna hijau itu adalah lebarnya
tidak semua template sama, jadi disesuaikanlah dengan ukuran template anda.
Yang terakhir simpan, dan lihat hasilnya.
referensi dari lank-cyber4rt.blogspot.com

Tweet

Unknown pada 5/18/2013