Cara Membuat Widget Followers Google Plus Lebih Keren Dengan Buka Tutup By Pkl Tukka

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



google+followers+widget

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/AVvXsEjQ2FD_eIv6S3XYGg7jRO4wLIIOfwJeankOZvZ__mNvXbJd_PqFNjBCzvsMGZRj-ECeW-4eoaBUR56umttp68As1G0DsCdtoVyHcaTW10aUPWjkOyJhZHFBmlVHmY9axNCC7IUXo8Fm-B8/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/105796660212987183084" 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/105796660212987183084 dengan URL akun Google+ sobat.

0 Komentar

  • Menulis kode gunakan kode (kode harus di-parse)
  • Menulis dalam syntax highlighter gunakan kode panjang (kode harus di-parse)
  • Menyisipkan gambar gunakan URL GAMBAR (ekstensi .jpg, .png, .gif, .webp, .ico)
  • Centang Beri Tahu Saya untuk mendapatkan notifikasi ke email saat ada yang membalas komentar.