Menambahkan Sosial Media Share Counter diBlog

TUTORIAL MEMBUAT WIDGET SOSIAL MEDIA SHARE  DIDALAM BLOG

Selamat Datang di Blog Orang IT . Postinga saya kali ini akan share mengenai cara menambahkan widget sosial media share counter didalam artikel blog untuk menambah kualitas seo onpage blog anda , selain itu sosial media share counter memungkinkan pengunjung untuk merekomendasikan artikel blog anda diakun sosial media mereka
Widget sosial share media counter merupakan widget yang berisikan beberapa button ikon sosial media seperti facebook ,google plus , twitter , linkedin dll yang membantu visitor dalam merekomendasikan artikel yang mereka baca kedalam akun sosial media hanya dalam sekali klik saja
Di Internet banyak sekali tutorial memasang sosial media share counter didalam artikel blog tapi saya akan buat tutorial yang paling simple sehingga mudah dipraktekkan oleh orang newbie sekalipun . Kita akan memanfaatkan layanan pihak ketiga , jadi anda tinggal atur desain - ambil code - pasang ditemplate blog - selesai
Kebetulan juga template evomagz yang saya gunakan versi terakhir 4.7 akhir-akhir ini sering error seperti widget sosial sharenya berubah letak menjadi diatas, snippet artikel nya kadang hilang , ikon media sosial share tidak tampil dibeberapa perangkat dan browser sehingga ada inisiatif untuk memasang sosial share counter sendiri didalam artikel blog

Langsung saja menuju tutorial bagaimana cara memasang sosial share counter diblogspot dengan mudah :

1. Kunjungi situs pihak ketiga http://donreach.com/social-share-buttons
Cara Memasang Sosial Media Share Counter diBlog
Silahkan anda kustom sendiri mana widget sosial media yang anda gunakan , misalnya disini saya hanya menggunakan twitter, google plus dan facebook

2. Setelah itu ambil codenya , silahkan dicopy scriptnya
Cara Memasang Sosial Media Share Counter diBlog
3. Pastekan script yang dicopas tadi tepat bagian postingan dimana anda ingin widget tersebut bisa tampil , lebih tepatnya pada artikel - edit - mode html

Trik agar widget sosial media share menjadi ringan dan tidak memperngaruhi loading blog

Dari pada nanti ada yang komen apakah memasang sosial media counter tambahan didalam postingan akan membuat blog berat atau tidak ? jawabanya tentu saja akan menambah laoding blog agak berat tapi tidak berpengaruh besar secara keseluruhan ( masih dalam artian wajar )

SIlahkan coba beberapa trik berikut agar loading blog anda menjadi lebih ringan setelah memasang sosial media counter diblogspot anda:

4. Silahkan copy code HTML berikut ini
<div class="don-share" 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-hackernews"></div>
  <div class="don-share-buffer"></div>
  <div class="don-share-xing"></div>
  <div class="don-share-pocket"></div>
  <div class="don-share-fancy"></div>
  <div class="don-share-yummly"></div>
  <div class="don-share-scoopit"></div>
  <div class="don-share-weibo"></div>
  <div class="don-share-vk"></div>
  <div class="don-share-mailru"></div>
  <div class="don-share-odnoklassniki"></div>
  <div class="don-share-hatena"></div>
</div>
Itu adalah versi lengkap sosial media share karena saya hanya pasang 3 buttons jadi saya hanya memakai 3 button share
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='don-share' data-limit='3'>
  <div class='don-share-total'/>
  <div class='don-share-facebook'/>
  <div class='don-share-twitter'/>
  <div class='don-share-google'/>
</div>
    </b:if>
cari kode ini <div class="post-thumbnail"> sampai akhiran </b:if>
baru letakan kodenya itu sih bisa diatur dengan selera kalau mau diakhir artikel atau postingan letakan saja diatas widget subscribe kemudian kasih baris baru dengan kode supaya ada jarak
Cara Memasang Sosial Media Share Counter diBlog
5. Silahkan copy paste kode render javascript ini tepat pada template mode html diatas </body>

<script type='text/javascript'>

// Share Button Optimasi http://www.helmykkediri.com/

//<![CDATA[

function downloadJSAtOnload(){var d=document.createElement("script");d.src="https://cdn.rawgit.com/perampokgoogle/Flatshare/master/buttons.js",document.body.appendChild(d)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;

//]]>

</script>
6. SImpan template dan lihat hasilnya
Cara Memasang Sosial Media Share Counter diBlog

Silahkan anda cek kecepatan template sebelum dan sesudah memasang javascript render pada langkah ke 5 lima di https://developers.google.com/speed/pagespeed/insights/

Semoga bisa dipahami hehe , demikian postingan saya mengenai cara memasang widget sosia share counter diblogspot didalam postingan semoga bermanfaat jika ada yang mau menambah atau bertanya silahkan saja sekian dan terimakasih


Follow Blog Orang IT dan jangan lupa Like FansPage Helmykkediri dibawah serta jangan lupa untuk klik iklan yang ada pada Blog ini.untuk biaya perawatan admin

0 Response to "Menambahkan Sosial Media Share Counter diBlog"

Poskan Komentar

Terimakasih telah membaca artikel di Blog Orang IT aturan berkomentar yang baik dan benar :

1. Blog ini tidak memberikan backlink dikotak komentar karena sifatnya nofollow

2. Jika masih menyertakan link aktif tidak akan berefek apapun baik bagi blog anda maupun blog saya

3. Jika artikel postingan dirasa sudah expired atau outdate silahkan berkomentar minta diperbaharui atau hubungi admin melalui menu about

4. Berkomentar dengan relevan , usahakan komentar bermanfaat bagi pengunjung yang lain

5. Admin mengabaikan komentar anonimous

Terimakasih sekian jangan lupa Follow Blog Orang IT dan Like Fanspage Helmykkediri