Membuat kotak banner teman diheader keren

KALI INI SAYA MAU SHARE POSTINGAN  TENTANG CARA MEMBUAT BANNER TEMAN DISAMPING KANAN HEADER

Tukeran link/exchange memang dibutuhkan juga pada dunia blogging terutama untuk mendapat backlink.. mungkin anda ingin memasang kotak banner teman diheader biar agak keren.. seperti photo disamping :ngakak:



sebenarnya kode ini saya dapatkan dari blog sandymufc09
namun menurut saya para blogger mungkin agak kurang mengerti dengan tutornya begitu juga dengan saya. saat saya mencoba tutornya 4x bertutut2 template saya error terus saat menyimpan. nah jadi kali ini saya akan jelaskan lebih simple dan mudah2an bisa mudah dimengerti.

Pertama jika anda belum masuk. Silahkan masuk dulu ke blogger.com
Letakan kode dibawah ini tepat diatas kode]]></b:skin>

#MAMZbanner1{width: auto;
height: auto;
float: right;
background: rgba(0, 0, 0, 0.4);
margin-right:;
padding: 3px;
-webkit-animation:RZloading 3s;
-o-animation:RZloading 3s;
-moz-animation:RZloading 3s;
-ms-animation:RZloading 3s;
animation:RZloading 3s;
margin-top: 15px;
border-radius: 5px;
border: 5px solid #0101DF;
overflow: hidden;
z-index: 999999;
-moz-transition: all 0.7s ease-in-out;
-webkit-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
-ms-transition: all 0.7s ease-in-out;
transition: all 0.7s ease-in-out;}
#MAMZbanner1 h2{display:none}
#MAMZbanner1 .widget-content{width:468px}
#MAMZbanner1 img{opacity:0.5;padding:0px;
-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;}
#MAMZbanner1:hover{margin-right: 20px;border:5px solid #0101DF;}
#MAMZbanner1 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 0.1s ease-in-out;
-moz-transition:all 0.1s ease-in-out;
-ms-transition:all 0.1s ease-in-out;
-o-transition:all 0.1s ease-in-out;
transition:all 0.1s ease-in-out;}
#MAMZbanner1:before {content:"";position:absolute;width:150px;height:125px;background:transparent url(http://i.imgur.com/I3cM4IV.png) no-repeat center;margin-left:-110px;margin-top:10px;}

Kode yang berwarna hijau adalah besar dan tingginya
Langkah kedua cari kode  <div id='header'>
Lalu letakan kode dibawah ini diatas kode tadi

<div class='MAMZbanner1 section' id='MAMZbanner1'><div class='widget HTML' id='HTML11'>
<div class='widget-content'>

    <a href='http://seo-cyberjr.blogspot.com/p/link-exchange_8577.html' target='_blank'><img alt='BLOGGING , GAME, SOCIAL' border='0' src='http://i1328.photobucket.com/albums/w529/abahz/cooltext1113115345_zpsd027a848.png'/></a>

    <a href='http://seo-cyberjr.blogspot.com/p/link-exchange_8577.html' target='_blank'><img alt='BLOGGING , GAME, SOCIAL' border='0' src='http://i1328.photobucket.com/albums/w529/abahz/cooltext1113115345_zpsd027a848.png'/></a>

    <a href='http://seo-cyberjr.blogspot.com/p/link-exchange_8577.html' target='_blank'><img alt='BLOGGING , GAME, SOCIAL' border='0' src='http://i1328.photobucket.com/albums/w529/abahz/cooltext1113115345_zpsd027a848.png'/></a>

    <a href='http://seo-cyberjr.blogspot.com/p/link-exchange_8577.html' target='_blank'><img alt='BLOGGING , GAME, SOCIAL' border='0' src='http://i1328.photobucket.com/albums/w529/abahz/cooltext1113115345_zpsd027a848.png'/></a>

    <a href='http://seo-cyberjr.blogspot.com/p/link-exchange_8577.html' target='_blank'><img alt='BLOGGING , GAME, SOCIAL' border='0' src='http://i1328.photobucket.com/albums/w529/abahz/cooltext1113115345_zpsd027a848.png'/></a>

    <a href='http://seo-cyberjr.blogspot.com/p/link-exchange_8577.html' target='_blank'><img alt='BLOGGING , GAME, SOCIAL' border='0' src='http://i1328.photobucket.com/albums/w529/abahz/cooltext1113115345_zpsd027a848.png'/></a>

</div></div></div>

SEMOGA BERHASIL YA :sip:
KLIK INI UNTUK DEMO : 
Live Demo
Kalo yang ada pada demo tingginya 80px kamu atur2 saja sendiri 
Silahkan ganti kode yang berwarna merah itu dengan kode anda sendiri atau dengan kode banner teman anda..