Cara Menciptakan Tombol Share Whatsapp Di Drupal
Pada peluang sebelumnya sudah di share wacana bagaimana cara membuat 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 spesialuntuk terletak pada jenis api share yang dipakai serta style/gaya untuk whatsApp, jadi spesialuntuk tinggal ditambah saja
Teknik Membuat Tombol Share WhatsApp di Drupal
- Buat isyarat css menyerupai diberikut :
/** 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;}
- Selanjutnya buat pemanggilnya, nanti pemanggilnya sanggup diletakan di node.tpl.php
- Atau bila memakai display suite, Anda sanggup menambahkannya ke layout display suite yang digunakan
- Nanti kurang lebih kodenya menyerupai diberikut
<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; ?>&url=<?php global $base_root; print $base_root . $node_url; ?>&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>
- Terakhir simpan tiruana perubahan yang sudah dimenambahkan
Kurang lebih nanti bila berhasil, tombol share akan ditampilkan menyerupai diberikut ini
Untuk cara penerapan Api share WhatsApp sanggup dilihat di :https://faq.whatsapp.com/en/android/26000030/
Ket:
<?php global $base_root; print $base_root . $node_url; ?>
yaitu isyarat untuk mendapat nilai url dari halaman aktif yang sedang diakses pengunjung.Baca juga : Mendapatkan Judul Artikel Saat Menekan Tombol Pesan WhatsApp di Drupal
Post a Comment for "Cara Menciptakan Tombol Share Whatsapp Di Drupal"