Wednesday, March 14, 2012

Cara Memasang Google + di Blogger


Cara memasang Google + di Blogger - Google + sudah tidak asing lagi bagi kita sebuah jejaring sosial yang di hadirkan untuk menyaingi situs jejaring sosial raksasa miliki Facebook. langsung saja pada kesematan kali ini saya akan sharing bagaimana cara memasang tombol Google + di blogger 


 

Langkah memasang tombol G+ sangat mudah silahkan ikuti tutorial dibawah ini

Silahkan memasang Script dibawah ini atas Tag </body>
<!-- Tempatkan tag ini di bagian head atau tepat sebelum tag body penutup -->
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
Kemudian anda bisa memasang tombol G+ dimana saja dengan menambahkan kode dibawah ini.

<!-- Tempatkan tag ini di tempat yang Anda inginkan untuk menampilkan tombol +1 -->
<g:plusone size="small"></g:plusone>

Cara memasang tombol G+ diatas sebenarnya sudah beres namun anda juga bisa menambahkan opsi opsi di bawah ini

Tombol G+ dengan ukuran Standar
<g:plusone></g:plusone>

Tombol G+ dengan ukuran Kecil
<g:plusone size="small"></g:plusone>

Tombol G+ dengan ukuran Sedang
<g:plusone size="medium"></g:plusone>

Tombol G+ dengan ukuran Tinggi
<g:plusone size="tall"></g:plusone>

Tombol G+ Untuk HTML5
<div class="g-plusone" data-size="standard" data-count="true"></div>

Cara membuat custom tombol G+ sendiri
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
  {"parsetags": "explicit"}
</script>
<script type="text/javascript">
  function renderPlusone() {
    gapi.plusone.render("plusone-div");
  }
</script>
<body>
  <a href="#" onClick="renderPlusone();">Render the +1 button</a>
  <div id="plusone-div"></div>
</body>
 



Cara pasang Tombol Google+ disebelah Tombol Facebook
<span style='float:left; width:65px;'><!-- Place this tag where you want the +1 button to render -->
<g:plusone expr:href='data:post.url' size='medium'/>
</span>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.pjumpjhp?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:110px; height:30px;'/>
</div>

0 comments:

Post a Comment