As a website DIYer, one of the first things I learned was how to create a simple link. But I couldn’t get my phone number to work! In this post I will show you how to code it, and below you will discover how to easily link your text using the Divi theme for WordPress. Making clickable phone links is really easy to do. But like everything else, it takes a little know-how and practice.
The Benefits
Click-to-call options on a website work to build trust by letting them know you value their time, resulting in increased engagements and more conversions. According to Caller Ready, the major benefits of adding a click-to-call option on your website are simply for the client’s convenience, for improving customer experience and driving sales.
Getting Started
Here I try to simplify the process by offering a HTML solution (coding), and alternate easy solutions for those using the Divi theme. Just like adding mailto:links, you can make phone numbers,text and buttons click-to-call, an essential feature of any business to streamline the communication process.
1. HTML Code To Create A Clickable Phone Number In The WordPress Text Editor, Text Tab.
- Type the code as follows. Directly after tel: add the phone number that you wish to make click-to-call formatting it without any spaces.
- Then also add the number between the arrows how you would like to display it. (between the arrows. e.g. > display number goes here < /a>)
e.g. 
2. HTML Code For Click-To-Call Text
- To code click-to-call text, follow the steps above.
- Then add a short line of text to display between the arrows rather than adding the phone number:
e.g. 
3. Make Buttons, Numbers & Text Click-to-call in Divi
Alright, let’s dive into buttons, numbers and text! Divi makes it super easy to whip up some awesome buttons that can lead your visitors wherever you want them to go. All you do is add your button module, and you’re free to tweak its look—play around with the color, size, and text. You can even set it up to link directly to your phone number! Just like with clickable text, you just need to use the “tel:” link in the button settings as I explain below. This not only makes your site more engaging but also lets visitors reach out to you without any fuss. So whether you’re going for a simple text link or a flashy button, Divi has you covered to make your contact options stand out!
Add A Clickable Phone Number or Text In Divi
In Divi, it’s really simple, as these codes can be added within the text module/text settings/text.
- Open up the text module on any page.
- Type in your phone number.
- Highlight your phone number, then choose the link icon in the text editor. (It doesn’t matter if you space your numbers out here.)
- Type in ‘tel:’ followed by your number. E.g. tel:123456789, and save. You can even add the link to buttons in Divi. It’s that simple! 5. Click ok to save your changes, and save your page on exit.
See my screenshot below:
Make A Click-to-call Button In Divi
1.Using the visual builder, add a new button using the button module.
2.Name your button as seen below in the content section where it says ‘Button’.
3.In the button module’s content/link section, add your Tel: link. Scroll up for instructions under Add A Clickable Phone Number or Text In Divi
4. Click the green arrow box, and save the page. Then exit the page and test your button using a mobile phone. If you have any questions shoot me a line. I hope that with these instructions you will now be able to add clickable phone number links on your web pages and WordPress websites using the Divi Theme by Elegant Themes. By Sandra Ciminelli WordPress Freelancer ACT Websites