Cara Menciptakan Tombol Share Whatsapp Di Drupal

Baca Juga

Pada kesempatan sebelumnya sudah di share wacana bagaimana cara menciptakan tombol share secara manual di drupal, dimana yang dipakai untuk share terdiri dari twitter, facebook dan google plus

Jika contohnya kita menginginkan adanya tombol share untuk ke WhatsApp maka Anda tinggal memakai cara sebelumnya [ Baca : Membuat Tombol Share Sosial Media di Drupal Tanpa Module ] bedanya hanya terletak pada jenis api share yang dipakai serta style/gaya untuk whatsApp, jadi hanya tinggal ditambah saja

Cara Membuat Tombol Share WhatsApp di Drupal

1. Buat instruksi css menyerupai berikut :
   

   /** Share */ .shareroot{position:relative;display:block;overflow:hidden;margin:20px 0;padding:15px 0;} .sh-title{display:block;float:left;height:30px;line-height:30px;margin:8px 15px 8px 0;padding:0} .sh-title strong{font-size:16px;display:block} .shareroot a{float:left;font-size:12px;line-height:30px;color:#fff;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;margin:8px 3px;padding:0; 10px;height:30px;min-width:30px;text-align:center;} .shareroot a:hover{background-color:#222;color:#fff;} .shareroot a i.fa{margin-right:7px;font-size:12px;} .shareroot .facebook{background-color:#003471;} .shareroot .twitter{background-color:#00BFF3;} .shareroot .googleplus{background-color:#EA4D29;} .shareroot .whatsapp{background-color:#08CB3A;} .shareroot .blackberry{background-color:#000;} .shareroot .line{background-color:#09962D;} .shareroot .pinterest{background-color:#C6393D;} .shareroot .linkedin{background-color:#0077B5;} 

2. Selanjutnya buat pemanggilnya, nanti pemanggilnya sanggup diletakan di node.tpl.php
3. Atau kalau memakai display suite, Anda sanggup menambahkannya ke layout display suite yang digunakan
4. Nanti kurang lebih kodenya menyerupai berikut
   

   <div class="shareroot"> <div class='sh-title'>  <strong>SHARE THIS</strong>  </div>  <a class="facebook" href="https://www.facebook.com/sharer.php?u=<?php global $base_root; print $base_root . $node_url; ?>" onClick="window.open(this.href, 'mywin', 'left=50,top=50,width=600,height=350,toolbar=0'); return false;"><i class="fa fa-facebook color-facebook"></i></a>  <a class="twitter" href="https://twitter.com/intent/tweet?text=<?php print $title; ?>&amp;url=<?php global $base_root; print $base_root . $node_url; ?>&amp;via=Pangandaranlife" onClick="window.open(this.href, 'mywin', 'left=50,top=50,width=600,height=350,toolbar=0'); return false;"><i class="fa fa-twitter color-twitter"></i></a>  <a class="googleplus" href="https://plus.google.com/share?url=<?php global $base_root; print $base_root . $node_url; ?>" onClick="window.open(this.href, 'mywin', 'left=50,top=50,width=600,height=350,toolbar=0'); return false;"><i class="fa fa-google-plus color-google"></i></a>  <a class="whatsapp" href="whatsapp://send?text=<?php global $base_root; print $base_root . $node_url; ?>" onClick="window.open(this.href, 'mywin', 'left=50,top=50,width=600,height=350,toolbar=0'); return false;"><i class="fa fa-whatsapp color-whatsapp"></i></a> </div> 

5. Terakhir simpan semua perubahan yang telah ditambahkan

Kurang lebih nanti kalau berhasil, tombol share akan ditampilkan menyerupai berikut ini

Untuk cara penggunaan Api share WhatsApp sanggup dilihat di :https://faq.whatsapp.com/en/android/26000030/
Ket:

<?php global $base_root; print $base_root . $node_url; ?> 

ialah instruksi untuk mendapat nilai url dari halaman aktif yang sedang diakses pengunjung.

Baca juga : Mendapatkan Judul Artikel Saat Menekan Tombol Pesan WhatsApp di Drupal