Just like mailto: links you can also make a phone number clickable. Most devices will detect phone numbers on your web pages and do the linking for us, but this doesn’t happen all the times.
Here is the snippet for a clickable phone number
<a href="tel:123456789">123-456-789</a>You can also do this for text
<a href="tel:5554280940">Call us</a>If you are using a text module in Divi than you can add this snippet in the text tab.
Styling phone links
If you are using Divi and a text module than it is very easy to change the styles. Go to the design tab and then under the text options switch over to the link. Here you can change the styles for the link.
You can also do this with CSS. This pdeudo selector will search out all the Tel: on your website.
a[href^="tel:"] {
color: blue;
}Adding microdata
To let search engines better know that this is a phone number you might want to add some microdata to it. You can find some more examples at schema.org.
<div itemscope itemtype="http://schema.org/LocalBusiness">
<span itemprop="telephone"><a href="tel:+18506484200">
850-648-4200</a></span>
</div>
What if we want to have the phone number in as button? How do we make the number in the button or button clickable?
Hi Dave,
You can do this by using a button module and in the link field you place this:
tel:+123456789 replace the number with your own.
Hi how would you do this so a pop up shows if you are on a non callable device nut it works as shown on a callable device. Thanks
I have changed the phone no. and displays fine however, when i test the phone no. to call it. The phone no. it rings is the old mobile no. how do I find where this is located to change. I edited the phone no. in the button settings as above. I did not build the site.
Hi Elisha,
Try to clear your browser cache
Hello! im trying make this but in a link Image Module but i dont know how. its possible make it?
i tryed put in the field of URL “tel:123456789” but this dont work.
Someone have some idea?
Regards !
Hi Jaime,
For an image link place this in the link field tel:+123456789
.
Hello Mark that didn’t work for me in Divi module image i had to make it with html code, but thx for the answer