Cara Memasang Sosial Share Button Dengan Counter Dibawah Postingan
Tombol berbagi atau share button adalah widget yang berguna untuk memudahkan dalam berbagi artikel. Share button ini biasanya terhubung dengan media sosial yang digunakan untuk media dalam membagikan artikel.
Share button yang bagikan ini bisa tampil di semua device,alias responsive. Sehingga anda tidak perlu mencari tutorial membuat share button lain khusus untuk mobile. Bukan hanya responsive ,share button ini juga dilengkapi dengan counter/penghitung. Counter ini akan menghitung berapa kali artikel yang sudah di share jadi anda bisa tahu jumlah share yang ada.
Berikut penampakan share button yang akan saya bagikan.👇👇👇
Bagaimana? Tertarik untuk membuat share buttonnya,langsung saja berikut langkah-langkah :
Membuat Share Button dengan Counter
1. Buka blogger ,Template ➞ Edit HTML
2. Salin kode berikut lalu letakkan diatas kode </body>
<script src="http://share.donreach.com/buttons.js"></script>
3. Salin kode berikut dan letakkan dimana share button ingin ditampilkan. Biasanya ditampilkan dibawah artikel jadi letakkan kode <data:post.body/>
Karena kode <data:post.body/> bisa anda temukan lebih dari satu ditemplate blog,oleh sebab itu maka silakan pilih kode <data:post.body/> yang paling akhir anda temukan atau coba cocokan satu per satu.
<div class="don-share" data-bubbles="right" data-limit="3">
<div class="don-share-total"></div>
<div class="don-share-facebook"></div>
<div class="don-share-twitter"></div>
<div class="don-share-google"></div>
<div class="don-share-linkedin"></div>
<div class="don-share-pinterest"></div>
<div class="don-share-tumblr"></div>
<div class="don-share-stumbleupon"></div>
<div class="don-share-reddit"></div>
<div class="don-share-buffer"></div>
<div class="don-share-xing"></div>
<div class="don-share-pocket"></div>
</div>
<script type="text/javascript">
(function() {
var dr = document.createElement('script');
dr.type = 'text/javascript'; dr.async = true;
dr.src = '//share.donreach.com/buttons.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dr);
})();
</script>
Lalu simpan template.
Selesai share button sudah dipasang di blog sobat. Ganti kode yang berwarna merah dengan jumlah sosial media yang ingin anda tampilkan. Itulah tutorial cara membuat share button responsive dengan counter,semoga bermanfaat.
Related Posts :
Cara Menonaktifkan/Mematikan Link Aktif Di Komentar BloggerMungkin kalian kesal jika ada link aktif atau hidup di komentar blog anda tanpa seijin pemiliknya. Memang dengan adanya link aktif tersebut … [Read More]
Memasang Script Anti Adblock Opera Mini Redirect Chrome - Adblock OperaPendapatan turun? Sedih rasanya sebagai publisher tapi tidak mendapatkan penghasilan apa-apa. Karena banyaknya pengguna/pembaca yang menggun… [Read More]
Cara Memasang Widget Terjemahan (Google Translate) Keren Di BloggerMemiliki visitor dari luar dan berbeda bahasa mungkin sangatlah menguntungkan,namun karena beda bahasa tersebut maka membuat mereka tidak bi… [Read More]
Cara Membuat Link Hidup/Aktif Di Komentar -Teknik SEO Black HatPernah melihat link didalam komentar? Biasanya link yang ada dikomentar akan masuk kedalam daftar spam. Tapi tidak semua masuk daftar spam k… [Read More]
Script UC Browser Redirect Google Chrome - Pengalihan Browser Anti AdblockMungkin anda sudah mencari-cari script kode yang satu ini. Memang script ini sudah cukup populer digunakan di blog besar. Yang tentunya memi… [Read More]
Ijin coba
ReplyDeleteSilakan dicoba gan
DeleteMenarik sekali gan... Saya sedang mencoba mengkoleksi beberapa widget share semacam ini..baik tombol share yg berada di bawah artikel, diatas artikel..melayang dikiri atau kanan...dan tentunya dengan style yg berbeda beda....ijin bookmark deh..lain kali klo ada waktu mungkin mampir lagi...
ReplyDeleteSilakan di bookmark mas
DeleteBoleh juga nih gan kebetulan saya juga lgi nyari share button yg reaponsive ijin comot gan
ReplyDeleteLangsung silakan dicomot gan
DeleteKok sekarang gak fungsi ya gan
ReplyDeleteMasih work kok,ini saya pakai untuk blog ini tapi versi mobile
DeleteTapi yang ini gak ada counternya ya Bos...?
ReplyDeleteada gan,sesuai judul dengan counter
Delete