Cara Memasang Widget Google Plus Slide Out di Blog

Kalau sobat blogger belum pernah membaca postingan di atas, silahkan langsung klik link-nya, siapa tahu ada informasi menarik tentang widget pengikut Google Plus yang belum sobat blogger tahu.

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)
• Klik 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/AVvXsEipsf1pI1RF6hZtcTYZCyX8WnYj1Vua6DMQmoqzt4H3P56we2jMhQSq9FlcAvwd9Y1xmTxu0jDyKf0g-WooqLLpEGnZmQMpGu-VxQNtzQR-NdUaHNQ94QHoqdz1aejGI1140-sS6XoNh0Y/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.com