Cara Buat/Pasang Share Buttons di Posting Blogger (Like, Tweet, +1)

Facebook Like Button & Google +1 Button, namun Tweet Button belum. Tetapi sebab banyak teman yg meminta 3 button (tombol) share itu sekaligus menjadi satu widget, baiklah deh Tweet Button saya lompati dan akan eksklusif share cara membuat & memasang ketiganya.

widget ini hanya akan ditampilkan di adegan posting saat halaman posting dibuka secara utuh serta tidak tampil pada jenis halaman lain (homepage, label, search, archive). Agar susunan, jarak serta tampilan tidak kacau, saya membuat ukuran-ukuran tersendiri pada masing-masing button lalu menyusunnya dengan tabel. So, jangan mengubah nilai apapun di dalam masing-masing button.

Sebelum memasang share buttons, perhatikan beberapa hal berikut:

a.  Jika sudah memasang widget Facebook like atau Google +1, khususnya yg saya share di blog ini, hapus atau ambil terlebih dahulu kodenya. Lihat 2 posting terdahulu untuk mengetahui mana yg harus dihapus.

b. Jika sudah pernah memasang Google+ 1 Button, tidak perlu lagi memasang script plugin API Google +1 menyerupai berikut:

<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>

c. Jika belum, pasang script plugin API Google +1 tersebut di atas </head> pada edit HTML/Edit Template.

Cara Memasang Share Buttons (Facebook Like, Tweet, & Google +1)

Setelah memastikan beberapa hal di atas, pasang widget share buttons dengan langkah-langkah berikut:

1. Copy script/kode berikut:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<table border='0'><tbody><tr>
    <td><a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="bukarahasiablog">Tweet</a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script></td>
<td><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/></td>
<td><g:plusone expr:href='data:post.url' size='medium'/></td>
</tr></tbody></table>
    </b:if>

Ganti bukarahasiablog dengan nama akun twittermu.

2. Buka halaman edit HTML/Edit Template:

Design/Layout > klik Edit HTML/Edit Template > Centang (check) "Expand Widget Templates" 

2. Jika ingin memasang di bawah judul posting:

Cari (Ctrl + F) <div class='post-header-line-1'/>, letakkan script/kode sempurna di BAWAHnya. Kalau <div class='post-header-line-1'/> tidak ketemu, cari <data:post.body/> buka diam-diam blogspot lalu letakkan script/kode sempurna di ATASnya.

3. Jika ingin memasang di bawah posting/artikel:

Cari (Ctrl + F) <data:post.body/> lalu letakkan script/kode sempurna di BAWAHnya.

4. Save template 'n lihat hasilnya.

5. Done.

Good luck n enjoy your blog's share buttons (Facebook Like, Tweet Button, & Google +1 Button).

mencuri ialah pekerjaan pengecut! © buka-rahasia.blogspot.com

Tweet

Subscribe to receive free email updates: