Cara memasang widget Google Plus melayang pada blog

Blog Kang Irvan kali ini akan berbagi sedikit tutorial yang mungkin sudah banyak di share oleh blogger lainnya, yaitu bagaimana cara memasang widget google plus melayang diblog, lebih lengkapnya lihat disini. Sebelum masuk ke tema inti , saya ingin menyapa sobat semuanya, dimanapun kalian berada semoga selalu dalam keadaan sehat. dan sempat membaca artikel ini.

Baiklah untuk memulai memasang widget google plus melayang di blog, dapat anda lakukan dengan mudah asalkan dilakukan dengan teliti maka semuanya akan berjalan dengan sempurna, Ikuti langkah-langkahnya bawah:

Widget Google Plus Floating

1. Masuk ke akun Blogger Sobat.

2. Cari Kode ]]></b:skin> or </style> a

3. Letakan kode berikut tepat di atasnya

#irvandevbox {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:blue;
border:2px solid black;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#irvandevbox a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}

3. Letakan kode berikut tepat di atas </head>

<script type='text/javascript'>
$(window).bind("load", function() {
$('#irvandevbox').animate({top:"200px"}, 1000);
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>

3. Terakhir letakan kode berikut tepat di atas </body>

<div id='irvandevbox'>
<!-- HTML Start -->
<div style="text-align: center;">
<p style=" margin:10px; font-size:15px; color:#000; font-weight:bold;">Please Follow Me On Google Plus 
, Thanks.</p>
<script src="https://apis.google.com/js/platform.js" async defer></script>
<div class="g-person" data-href="https://plus.google.com/+IrvanDevIce"></div>
</div><div class='g-plusone' data-annotation='inline' data-width='300'>
<script type='text/javascript'>
  (function() {
    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>
<!-- HTML End -->
</div>
<small><div style="text-align:right; text-shadow:2px 2px 2px #adadad;"><a href="http://irvandev.blogspot.com" target="_blank" title="Get Widget">+ Get This </a></div></small><a class='close' href='http://irvandev.blogspot.com' title="Click G+, Thanks">X</a>
</div>
<div class='clear'></div>

Save Tamplete !

Demo Page

Below

Copy Link and Paste ke Browser anda
LINK : http://kontes--seo.blogspot.com/