Cara Membuat Tombol Share / Bookmark pada Blog


Setelah berkeliling mencari tombol share dan bookmark untuk blog saya akhirnya saya menemukan situs yang dapat memberikan layanannya pada blog saya. Bisa kalian lihat pada saat ini tampilan pada setiap posting blog sudah tersedia tombol share yang bisa di tujukan ke berbagai macam situs seperti:


1. Facebook
2
. Twitter
3. Digg

4. Google
5. Dll.


Untuk cara memasangkan blog tersebut pada blog bisa melakukannya dengan mengikuti tahap – tahap di bawah ini:

1. Masuk ke situs www.addthis.com

2. Lalu pada tampilan di bawahnya terdapat 3 pilihan yaitu
• Select your service ( pilih sesuai jenis platform kamu )
• Select a button style ( pilih sesuai selera )
• Do you want analytics ( pilih No, just give me the button.)
• Lalu GET YOUR BUTTON

3. Pada tampilan bawah kalian akan menemukan kode seperti ini:
<!-- AddThis Button BEGIN --> <div><a expr:addthis:title='data:post.title' expr:addthis:url='data:post.url' class='addthis_button'><img src="http://s7.addthis.com/static/btn/v2/lg-share-en.gif" width="125" height="16" alt="Bookmark and Share" style="border:0"/></a> <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pub=xa-4af6b0ae7f29e982"></script></div> <!-- AddThis Button END -->

4. Lalu kalian masukan kode tersebut pada blog kamu misalnya Blogger, caranya:

5. Buka EDIT HTML

6. Klik Expand Widget Templates

7. Lalu cari kata <div class='post-footer'>. (Jika susah mencarinya gunakan saja ctrl-F lalu isi dengan kata tersebut)

8. Lalu masukan kode di atas, di bawah kata <div class='post-footer'>.

9. Dan akan terlihat seperti ini
<div class='post-footer'>.
<!-- AddThis Button BEGIN -->
<div><a expr:addthis:title='data:post.title' expr:addthis:url='data:post.url' class='addthis_button'><img src="http://s7.addthis.com/static/btn/v2/lg-share-en.gif" width="125" height="16" alt="Bookmark and Share" style="border:0"/></a>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pub=xa-4af6b0ae7f29e982"></script></div>
<!-- AddThis Button END -->

10. Lalu save dan lihat perubahan yang terjadi.

Pada kode yang saya beri tanda merah bisa kalian ubah dengan kalimat seperti <div align='center'> yang artinya tombol berada di tengah

Selamat mencoba

Post a Comment

advertise
advertise
advertise
advertise