How to create a phone call button

Introduction:

Sometimes you might like your users to make a phonecall to any phone number.

On a mobile device it will dial straight out.

And on a desktop you will be presented with options. Say you have Skype setup for example.

Its actually easier than you think. You simply need to add this HTML code to the source section of any node:

Take note: make sure to include target=”_blank” as this is the only way that this would work for IOS users.

<a href="tel:5551234567" target="_blank">Call (555)123-4567</a>

Step-by-Step Instructions:

Step 1: Simply replace the telephone number and label text.

Now say you want to make the link look like a LH button. You can use this CSS code.

<a class="phonecall" href="tel:5551234567" target="_blank">Call (555)123-4567</a>

<style type="text/css">
a.phonecall{
border: 1px solid #1f8bea;
border-radius: 3px;
background-color: #1f8bea;
color: white;
padding: 10px;
text-decoration: none;
}
a.phonecall:hover{
border: 1px solid black;
background-color: #2195fc;
color: white;
text-decoration: none;
}
</style>

Step 2: Just copy paste into a ‘source’ section in the text editor toolbar of any node.

Its the last icon on the right-hand side.

Working demo here: https://test2.leadshook.io/survey/XYXfo6Ax4xORAFwvZmjUdr58w7oUBxcHcHpbkBoh

Tagged: