03 Juli 2011

Pin It

Memasang Tombol Google +1 di Blogspot

membuat tombol google +1 pada blogspot | khamardos blog
Pada artikel sebelumnya saya sudah memposting tentang google +1 (baca : Tentang Google +1). Untuk postingan kali ini saya akan membahas tentang bagaimana cara memasang tombol google +1 di blog kita.

Pembuatan Dengan Template Default Blogger
Untuk template blogger yang default atau secara official merupakan bawaan blogger, fitur ini dapat dibuat dengan mudah melalui halaman page elements/edit gadget, karena fitur ini sudah secara resmi ditambahkan ke Blogger. Perhatikan gambar berikut :

membuat tombol google +1 pada blogspot | khamardos blog

Tombol +1 Google dapat dengan mudah ditampilkan dengan mencentang "Show Share Button". Masuk ke dashboard > design/rancangan > kemudian klik "edit post " di bagian badan template dan akan tampil pop up window seperti gambar di atas.


Namun, bagi template yang sudah dimodifikasi dan bukan default template, fitur "share button" biasanya telah dihapus. Oleh karena itu diperlukan editing template HTML untuk menambahkan fitur/tombol +1 Google tersebut.
Secara default, ada 3 jenis button atau tombol Google +1:
Standard
Medium
Small

1. Masuk ke dashboard > design/rancangan > edit HTML > jangan lupa beri ceklis pada  "expand widget templates"
2. Copy kode berikut dan paste tepat SEBELUM </head>
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>

3. Copy kode berikut:
<!-- Google +1 Button  -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='post-share-buttons' style='float:right;padding:4px;'>
<g:plusone size="standard"></g:plusone>
</div>
</b:if>



a. Ganti standard dengan medium atau small jika ingin mengubah ukuran tampilan button/tombol seperti contoh di atas.
b. Ganti right dengan left jika ingin button/tombol berada di sisi kiri.
c. Kode berwarna biru akan menampilkan tombol hanya ketika halaman posting dibuka. Jika anda menggunakan auto readmore, maka tombol tersebut tidak akan muncul di post summary, sehingga tampilan post summary tidak akan rusak.  Jika anda tidak menggunakan auto readmore atau menggunakan readmore tapi tetap ingin menampilkannya di post summary, hapus kode biru tersebut.


Cara Memasang Google +1 Button (Perbaikan cara diatas):
>> Karena banyaknya permasalahan ketika memasang tombol Google +1, kode yang harus dicari saya ubah untuk memudahkan pemasangan (meskipun sebenarnya sama saja, hanya untuk memudahkan pencarian)

4. Jika ingin memasang button di bagian bawah posting, cari <div class='post-header-line-1'/> (gunakan Ctrl+F) dan paste kode tersebut tepat di BAWAH-nya. Jika kode tersebut tidak ketemu, letakkan kode di ATAS <data:post.body/>.
5. Jika ingin memasang button di bagian bawah posting, cari  <data:post.body/> (gunakan Ctrl+F) dan paste kode tersebut tepat di BAWAH-nya.
6. Save Template.

Pembuatan dengan Webmaster Google
Ini mungkin cara yang lebih simpel dan praktis. Silahkan anda kunjungi alamat : Google +1 Tools
Lalu akan muncul seperti gambar dibawah :
(Silahkan setting sesuai selera anda)

Lalu Masuk ke dashboard > design/rancangan (anda bisa meletakkan kode tersebut di bagian widget atau Edit HTML)

Sumber :

.:: SELAMAT BERKREASI SOBAT ::.
Share To lintasberita.com | Khamardos Blog

Bagikan Jika Artikel ini menarik, Diharapkan agar memberikannya kepada teman2 anda di Facebook

Artikel Lainnya :

8 comments:

Klik Untuk Lihat Komentar

darana-xp on 8 Juli 2011 11.27 mengatakan...

Izin Praktek Sob,hhe ,mampir Sob ke blog saya

Rachmad a.k.a Gorengan on 11 Juli 2011 11.58 mengatakan...

gagal lagi...coba terus..nice tips kang

Tablet Android Honeycomb Terbaik Murah on 28 Juli 2011 08.21 mengatakan...

ane cb gan moga berhasil..n saling tuker google 1+ bisa naikin trafik n pr lho

rumput dan ilalang on 2 Agustus 2011 15.11 mengatakan...

mantap dah infonya sob

NgeBlog DOFOLLOW Di_Hp on 15 Agustus 2011 15.07 mengatakan...

Tanks,bisa dicoba ! Tp nanti nunggu bisa ke warnet dulu !,maklum moadal hp . dulu !,maklum moadal hp .

willya randika on 24 Agustus 2011 17.24 mengatakan...

wah yang ini juga saya butuhkan di blog saya. thanks man awesome !

out-this genk on 24 Agustus 2011 21.43 mengatakan...

terimakasih ya gan infonya...
sangat berguna bgt buat ane yang newbie didunia blogger gan...
numpang promo ya gan

http://outthisgenk.blogspot.com

khalid on 7 November 2011 17.04 mengatakan...

udah berhasil di pasang di blog ane,, tp button nya muncul 2.. gimana tuh mas biar munculnya satu aja.

:: Komentar Anda ::

Silahkan isi Komentar anda pada Form Komentar dibawah ini !!!
Kritik dan Saran yang membangun sangat saya harapkan dari sobat semua !!!

NO SPAM PLEASE !!!

Senyum :)) tunggu :)] centil ;)) kedip ;;) unjuk gigi :D hai ;) week - Jelek :p menangis :((
smile :) gawat :( Love - cinta :X briken love - patah hati =(( ooo - ounght :-o bingung :-/ kiss - cium :-* nothing :|
Gila - stres 8-} pusing ~x( takut :-t tenju - pukul b-( marah :-L marah kali x( sangat lucu =))

[[ Form Komentar Klasik ]]

Jika Anda Ingin Berlangganan Artikel Dari Situs Ini,
Silahkan Ketik Email Anda Pada Form Di Bawah Ini :

 
Copyright © 2009 Black Nero is Designed by Ipietoon | Tweaking by Mufied