Memasang Whatsapp Sharing Button Di Blog
Seiring dengan berkembangnya zaman smartphone, dunia website pun terus berkembang dengan tampilan yang mendukung smartphone yang lebih dikenal dengan Responsive Web Design (RWD). Dengan desain yang responsive, maka kemungkinan mendapat pengunjung dengan mobile device semakin besar.Dan dengan seiring dengan semakin banyaknya pengunjung yang tiba memakai smartphone atau mobile device, maka salah satu kesempatan bagi pemilik web untuk mendapat sharing artikel di antara mobile device pun semakin meningkat.
Dan salah satu applikasi smartphone yang banyak penggunanya ialah Whatsapp, sebuah aplikasi chatting milik Facebook. Dan inilah keempatan besar untuk menyebarkan artikel di antara jutaan pengguna Whatsapp.
Untuk mendapat kesempatan besar tersebut, maka semestinya pemilik blog menyediakan tombol menyebarkan untuk Whatsapp untuk memudahkan sharing artikel ke pengguna Whatsapp lainnya.
Untuk itu ada sebuah Whatsapp Sharing Button yang patut dicoba yang dibentuk oleh http://whatsapp-sharing.com/
Dengan sedikit memodifikasinya dengan memakai javascript, hasilnya aku mencoba menciptakan kodenya biar sanggup dipakai di wordpress ataupun blogspot dan tampak ibarat ganbar di bawah ini dengan tampilan mobile.
Nah bagi yang ingin mencoba memasang Whatsapp sharing button ini di blognya baik blogspot maupun wordpress, silahkan copy isyarat di bawah ini.
<script>
//<![CDATA[
var whatsurl = window.location.href;
document.write('<a href="whatsapp://send" data-text="Take a look at this awesome website:" data-href="' + whatsurl + '" class="wa_btn wa_btn_l" style="display:none" title="Memasang Whatsapp Sharing Button Di Blog">\
Share</a>\
');
if(typeof wabtn4fg==="undefined"){wabtn4fg=1;h=document.head||document.getElementsByTagName("head")[0],s=document.createElement("script");s.type="text/javascript";s.src="http://yourjavascript.com/0015517398/whatsapp-button.js";h.appendChild(s);}
//]]>
</script>
Silahkan simpan di mana Anda ingin menampilkan tombolnya. Dan perlu diketahui, bahwa tombol Whatsapp sharing ini HANYA akan tampil jikalau dilihat memakai smartphone atau mobile device. Kaprikornus TIDAK AKAN TAMPIL jikalau dilihat memakai laptop atau komputer.
Dan alasannya ialah ini hanya akan tampil di mobile device, maka untuk pengguna blogspot akan lebih baik jikalau kodenya dihilangkan dari tampilan desktop dan hanya ditampilkan pada mobile device saja dengan memakai mobile conditional tag (untuk wordpress, aku belum menemukan mobile conditional tag) sehingga tidak mempengaruhi loading blog pada tampilan desktop.
Nah silahkan gunakan isyarat di bawah ini biar isyarat Whatsapp share button ini pun hanya tampil di mobile device dan halaman postingan saja (untuk pengguna blogspot).
<b:if cond='data:blog.isMobileRequest == "true" and data:blog.pageType == "item"'>
<script>
//<![CDATA[
var whatsurl = window.location.href;
document.write('<span style="display:block;font-size: 18px;font-weight: 500;margin-bottom:5px">Share On Whatsapp:</span>\
<a href="whatsapp://send" data-text="Take a look at this awesome website:" data-href="' + whatsurl + '" class="wa_btn wa_btn_l" style="display:none" title="Memasang Whatsapp Sharing Button Di Blog">\
Share</a>\
');
if(typeof wabtn4fg==="undefined"){wabtn4fg=1;h=document.head||document.getElementsByTagName("head")[0],s=document.createElement("script");s.type="text/javascript";s.src="http://yourjavascript.com/0015517398/whatsapp-button.js";h.appendChild(s);}
//]]>
</script>
</b:if>
Silahkan cari isyarat di bawah ini atau yang ibarat mirip di bawah ini dan silahkan simpan isyarat di atas sempurna di bawahnya untuk menampilkan tombolnya di bawah postingan.
<data:post.body/>
</b:if>
<div class='clear'/> <!-- clear for photos floats -->
</div>
Untuk membuktikannya silahkan buka halaman postingan di blog ini dengan memakai smartphone Anda, maka Anda akan menemukan Whatsapp share button di bawah Social Sharing Buttons di bawah postingan.
UPDATE:
Agar saat share ke Whatsapp otomatis memakai title postingan, silahkan gunakan isyarat di bawah ini.
<b:if cond='data:blog.isMobileRequest == "true" and data:blog.pageType == "item"'>
<script>
//<![CDATA[
var whatsurl = window.location.href;
var whattitle=encodeURIComponent(document.title);
var whattitle_esc=unescape(whattitle);
document.write('<span style="display:block;font-size: 18px;font-weight: 500;margin-bottom:5px">Share On Whatsapp:</span>\
<a href="whatsapp://send" data-text="'+whattitle_esc+'" data-href="' + whatsurl + '" class="wa_btn wa_btn_l" style="display:none" title="Memasang Whatsapp Sharing Button Di Blog">\
Share</a>\
');
if(typeof wabtn4fg==="undefined"){wabtn4fg=1;h=document.head||document.getElementsByTagName("head")[0],s=document.createElement("script");s.type="text/javascript";s.src="http://yourjavascript.com/0015517398/whatsapp-button.js";h.appendChild(s);}
//]]>
</script>Selamat mencoba... Sumber https://www.kompiajaib.com/
0 Response to "Memasang Whatsapp Sharing Button Di Blog"
Posting Komentar