Cara Membuat Widget Banner Header

Selamat siang Skyser..
Kali ini saya akan share yang direqueskan sobat Skyser. Yaitu, cara membuat widget banner di header.
Oke langsung ikuti step di bawah ini

Step :

1. Login Blogger (BLOGGER bukan TWITTER haha)
2. Klik Template > Edit HTML > centang "Expand Template Widget"
3. Sebelum edit sebaiknya copy semua code di situ buat berjaga-jaga.
4. Cari code ]]></b:skin> (gunakan ctrl+F untuk mempermudah)
5. Pastekan code ini tepat diatas code ]]></b:skin>

#SBanner{
background: #000;
box-shadow:0 00 0px rgba(0,0,0,0.0);
border:4px solid #9f1111;
border-radius:4px;
float: left;
margin-top: 20px;
margin-left: 10px;
width: 88px;
height: 496px;
display: inline;
padding: 2px;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
}

6. Cari code <div id='header-wrapper'> eit bentar ini code dipunya ane mungkin akan berbeda jika punya kalian, pokoknya cari code <div id='header
7. Pastekan code ini tepat di bawah code tadi

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

>8. Simpan Template.

Keterangan :

1. Text yang berwarna Merah adalah code warna untuk background widget
2. Text yang berwarna Orange adalah code warna untuk bordernya (kalo ga tau border ya bisa dibilang garis pinggiran hehe..)
3. Text yang berwarna Kuning adalah code untuk mengatur jarak widget dari kiri
4. Text yang berwarna Hijau adalah code untuk mengatur jarak widget dari atas
5. Text yang berwarna Biru Muda adalah code untuk mengatur lebar dan tinggi widget

Untuk code warna silahkan cek di sini

Semoga Bermanfaat ^_^