Cara Membuat Share Button [Facebook,Twitter,Google+] Untuk Mobile
Kali ini kita akan membuat share button. Padahal kemarin kita sudah membuat share button yang tak kalah bagusnya. Tapi tidak masalah mungkin yang kemarin kurang bagus,jadi buat yng baru.Share button ini sebenarnya hampir mirip seperti share button yang saya bagikan kemarin yang membedakan adalah share button ini lebih ringan dan lebih kecil serta ramah SEO.
Yang pastinya share button ini tidak akan berpengaruh terhadap kecepatan loading blog sobat. Jika loading blog anda cepat maka setelah memasang share button ini loading blog akan masih akan tetap cepat. Jika loading blog anda lambat maka setelah memasang share button ini akan tetap lambat. 😄
Share button ini berukuran mini serta support untuk mobile device. Jadi jangan khawatir jika pengunjung anda kebanyakan menggunakan mobile,mereka maih bisa membagikan artikel anda. Untuk lebih lengkapnya,berikut Fitur yang terdapat dalam share button ini :
- Responsive
- Seo Friendly
- + ada counternya
- dll.
Cara Membuat Share Button Sederhana dan Seo Friendly
#1. Buka blogger ,Template ➞ Edit HTML
#2. Salin kode berikut lalu pastekan diatas kode </body>
<script src="http://share.donreach.com/buttons.js"></script>
#3. Salin kode berikut dan pastekan 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-vk"></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>
Ganti kode yang berwarna merah dengan jumlah ikon sosial media yang ingin anda tampilkan.
Lalu simpan template.
Sekarang coba anda buka blog sobat lalu lihat hasilnya. Gimana keren dan sederhana buka. Itulah tutorial yang bisa saya bagikan. Semoga membantu dan bermanfaat.
Related Posts :
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]
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]
Membuat Menu Navigasi Show & Hide Responsive Dropdown - Simple dan KerenMenu navigasi sangat penting untuk blog anda. Untuk membantu memudahkan pengunjung mencari artikel yang mereka inginkan. Selain itu tanpa me… [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]
Wah menarik infonya. Bisa diterapkan sewaktu-waktu di blog saya
ReplyDeleteHehe, bagus nih artikel.
ReplyDeleteTapi lagi males ngoprek template nih mungkun bookmark dulu ahh
Makasih ilmunya gan
ReplyDeleteSama-sama,makasih juga atas kunjungannya
DeleteMakasih gan artikelnya bermanfaat apalagi punya saya belum di pasang kayak gitu....
ReplyDeleteSama-sama mas
DeleteMantap infonya gan.. nanti saya terapin di blog baru..
ReplyDelete