1. Home
  2. /
  3. Web Design & Development
  4. /
  5. Javascript
  6. /
  7. On click open message box on phone with default text and phone number

On click open message box on phone with default text and phone number

text message on click of anchor tag

Want to implement “Text us” or “Text me” link or button on your website for mobile users?

Here is the script that you can use to make it work for both Android and iPhone devices.

Step 1:

First, create an anchor or link. Add it to somewhere on the page i.e. inside the <body></body> tag. Since, the text me or test us link will work for mobile users only, add required CSS styling to hide it for desktop users.

<a href="sms:+10000000000" id="txtMsg">Text Us</a>

Step 2:

Add the following piece of script/code right before closing of </body> tag.

<script type="text/javascript">
jQuery(document).ready(function(){
		
	if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
             jQuery("#txtMsg").attr("href", "sms:+10000000000&body=Hi, I have a question regarding your service:  &nbsp;");
	}else{
	     jQuery("#txtMsg").attr("href", "sms:+10000000000?body=Hi, I have a question regarding your service:  &nbsp;");
	}
		
});
</script>

Once you’re done adding the code. On each page load, the href value will be replaced dynamically with the one we have mentioned in the step 2.

Based upon the visitors, device… the appropriate sms formats will be applied.

Don’t forget to update your phone number +10000000000 with your own phone number and the text message “Hi, I have a question regarding your service:”.

DEMO

Click on the below link from your mobile to test this script.

Text Us

Leave a Reply

Your email address will not be published. Required fields are marked *

Reviews & Ratings Get your stoe online with Shopify in 60 minutes Shop Now