Lompat ke konten Lompat ke sidebar Lompat ke footer

Cara Menciptakan Tombol Reaksi Blogger Dengan Sharethis

Cara Membuat Tombol Reaksi Blogger Dengan ShareThis - Tombol reaksi merupakan widget / fitur halaman web yang dipakai untuk mendapatkan Feedback / umpan balik dari visitor web. Dengan fitur ini "Tombol Reaksi" visitor sanggup menawarkan respon atau jawaban atau reaksi mereka terhadap konten yang sedang mereka kunjungi. Secara fisik (tampilan) tombol reaksi mempunyai banyak jenis mulai dari emoji / emoticoncheckbox dan lain sebagainya namun secara fungsi tombol reaksi ialah sama yaitu untuk mendapat feedback dari pengunjung.
Cara Membuat Tombol Reaksi Blogger Dengan ShareThis Cara Membuat Tombol Reaksi Blogger Dengan ShareThis
Cara Membuat Tombol Reaksi Blogger Dengan ShareThis
Pada tutorial ini saya akan membagikan cara menciptakan fitur feedback berupa tombol reaksi dengan style emoji atau emoticon, Dan plugin yang akan kita gunakan ialah plugin dari ShareThis (sharethis.com) alasannya penerapan-nya sangat mudah, terlepas dari itu ShareThis mempunyai paket komplit yang menyediakan widget share buttons, follow buttons, reaction buttons (tombol reaksi) content service hingga GDPR (General Data Protection Regulation).

Kaprikornus sangat efesien sekali jikalau kita memakai plugin ShareThis untuk menambah fitur-fitur website menyerupai tombol reaksi dan tombol share alasannya satu bundle javascript external sanggup dipakai untuk menginstall semua fitur (tombol reaksi, tombol share, tombol follow sosial media, konten service dan gdpr), [Lihat Demo]

Membuat Tombol Reaksi ShareThis

  1. Buat akun sharethis terlebih dahulu [Daftar Disini]
  2. Verifikasi alamat / url situs dengan cara memasang bundle javascript yang disediakan platform sharethis diatas tag </body> html situs (template blog) kemudian klik "ok" atau verifikasi.
  3. Selanjutnya pilih hidangan "Reaction Buttons" klik "on" untuk mengaktifkan tombol reaksi copy code html tombol reaksi dan pasang kedalam html situs web / blogger anda.
Catatan: Jika bundle javascript plugin sharethis tidak sanggup dipasang kedalam html / template blog anda, harap modifikasi sedikit format javascript-nya atau copy javascript dibawah ini dan ganti dengan id property sharethis anda.
<b:if cond='data:blog.pageType != &quot;index&quot;'>
<b:if cond='data:blog.pageType != &quot;archive&quot;'>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<script async='async' src='//platform-api.sharethis.com/js/sharethis.js#property=5ba53d771b076c0011d54122&amp;product=inline-share-buttons' type='text/javascript'/>
</b:if>
</b:if>
</b:if>
Simpan instruksi javascript plugin sharethis sempurna diatas instruksi epilog tag </body> pada html template blog anda.
Cara Membuat Tombol Reaksi Blogger Dengan ShareThis Cara Membuat Tombol Reaksi Blogger Dengan ShareThis
Kode verifikasi sharethis account
Selanjutnya menempatkan/ memasang instruksi html tombol reaksi ke dalam template blog
<div class='sharethis-inline-reaction-buttons'/>
Dimana posisi instruksi html tombol reaksi harus di tempatkan? Penempatan instruksi html tombol reaksi "<div class='sharethis-inline-reaction-buttons'/>" yang paling gampang ialah dibawah kode <data:post.body/>, sama menyerupai cara memasang iklan adsense dibawah artikel. Jika template blog mempunyai 3 hingga 4 kode <data:post.body/> maka tempatkan instruksi tombol reaksi dibawah kode <data:post.body/> yang ke 3 atau ke 2 atau cobalah satu persatu. Pertinjau dan refresh blog sehabis menempatkan kode.

Jika kurang puas dengan metode pemasangan tombol reaksi menyerupai diatas mari kita simak metode pemasangan instruksi html tombol reaksi berikut ini;

Memasang Kode Tombol Reaksi ShareThis

Pastikan instruksi javascript plugins sharethis sudah di pasang diatas tag </body>, selanjut-nya copy instruksi html tombol reaksi berikut ini dan letakkan dibawah kode </article> atau dibawah kode <div class='post-footer'>.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:top.showReactions'>
<div class='stlbreaction-buttons'>
<div class='sharethis-inline-reaction-buttons'/>
</div>
</b:if>
</b:if>
Catatan: Jika pada template blog terdapat dua (2) kode <div class='post-footer'> maka pasang instruksi tombol reaksi menyerupai diatas sempurna di posisi bawah kode <div class='post-footer'> yang ke 2, save template untuk mengakhiri pemasangan instruksi tombol reaksi.
Untuk menampilkan tombol reaksi-nya silahkan pergi ke Tata Letak blogger > Blog klik Edit dan centang checkbox "Tampilkan Reaksi" menyerupai pada tumpuan gambar dibawah ini.
Cara Membuat Tombol Reaksi Blogger Dengan ShareThis Cara Membuat Tombol Reaksi Blogger Dengan ShareThis
Menampilkan Tombol Reaksi Blogger
Selesai...! Tombol reaksi via sharethis telah berhasil di buat dan di install kedalam html template blogger, mungkin kau ingin sedikit sentuhan css bordir semoga tombol reaksi semakin menarik, tambahkan css ini diatas kode ]]></b:skin> jikalau diperlukan.
.stlbreaction-buttons{margin-top:10px;border:1px solid #e0e0e0;}
Demikan saja dari saya "Cara menciptakan tombol reaksi blogger dengan Plugin ShareThis" Jika tidak suka dengan tombol reaksi ini tidak perlu dihapus, cukup hilangkan centang reaksi melalui tata letak blog anda, Semoga artikel ini bermanfaat dan menambah ilmu bagi kita semua, Jangan lupa subscribe blog ini dan hingga jumpa kembali.