Formulir Kontak

Nama

Email *

Pesan *

Membuat Menu Stripe-Ad Fixed Di Blog

Aizzan Blog -- Selamat malam semuanya sahabat blogger dimana pun kalian berada pada kesempatan kali ini saya akan membahas tentang tutorial membuat menu stipe-ad fixed di blog, yang sebelumnya kita sudah pernah membahas tentang tutorial cara membuat menu float fixed di blog. Fungsi dari menu ini memang sama saja dari menu sebelumnya namun yang kali ini kita bahas ada beberapa fungsi baru yakni bisa di close atau di tutup dari bagian pojok kanan, untuk melihat demonya bisa klik link DEMO ini, sedangkan screenshotnya bisa lihat di bawah ini :

Aizzan Blog:  Membuat Menu Stripe-Ad Fixed Di Blog
Aizzan Blog:  Membuat Menu Stripe-Ad Fixed Di Blog

Nah langsung saja sobat bisa mengikuti tutorial di bawah ini :
1. Login ke blog sobat.
2. Masuk ke "Template"
3. Backup template dulu sebelum ke edit html
4. Klik "Edit HTML"
5. Cari kode ini ]]></b:skin>, lebih cepat tekan Ctrl + F
6. Masukkan kode di bawah ini tepat di atas kode ]]></b:skin>
    /* mta bar */
#mta_bar{background:#444 url('http://1.bp.blogspot.com/-76HsPwiF8Hg/TYAaCRFd0xI/AAAAAAAAATQ/W5x8irL-O-0/s1600/wow.png') repeat-x; border-bottom:1px solid #111; z-index:100; top:0; left:0; width:100%; overflow:auto; position:fixed; margin-left:0; margin-right:0; margin-top:0; margin-bottom:4px; padding-left:0; padding-right:0; padding-top:7px; padding-bottom:4px;
z-index:10000;opacity: 0.9;filter: alpha(opacity: 90);}
* html #mta_bar{position:absolute; /*IE6 hack*/width:expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px":body.clientWidth+"px")}
#mta_bar .center{float:left; text-align:center; font-family:Verdana,Arial; font-size:13px; font-weight:bold; font-style:normal; color:#FFFFFF; width:65%}

#mta_bar .left{float:left; text-align:left; font-family:Arial; font-size:13px; font-weight:normal; font-style:normal; color:#FFFFFF; width:20%}

#mta_bar .right{font-family:verdana,Arial,Helvetica,sans-serif; float:right; text-align:center; font-weight:normal; font-size:10px; letter-spacing:0; width:30px; white-space:nowrap}

#mta_bar .right a{font-size:10px; color:#FFFFFF; text-decoration:underline}

#mta_bar .right a:hover{font-size:10px; color:#FF0080; text-decoration:none}
#left_bar a{background:url('http://1.bp.blogspot.com/_C6KkooKXCEw/TIBf3E-mUfI/AAAAAAAAGwM/EoxAFDlcdr4/s200/feed-c.png') no-repeat; font-weight:bold;text-decoration:none; color:#fff; padding-left:23px; padding-right:0; padding-top:0; padding-bottom:10px}
#left_bar a:hover{text-decoration:underline; color:#fff}
#left_bar2 a{background: url(http://2.bp.blogspot.com/_C6KkooKXCEw/TICuIqKZqRI/AAAAAAAAG0E/hfkQzQz7h20/s200/check-c.png) no-repeat 2px; text-decoration:none; font-weight:bold; color:#fff; padding-left:21px; padding-right:0; padding-top:0; padding-bottom:0px}
#left_bar2 a:hover{text-decoration:underline; color:#fff}
#left_bar3 a{background: url(http://3.bp.blogspot.com/_C6KkooKXCEw/TIBf2gtK0UI/AAAAAAAAGwE/Wml7-gPP17U/s200/facebook-c.png) no-repeat 2px; text-decoration:none; color:#fff; padding-left:21px; padding-right:0; padding-top:0; padding-bottom:0}

#to_top{background:transparent url(http://lh5.ggpht.com/_mWNaJ9OwpbA/TFQz3m9CBzI/AAAAAAAAAhU/3whudNQNZEg/delete.png) no-repeat scroll 0%; position:absolute; /*this replaces float - fixes thanks to Larry ofhttp://blog.lroot.com*/height:18px; width:19px; margin:0 0 0 900px; /*this was updated*/padding:9px 5px}

#to_top a{padding:8px}
7. Setelah itu cari kode </head>
8. Masukkan kode di bawah ini tepat di atas kode </head>
    <script src='http://sites.google.com/site/asrizalofficialweb/javascript/Stript-ad.js' type='text/javascript'/>
9. Setelah itu cari kode <body>
10. Masukkan kode di bawah ini tepat di bawah kode <body>
    <div id="mta_bar">
<div id="left_bar2">
<span class="left">
<a href='http://www.facebook.com/admin.afaniesahre' rel='nofollow' target='_blank' title='Add me as friend on Facebook'>Facebook</a>
<a href='http://twitter.com/afanieshare' rel='nofollow' target='_blank' title='Follow me on Twitter'>Twitter</a>
<a href='http://www.facebook.com/afanieshare' rel='nofollow' target='_blank' title='My Group'>Join Here !</a>
</span></div>
<div id='left_bar'>
<span class='center'><a href='http://afanieshare.blogspot.com/' rel='nofollow' target='_blank'>Gratis Berlangganan artikel via email, join sekarang! di AFanie Share </a></span></div>
<span onmouseout="self.status=''" onmouseover="self.status='asrizalwahdanwilsa';return true;" class="right"> <img onclick="closeTopAds();return false;" src="http://lh5.ggpht.com/_mWNaJ9OwpbA/TFQz3m9CBzI/AAAAAAAAAhU/3whudNQNZEg/delete.png" style="cursor:hand;cursor:pointer;" align="absmiddle" border="0" /></span></div>
Keterangan :
  • Ganti admin.afanieshare dengan username facebook sobat
  • Ganti afanieshare dengan username twitter sobat
  • Ganti afanieshare dengan funpages facebook sobat
11. Simpan template dan lihat hasilnya

Semoga artikel diatas bisa bermanfaat dan membantu, jika ada kritik maupun saran silahkan kirim melalui kolom komentar di bawah artikel ini.
Previous
Next Post »
0 Komentar