Cara Memasang Tombol Share Whatsapp di Blogger

Deny Listianto    21 Agustus 2019

Berikut adalah cara memasang tombol share Whatsapp dan cara mengatasi jika tombol share Whatsapp tidak berfungsi di blogger. Salah satu cara memudahkan pengunjung membagikan artikel di blog adalah dengan cara memasang tombol share.

Dari beberapa tombol share mungkin tombol share Whatsapp yang cukup efektif untuk meningkatkan jumlah pengunjung blog, Karena dengan adanya pintasan ini, seorang pengunjung akan lebih mudah membagikan apa yang mereka baca ke teman chat ataupun group.

Dengan jumlah pengguna yang demikian besar, maka Whatsapp merupakan salah satu media sosial yang bisa dimanfaatkan untuk kita para blogger agar konten yang kita buat lebih mudah menyebar atau populer di media sosial.

Cara Memasang Tombol Share Whatsapp di Blogger

Berikut ada dua cara memasang tombol share whatsapp di blogger, ikuti langkah-langkah dibawah ini.

1. Cara Pertama, menggunakan javascript

Buka Blogger, lalu buka menu TEMA > Edit HTML. Setelah itu cari kode <data:post.body/> dan letakkan kode berikut ini di bawah kode tersebut.

<!-- 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;//yourjavascript.com/09010225501/whatsappblogger.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 -->

Jika sudah, klik Simpan Tema dan lihat hasilanya.

2. Cara Kedua, tidak menggunakan javascript

Buka Blogger, lalu buka menu TEMA > Edit HTML. Setelah itu cari kode <data:post.body/> dan letakkan kode berikut ini di bawah kode tersebut, atau juga bisa gabungkan dengan kode tombol share lainya.

<li class='wa-btn'><a data-action='share/whatsapp/share' expr:href='&quot;whatsapp://send?text=&quot; + data:post.title + &quot;%20%2D%20&quot; + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/> Share</a></li>

Jika sobat ingin tampilan nya lebih keren bisa tambahkan kode CSS berikut ini diatas kode
</style>

.wa-btn{color:#fff;margin:0 auto;padding:0;font-size:14px;font-weight:700}
.wa-btn a{color:#fff;margin:0 auto;padding:10px 8px;background:#2baf2b;border-radius:3px;}
.wa-btn i{font-weight:300;margin:0 5px 0 0}

Setelah itu, klik Simpan Tema dan lihat hasilanya.

Cara Mengatasi Jika Tombol Share Whatsapp Tidak Berfungsi

Tombol share whatsapp seringkali tidak berfungsi, maka berikut ini adalah cara mengatasinya :

Buka Blogger, lalu buka menu TEMA > Edit HTML, setelah itu cari kode seperti di bawah ini.

<li class='wa-btn'><a data-action='share/whatsapp/share' expr:href='&quot;whatsapp://send?text=&quot; + data:post.title + &quot;%20%2D%20&quot; + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/> Share</a></li>

Ganti kode yang saya tandai dengan kode berikut ini.

expr:href='"https://api.whatsapp.com/send?text=" + data:post.title + "%20" + data:post.url'

Sehingga hasilnya seperti berikut ini.

<li class='wa-btn'><a data-action='share/whatsapp/share' expr:href='&quot;https://api.whatsapp.com/send?text=&quot; + data:post.title + &quot;%20&quot; + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/> Share</a></li>

Dan jika sudah, klik Simpan Tema dan lihat hasilanya.

Demikian tutorial kali ini. Semoga bermanfaat dan terimakasih telah berkunjung.