Tips, Trick dan Cara Membuat Widget Followers Google Plus Lebih Keren Dengan Buka Tutup

Widget Followers Google+ sudah menjadi widget default bawaan blogger. Widget ini menjadi ciri khas sebagian besar blog yang bernaung di baw...

Widget Followers Google+ sudah menjadi widget default bawaan blogger. Widget ini menjadi ciri khas sebagian besar blog yang bernaung di bawah Flatform blogger.com. Sedikit sentuhan menarik harus ditambahkan pada widget Google Plus, supaya pemilik blog yang belum memasang widget ini tertarik untuk memasangnya. Oleh karena itu, saya sebuah kode untuk membuat widget Google+ terlihat lebih keren yaitu dengan menambahkan fitur Slide Out. Slide Out itu yang bagaimana sih? Itu lho... Supaya

Cara Memasang Widget Google+ Slide Out

• Login ke blogger.com
• Pada menu drop down, pilih Layout (Tata Letak)
• Add a gadget dan pilih HTML/JavaScript
• Copy Paste kode berikut pada kolom yang tersedia

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<!--
$(document).ready(function() {$(".gplusbox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-330"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.gplusbox{
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-W8VTKxVCVgOs9hgFrFU8jcGKy2aWy9cnZhhRF2wqGgYqbk6Ec9eiBm-CKaH6eI4js86YFV4KcuMXAhQC4LLxZl7VL_PJpkmE9DO6lmWD7GDg-brSsoOxnSYZJPvSo1zOGak2dymbTVU/s1600/google+plus+gemar+html.png") no-repeat scroll left center transparent !important;
display: block;
float: right;
height: 330px;
padding: 0 0px 0 46px;
width: 325px;
z-index: 99999;
position:fixed;
right:-330px;
top:20%;
}
.gplusbox div{
padding: 16px;
background: white;
border: 1px solid #ff4747;
border-right: 0;
}
</style>
<div class="gplusbox"><div>
<div class="g-plus" data-action="followers" data-height="300" data-href="https://plus.google.com/108329354747256877665" data-source="blogger:blog:followers" data-width="320">
</div>
<script>
<!--
document.write(unescape("\x3C\x70\x20\x73\x74\x79\x6C\x65\x3D\x22\x64\x69\x73\x70\x6C\x61\x79\x3A\x6E\x6F\x6E\x65\x3B\x22\x3E\x57\x69\x64\x67\x65\x74\x20\x47\x6F\x6F\x67\x6C\x65\x2B\x20\x46\x6F\x6C\x6C\x6F\x77\x65\x72\x73\x20\x62\x79\x20\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x74\x75\x74\x6F\x72\x69\x61\x6C\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x2F\x22\x3E\x54\x75\x74\x6F\x72\x69\x61\x6C\x42\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x3C\x2F\x61\x3E\x3C\x2F\x70\x3E"));
//-->
</script>
<script type="text/javascript">
      (function() {
        window.___gcfg = {'lang': 'en'};
        var po = document.createElement('script');
        po.type = 'text/javascript';
        po.async = true;
        po.src = 'https://apis.google.com/js/plusone.js';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(po, s);
      })();
    </script>
</div></div>​

• Simpan widget Google Plus sobat.

Tambahan :
Silahkan ganti https://plus.google.com/108329354747256877665 dengan URL akun Google+ sobat.

sumber: tutorialblogspot