Google Plus Badge Adalah salah satu sarana untuk mendapatkan para pengunjung blog secara tetap, dengan memasang Google Plus Badge maka kita akan memperbolehkan pengunjung untuk mengikuti blog kita melalu Akun Google Plus mereka, dan mengetahui berbagai aktifitas blog kita seperti ada postingan terbaru dan lain sebagainya.
Kali ini Oto Website akan berbagi cara tentag bagaimana cara membuat atau memasang Google Plus Badge di blogger! Karna cara untuk membuat atau memasang Google Plus Badge di blogger sangatlah mudah jadi kita akan mengganti topiknya menjadi "Google Plus Badge Auto Hide".
Bagi Anda (Admin) blogger/website yang merasa kekurangan atau kehabisan tempat widget di blog/web-nya maka dengan memasang  Google Plus Badge Auto Hide akan sedikit membantu Anda karna dengan memasang Google Plus Badge Auto Hide Anda tidak perlu memberikan tempa widget pada badge ini, di karenakan badge ini akan melayang di sisi kanan blog/situs Anda.
Cara kerjanya sendiri sama dengan  Facebook Like Auto Hide. Yaitu badge ini akan muncul ketikan menyentuh cursor dan menutup ketikan cursor tidak menyentuhnya.


ScreenShot



Cara Membuat dan Memasang

Jika Anda ingin menggunakan Google Plus Badge Auto Hide maka sebelumnya Anda harus sudah memiliki Akun Google Plus. Jika belum silahkan baca caranya disini.
Untuk Cara Membuat dan Memasangnya di Blogger silahkan Anda ikuti langkah-langkah berikut ini:

1. Pergi ke Dasbor Blogger Anda.
2. Pilih Template >> Edit HTML.
3. Temukan tag <head>
4. Lalu letakkan scrip berikut di atasnya:



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://code-otowebsite.googlecode.com/svn/trunk/gplusone.js"></script>

5. Simpan Template Anda.

6. Pilih Tata Letak >> Tambah Gadget >> Pilih elemen HTML/JavaScript.

7. Sekarang letakkan JavaScript berikut ke dalam elemen tadi.

<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function() {jQuery(".OW-gplus").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});
/*]]>*/
</script>
<style type="text/css">
.OW-gplus{background: url("https://code-otowebsite.googlecode.com/svn/trunk/gplus.png") no-repeat scroll left top transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 65px;width: 246px;z-index: 99999;position:fixed;right:-250px;top:44%;}
.OW-gplus div{border:none;position:relative;display:block;}
</style>
<div class="OW-gplus" style="">
    <div>

<!-- Start Google Plus Badge Auto Hide by @otowebsite -->
<div class="g-plus" data-href="//plus.google.com/115780777398536909642" data-rel="publisher">
<!-- End Google Plus Badge Auto Hide by @otowebsite -->

</div>
</div>
</div>

Keterangan : Ganti teks yang di blok merah dengan ID Google Plus Anda.

8. Simpan.

Sekarang Anda dapat melihat Google Plus Badge Auto Hide ini melayang di sisi kanan blog/web Anda.


Dari Meja Editor

Sekian untuk tutorial Google Plus Badge Auto Hide, Semoga tutorial yang Saya bagiakan kali ini dapat bermanfaat untuk Anda semua. Bila Anda menglami masalah atau pertanyaan tentang tutorial kali ini, silahkan Ajukan pertanyaaan Anda melalui komentar.

Poskan Komentar Blogger Disqus

  1. pakek metode ajax API saja, biar efisien ke depannya :)

    BalasHapus
  2. sepertinya saya sudah pasang ya :-)

    BalasHapus
  3. Nahh ini yang saya cari trims ya mas langsung saya coba.

    BalasHapus
  4. Nahh ini yang saya cari trims ya mas langsung saya coba.

    BalasHapus
Catatan:
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA...</i>
Kode yang panjang bisa menggunakan tag <i rel="pre">KODE PANJANG ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Penting:
Jika Anda mengajukan pertanyaan klik 'Subscribe by email' link di bawah form komentar untuk mengetahui komentar balasan.

Khusus untuk membalas komentar disarankan menggunakan tombol balas/reply di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur.

Dilarang Meninggalkan Link Aktif, Link Aktif Terpaksa Akan Saya Hapus Dari Komentar.

NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".

Konversi Kode di Sini! Daftar Member Aktif

 
Top