Cara Membuat Widget Vote +1 Google Plus Melayang

Cara Membuat Widget Vote +1 Google Plus Melayang - Oke karena ada yang request script widget Vote +1 recomendation google plus seperti yang ada di blog ini maka akan saya bagikan script nya :D

Cara Membuat Widget Vote +1 Google Plus Melayang


Bagaimana cara membuat widget +1 google plus melayang? Ikuti langkah-langkah berikut:

1. Masuk ke akun Blogger Sobat
2. Pilih tataletak, tambah gadget
3. Selanjutnya pilih HTML/JavaScript
4. Lalu copas kode script di bawah ini:

<div class='clear'></div>
<div class='widget HTML' id='HTML6'>
<div class='widget-content'>
<style type="text/css" scoped="">
/* Message Box */
#box-message {
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 blue;
-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;
}
#box-message 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;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"200px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id="box-message" style="top: 200px;">
<!-- HTML Start -->

<div style="text-align: center;">
<p style=" margin:10px; font-size:15px; color:#000; font-weight:bold;">Bantu saya untuk vote +1 pada tombol Google Plus dibawah!.</p>
<div style="background: url(https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash3/t1/12385_593585634050969_1323366192_n.jpg)no-repeat top left; width:283px; height:115px; padding-top:32px; text-align:left; padding-left:18px; margin-top:20px">
<div id="___plusone_0" style="text-indent: 0px; margin: 0px; padding: 0px; background-color: transparent; border-style: none; float: none; line-height: normal; font-size: 1px; vertical-align: baseline; display: inline-block; width: 300px; height: 24px; background-position: initial initial; background-repeat: initial initial;"><iframe frameborder="0" hspace="0" marginheight="0" marginwidth="0" scrolling="no" style="position: static; top: 0px; width: 300px; margin: 0px; border-style: none; left: 0px; visibility: visible; height: 24px;" tabindex="0" vspace="0" width="100%" id="I1_1391821566693" name="I1_1391821566693" src="https://apis.google.com/_/+1/fastbutton?usegapi=1&bsv=o&annotation=inline&width=300&hl=en&origin=http://komputer-techno.blogspot.com&url=http://komputer-techno.blogspot.com%2F&gsrc=3p&ic=1&jsh=m%3B%2F_%2Fscs%2Fapps-static%2F_%2Fjs%2Fk%3Doz.gapi.id.mPsQK3fMOE0.O%2Fm%3D__features__%2Fam%3DIQ%2Frt%3Dj%2Fd%3D1%2Ft%3Dzcms%2Frs%3DAItRSTNEkgLPflVtuAtvYGKMIDncoJHCjg#_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe%2C_renderstart%2Concircled%2Cdrefresh%2Cerefresh%2Conload&id=I1_1391821566693&parent=http://komputer-techno.blogspot.com&pfname=&rpctoken=15696089" data-gapiattached="true" title="+1"></iframe></div>
<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>
</div>

<!-- HTML End -->
</div><a class="close" href="#">&#215;</a></div></div></div>

5. Kemudian ubah tulisan berwarna merah menjadi blog/website anda.
6. Terakhir Simpan dan Selamat anda mempunyai Widget Vote +1 Google Plus melayang :D

Sekian dulu posting gue mengenai Cara Membuat Widget Vote +1 Google Plus Melayang semoga bermanfaat bagi para blogger.

13 Responses to "Cara Membuat Widget Vote +1 Google Plus Melayang"

Komentar yang mengandung "Link Aktif, Out Of Topic, Tidak Sopan, Berkata Kasar" akan saya hapus untuk menghindari SPAM.

Ingat! Budayakan membaca sebelum berkomentar.