Cara Menambahkan WhatsApp Share Button di Blog

WhatsApp merupakan aplikasi pesan singkat yang paling popular saat ini, saking popularnya pengguna WhatsApp melebihi pengguna BBM. Bila kita jeli memanfaatkan WhatsApp sebagai sumber visitor harus membagikan link artikel di WhatsApp. Daripada Anda repot-repot menyalin URL artikel blog dan dipaste di WhatsApp sebaiknya gunakan WhatsApp Share Button.

Karena WhatsApp merupakan aplikasi mobile maka share buttonnya dibuat tampil di mode mobile. Kalau mode dekstop/ PC percuma karena WhatsApp tidak bisa share artikel ke teman Anda. Tutorial ini khusus bagi pengguna platform Blogger.

Penggunaan WhatsApp Share Button ini sering dijumpai di situs-situs besar. Tujuannya supaya pembaca mudah membagikan artikel melalui pesan WhatsApp. Akhirnya cara ini diaplikasikan di Blogger. Baiklah berikut ini cara menambahkan WhatsApp Share Button di Blog.

#. Cara Menambahkan WhatsApp Share Button di Blog (Cara Pertama)
1. Template > Edit HTML
2. Temukan kode tombol share yang sudah ada sebelumnya (Facebook, Twitter, dll)
3. Copas dan tambahkan salah satu kode berikut ini di jajaran kode tersebut

Kode WhatsApp Share Button 1

<b:if cond='data:blog.isMobileRequest == &quot;true&quot; and data:blog.pageType == &quot;item&quot;'>
<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="Share On Whatsapp">\
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>

Kode  WhatsApp Share Button 2

<!-- Whatsapp Share Buttons Start -->
<script type='text/javascript'>if(typeof wabtn4fg===&quot;undefined&quot;){wabtn4fg=1;h=document.head||document.getElementsByTagName(&quot;head&quot;)[0],s=document.createElement(&quot;script&quot;);s.type=&quot;text/javascript&quot;;s.src=&quot;https://googledrive.com/host/0BwMMDqbfGy7Od3UtLTRJcncwQ1U&quot;;h.appendChild(s);}</script>
<a class='wa_btn wa_btn_s' expr:data-href='data:post.url' expr:data-text='data:post.title' href='whatsapp://send' style='display:none'>Share</a>
<!-- Whatsapp Share Buttons End -->

Kode  WhatsApp Share Button 3

<!-- Whatsapp Share Buttons Start -->
<script type='text/javascript'>if(typeof wabtn4fg===&quot;undefined&quot;){wabtn4fg=1;h=document.head||document.getElementsByTagName(&quot;head&quot;)[0],s=document.createElement(&quot;script&quot;);s.type=&quot;text/javascript&quot;;s.src=&quot;https://dl.dropboxusercontent.com/u/7330191/whatsapp-sharing.js&quot;;h.appendChild(s);}</script>
<a class='wa_btn wa_btn_s' expr:data-href='data:post.url' expr:data-text='data:post.title' href='whatsapp://send' style='display:none'>Share</a>
<!-- Whatsapp Share Buttons End -->

4. Save Template!
5. Buka blog Anda di HP untuk melihat hasilnya.

#. Cara Menambahkan WhatsApp Share Button di Blog (Cara Kedua)
1. Template > Edit HTML
2. Copas kode berikut ini di atas kode </body>

<script type='text/javascript'>if(typeof wabtn4fg===&quot;undefined&quot;){wabtn4fg=1;h=document.head||document.getElementsByTagName(&quot;head&quot;)[0],s=document.createElement(&quot;script&quot;);s.type=&quot;text/javascript&quot;;s.src=&quot;//yourjavascript.com/09010225501/whatsappblogger.js&quot;;h.appendChild(s);}</script>

3. Copas kode berikut ini ke jajaran kode Social Share sebelumnya yang sudah ada (Facebook, Twitter, dll)

<a class='wa_btn wa_btn_s' expr:data-href='data:post.url' expr:data-text='data:post.title' href='whatsapp://send' style='display:none'>Share</a>

4. Save Template
5. Lihat hasilnya di HP.

Catatan: WhatsApp Share Button hanya bisa dilihat di HP/ Smartphone