'whatsapp chat button with current url

<a href="https://api.whatsapp.com/send?phone=601005108869&text={current webpage url}">whastsapp me now</a>

how to let the code auto fill in {current webpage url}?

example,
visitor visit my site
current url >> http://sample.com/1-1

the code will be filled in as below

<a href="https://api.whatsapp.com/send?phone=60105108869&text=http://sample.com/1-1">whastsapp me now</a>
javascripthtml


Solution 1:[1]

Use window.location.href to get the current location and generate url text accordingly.

Lets say you have a button in your html:

<a id="whatsapp-button">Chat With Us</a>

In javascript file: 

// Get the element
$link = document.querySelector("#whatsapp-button");

// Generate url
$url = "api.whatsapp.com/send?phone=601005108869&text=" + window.location.href;

// Set url attribute of the link
$link.setAttribute('href', $url);

Make sure your javascript file runs after page load, which means either put it before the closing of body tag or use jQuery's $( document ).ready() method.

Solution 2:[2]

// Get the element
$link = document.querySelector("#whatsapp-button");

// Generate url
// "https://" add to above script now working fine
$url = "https://api.whatsapp.com/send?phone=601005108869&text=" + window.location.href;

// Set url attribute of the link
$link.setAttribute('href', $url);
 <a id="whatsapp-button">Chat With Us</a>

// Get the element $link = document.querySelector("#whatsapp-button");

// Generate url // "https://" add to above script now working fine $url = "https://api.whatsapp.com/send?phone=601005108869&text=" + window.location.href;

// Set url attribute of the link $link.setAttribute('href', $url);

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 Vijay Mali

Related Questions