Whatsapp share button

index.html

<a alt="Whatsapp" href="whatsapp://send" data-text="Text to share" data-href="http://example.com/url-to-share" class="whatsapp wa_btn"><span class="ion-social-whatsapp"></span> Whatsapp</a>

javascript.js

waShBtn = function() {
  if( this.isIos === true ) {
    var b = [].slice.call( document.querySelectorAll(".wa_btn") );
    for (var i = 0; i < b.length; i++) {
      var t = b[i].getAttribute("data-text");
      var u = b[i].getAttribute("data-href");
      var o = b[i].getAttribute("href");
      var at = "?text=" + encodeURIComponent( t );
      if (t) {
          at += "%20%0A";
      }
      if (u) {
          at += encodeURIComponent( u );
      } else {
          at += encodeURIComponent( document.URL );
      }
      b[i].setAttribute("href", o + at);
      b[i].setAttribute("target", "_top");
      b[i].setAttribute("target", "_top");
      b[i].className += ' activeWhatsapp';
    }
  }
}

waShBtn.prototype.isIos = ((navigator.userAgent.match(/Android|iPhone/i) && !navigator.userAgent.match(/iPod|iPad/i)) ? true : false);

var theWaShBtn = new waShBtn();

style.css

.whatsapp{
  display: none;
  color: #1DC143;
}

.whatsapp:hover, .whatsapp:focus{
  background: #1DC143;
  color: #fff;
  text-shadow: 0 0 1px rgba(0,0,0,0.2);
}

.whatsapp.activeWhatsapp{
  display: inline-block;
}

Hello Homaily,

Thank you for sharing these codes it was helpful.
Sorry can you help me on how to make a thumbnail preview when sharing to whatsapp i have a problem with that.

Thanks in advance.

Hie thanks for the code
Is it possible to share a file

Hi, Abdulaziz Homaily
Thank You for the code