How to add SMS links to your website
REALITY: Chances are good that the majority of your site visitors are arriving on your site via text.
I’m going to show you a special trick. With just a bit of code (I’ll show you how!), you can allow potential clients to click-to-text, and even draft a message for them to send!
This is perfect for starting the conversation from potential client to paying client, making it easy for them to reach out and hey – you’re already making their lives just a little bit easier!
- Include a link in your contact page or footer
- Create a SMS link in your website menu!
- Link a graphic image or photo of yourself
- Call to Action Buttons (BOOK YOUR FREE CALL)
- Email Signatures
- Invite feedback or ideas on a particular topic. Example: Text me one topic (or two!) you’d love to learn more about on The Website Doula blog. I mean it – give it a try right now with your phone & let me know!”
4 simple ways to create a SMS link on your website:
SMS LINK WITH MESSAGE
<a href=”sms:+12223334444&body=I%20am%20interested%20in%20your%20services.”>Send a SMS message</a>
SMS LINK NO MESSAGE
<a href=”sms:+12223334444″>Text Me</a>
SMS LINK IMAGE
<a href=”sms:+12223334444″><img src=”https://thewebsitedoula.com/wp-content/uploads/2021/02/sms-150×150.png” alt=”” width=”150″ height=”150″ /></a>
SMS IMAGE LINK WITH MESSAGE
<a href=”sms:+12223334444&body=I%20am%20interested%20in%20your%20services.”><img src=”https://thewebsitedoula.com/wp-content/uploads/2021/02/sms-150×150.png” alt=”” width=”150″ height=”150″ /></a>
HOW TO BUILD YOUR SMS LINK
NOTE: Is your website on a tool that doesn’t easily allow for custom HTML? Here are directions for squarespace sites. Unfortunately WIX does not easily allow for this functionality, and while weebly offers a full SMS bot tool, it is pricy.
I don’t normally talk about code too much with clients – in general it makes people immediately want to do this…
See how the code starts with <a href=”, and ends with </a>?
That’s the link! The <a href=” tells the link where to go, and the </a> tells it when to stop.
The sms phone # begins with the quote mark after <a href=. For example: <a href=”sms:+12223334444″>Text Me<a>. To insert your phone # just add your complete phone number with area code including the +1 at the beginning.2) THE MESSAGE
Write the message you want to use as the draft SMS text, and paste it in using this tool (the URL Decoder).
It will turn a simple message like this:
If you squint, you can see that there is a %20 between each word, and the final question mark is made using %3F.
Don’t worry – the tool above will do it for you. just paste in your text & click encode!
The message is then pasted in after the phone # as seen here with the code ?body= between the phone # and the message.
This is only necessary for the examples with a image. See the alt=”sms text link” part of the magical code? That tells google & visually impaired site visitors what that image is there for.