Cara Memasang floating sticky footer bar di blogspot

cara memasang floating sticky footer bar di blogspot

* buka blog mu
* pilih template >>> edit HTML
* cari kode ]]></b:skin>
* copy kode dibawah dan letakkan diatas kode ]]></b:skin>

#MBL-footer-bar {
    position: fixed;
    bottom: 0;
    z-index: 100;
    width: 100%;
    height: 38px;
    clear: both;
    margin: 0;
    padding-bottom: 4px;
    background-color: #333;
    overflow: hidden;
}

#MBL-footer-bar a {
    float: right;
    margin: 0;
    padding: 0;
    background-color: #333;
}

#MBL-footer-bar a.first {
    float: left;
    margin-top: -1px;
}

.MBL-footer-wrapper {
    max-width: 92%;
    width: 960px;
    margin: 0 auto;
}
 .MBL-footer-wrapper {
        width: 100%;
        padding: 10 10%;
    }
   
@media only screen and (max-width : 649px), 
only screen and (min-device-width : 320px) and (max-device-width : 685px) {
 
#MBL-footer-bar {
        position: static;
    }

.MBL-footer-wrapper {
        width: 90%;
        padding: 0 5%;
    }}
  
#tips, #tips li{margin:0; padding:8px; list-style:none; }

#tips{width: 100%; font-size:22px; line-height:120%; font-family: Arial, Helvetica, sans-serif; vertical-align:middle; margin: -2px 0 0; opacity: 0.95; font-weight: bold; }

#tips li{padding: 0px 0; display:none; float:left;  }

#tips li a{color: #fff;  }

#tips li a:hover{text-decoration: none; }

* kemudian cari kode </head>
* copy kode lagi dan letakkan diatas kode </head>

<script>$('#MBL-footer-bar').hide();$(function(){$(window).scroll(function(){if($(this).scrollTop()>600){$('#MBL-footer-bar').slideDown(200)}else{$('#MBL-footer-bar').slideUp(200)}});$('.go-top').click(function(){$('html,body').animate({scrollTop:0},1000);return false})});</script>
<script>var _gaq=_gaq||[];_gaq.push(['_setAccount','UA-20868082-3']);_gaq.push(['_trackPageview']);(function(){var ga=document.createElement('script');ga.type='text/javascript'ga.async=true;ga.src=('https:'==document.location.protocol?'https:var s=document.getElementsByTagName('script')[0];s.parentNode.insertBefore(ga,s)})();</script>
<script type="text/javascript">
if (window.jstiming) window.jstiming.load.tick('widgetJsBefore');
</script>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=1.7.2' type='text/javascript'/>

<script src='https://mybloggerlab.googlecode.com/files/main.js' type='text/javascript'/>

* cari lagi kode </body>
* copy kode lagi dan letakkan diatas kode </body>

<header class='cf' id='page-header'/>
<div id='MBL-footer-bar'>
<div class='MBL-footer-wrapper'>
<a class='go-top first' href='#page-header'><img alt='Back To Top' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx6OMZeXM9Aphzt_x2hbmVMwLBnmFyEVL9BqFEAJ3KYMAhgx8Vy0kXSqhcDUbwI2X2RXSYMRDuSm0moK3UIfxUhr9IMkkHXjAfKhUfXNZwgvN7pDbOdFl3iGDfnzeIWWRsfAuYunEO6A4/s1600/UP.png'/></a>

<a href='https://plus.google.com/' target='_blank' title='Follow On Google+'><img alt='google+ page' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgJRKme3TAYpb3_RtlZzAIG42egjse24-VafWPwhJBbY_74tnEJZJ09iSUUdjFldiuXku7LdBGZ4LzRBy6wmN4gQQfhlNHJpeoq-2EWOYr51ztg8Sa49xCqtigP1xWIBkssspskFl0tD77/s1600/GooglePlus.png'/></a>

<a href='http://www.facebook.com/' target='_blank' title='Follow On Facebook'><img alt='facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBYeuuW7SU-fKIiitwPPyDCthHD_3L1RFujKbdrgMn-wnQfcdn6UQIQ7Ec1ZqBquE7BWJiaZMr7yrfdLpoSzAM3v67riZ7hMHzXpxCwX-uhsNr7yDTsaYmLITafU2InNgS884gPoQpHid6/s1600/FB.png'/></a>

<a href='http://twitter.com/' target='_blank' title='Follow Us'><img alt='twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRiepapY1QBWC13rKEqB04cAYWna5xqYduNuOGMAw0Wj3gYR-3aJpbuNtaI7jxpbO4SDul1gQ32Ccfc6qDuh3ul615v5k7PQcQ0AtriO_lvup30xHLOzgJa9ndRuo2oxZdc529FTsOrsfR/s1600/Twitter.pngg'/></a>

<a href='http://feeds.feedburner.com/' title='Get Updates'><img alt='rss' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3z44UXflgWuN9cD8VHMzg1BTmdQR9nlWywjitTTj99LjSj5dMlcFc6Ltfxzhs7gnSDNAn5XXZOs2jwPxR4dPIBWifMu_d2t6OZxyubb3ezegCXBvknl8vSfogrdXowpEgvJuubsi6gBzW/s1600/RSS.png'/></a>


<div class='boxfloat'>
<ul id='tips'>
<li><a href='#'>MyBloggerLab is the First Item</a></li>

<li><a href='#'>Blogger.com is the Second Item</a></li>

<li><a href='#'>This Is Third Item</a></li>

<li><a href='#'>This Is Forth Item</a></li>

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

</div>

# catatan #
Ganti warna merah dengan url sosmed mu

[ silahkan di save ]

*** GOOD LUCK GUYS ***

QUEEN TRICK BLOG

Cara Memasang floating sticky footer bar di blogspot

Entri Populer

Label