How to Make a Phone Number Clickable in Divi

by | Feb 18, 2019 | Divi tutorials | 2 comments

How to create a clickable phone number

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

You can also do this for text

If you are using a text module in Divi than you can add this snippet in the text tab.

Phone link in text module

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.

Styling phone links

You can also do this with CSS. This pdeudo selector will search out all the Tel: on your website.

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.

2 Comments

  1. Dave

    What if we want to have the phone number in as button? How do we make the number in the button or button clickable?

    Reply
  2. Mark

    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.

    Reply

Submit a Comment

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

close
Lifetime access to all Divi child themes and plugins
0 Shares
Share
Tweet
Pin
Buffer