Join thousands of small business owners who receive marketing tips and strategies delivered right to their inbox.

[Guide] How to Make a Phone Number Click-to-Call in WordPress

| Jul 3, 2019

Do you have a website with a phone number listed, but when you click on it nothing happens? What you have is a non-clickable phone number – one that is basic text without any HTML markup. In order to make that phone number place a call when clicked, we need to add a very specific snippet of HTML.

HTML Used to Make Phone Number Click-to-Call

How to Edit Phone Number in a WordPress Page or Blog Post

Though we are using WordPress to demonstrate how to change a phone number to be clickable, the process of editing a page or blog post on most major content management systems is very similar.

#1 Log-in & Navigate to Page/Post

To start, log-in to your website and navigate to the page you want to edit.

How to Make a Phone Number Clickable in WordPress - Edit Page/Post

#2 Make Sure You are Using the ‘Text’ Editor

If you’re not already using WordPress’ built-in text editor, click on the “Text” button to switch over from the Visual Editor.

How to Make a Phone Number Clickable in WordPress - Not Click-to-Call

How to Make a Phone Number Clickable in WordPress - Text Editor

#3 Locate Phone Number & Add HTML Snippet

Now that you’re in the ‘Text’ Editor you can add HTML. Locate the phone number you want to be able to call when clicked on via mobile device and add the HTML (above) with your phone number in place of the one currently used.

How to Make a Phone Number Clickable in WordPress - HTML Snippet

When you switch back to the ‘HTML’ editor, you should see your number as click-to-call. Similarly, you should see the same thing when viewing the frontend of the webpage.

How to Make a Phone Number Clickable in WordPress - Click-to-Call Ready

How to Edit a WordPress Header or Footer

If your unlinked phone number is found on a page or post, we’ve demonstrated how easy it can be to edit that page and modify the number to be clickable. However, what if the number appears in a theme file and/or in a footer widget? Things can become far more complicated if you have to edit a core WordPress PHP file. For the sake of this article, we’re not going to discuss editing core PHP files (after all, if you have the skillset to edit PHP files you should know how to make a number click-to-call).

How to Make a Phone Number Clickable in WordPress - Header Phone Number

Change/Add Phone Number to Header via Menu Item

If you don’t have a phone number in your website header, it’s fairly easy to add. Simply head over to ‘Appearance’ > ‘Menus’ (when logged-in to WordPress’ backend). If you already have a custom menu, great! If not, you may need to create a new one.

#1 Create a New Menu

If you already have a menu that you want to use, you can skip this step.

How to Make a Phone Number Clickable in WordPress - New Menu
How to Make a Phone Number Clickable in WordPress - Name Menu

How to Make a Phone Number Clickable in WordPress - Menu Button

#2 Add a Custom Link to Your Menu

If you want to add a page or blog post to your menu, simply select the page you want to add from the dropdown menu and then click ‘Add to Menu’. Unfortunately, you cannot add a phone number this easily. Instead, you have to add a ‘Custom Link’.

In the ‘URL’ box, replace the “http://” with: tel:+18883235687 (using your phone number and area code).

In the ‘Link Text’ box, add how you want the phone number to appear to users: (888) 323-5687 (for example).

When done, click ‘Add to Menu’ and then ‘Save Menu’ (right side).

How to Make a Phone Number Clickable in WordPress - Custom Link Info

#3 Set Menu as Primary Menu

Now that you’ve created your new menu, let’s assign it to the ‘Primary Menu’ spot. When done, click ‘Save Changes’ and you should see your new menu and phone number appear sitewide when you reload the frontend of your website.

How to Make a Phone Number Clickable in WordPress - Choose Menu

Change/Add Phone Number to Footer via Widgets

How to Make a Phone Number Clickable in WordPress - Footer Area

Not every WordPress theme is designed the same. While most theme makers design their themes and how certain areas are accessed in a very similar manner, your theme may not be so straightforward.

For our demonstration purposes, we are assuming that your WordPress theme is widget ready.

#1 Add a New Footer Widget

In the Divi theme, users have the option to use up to six columns within their footer space (which are labeled in the ‘Widgets’ section of your website (Appearance > Widgets).

Scroll down the ‘Widgets’ page until you find the ‘Text’ widget and select the Footer Area you want to assign it to (#2 for our example).

How to Make a Phone Number Clickable in WordPress - Text Widget

#2 Add Click-to-Call HTML

Just like adding a click-to-call number to a page or post, all you have to do is add the phone number marked up with HTML. When done, select ‘Save’.

How to Make a Phone Number Clickable in WordPress - Add Click-to-Call
When done, you should see your clickable phone number appear sitewide in the footer widget area you choose to use.

Conclusion

While this is a basic overview of how to both edit and add a phone number that can be clicked to a WordPress website, we do encourage you to use the comment form below to ask us any questions you may have. Please note that we did not cover CSS or using icons, like Font Awesome, to style your phone number; however, if you need help with styling your phone number… just ask! If you need the pros to take over, we can do that too! Simply click here to contact our team today.

Get Results. It All Starts With a Conversation.

Fill out this form to request a free marketing evaluation and quote on digital marketing services from BizIQ.

  • No Term Contracts:
    Our work is always performance based. There are no term contracts.
  • Guaranteed Results:
    If we can't get your business in front of more local customers in 60 days, we work for free until we do.
  • We Work With You Exclusively:
    We work with only one business of each type per geographic area. We'll never market your competitors.
BBBInc 5000Google Partner
Get Results. It All Starts With a Conversation.

Fill out this form to request a free marketing evaluation and quote on digital marketing services from BizIQ.

  • No Term Contracts:
    Our work is always performance based. There are no term contracts.
  • Guaranteed Results:
    If we can't get your business in front of more local customers in 60 days, we work for free until we do.
  • We Work With You Exclusively:
    We work with only one business of each type per geographic area. We'll never market your competitors.
BBBInc 5000Google Partner
Get Results. It All Starts With a Conversation.

Fill out this form to request a free marketing evaluation and quote on digital marketing services from BizIQ.

  • No Term Contracts:
    Our work is always performance based. There are no term contracts.
  • Guaranteed Results:
    If we can't get your business in front of more local customers in 60 days, we work for free until we do.
  • We Work With You Exclusively:
    We work with only one business of each type per geographic area. We'll never market your competitors.
BBBInc 5000Google Partner
Get Results. It All Starts With a Conversation.

Fill out this form to request a free marketing evaluation and quote on digital marketing services from BizIQ.

  • No Term Contracts:
    Our work is always performance based. There are no term contracts.
  • Guaranteed Results:
    If we can't get your business in front of more local customers in 60 days, we work for free until we do.
  • We Work With You Exclusively:
    We work with only one business of each type per geographic area. We'll never market your competitors.
BBBInc 5000Google Partner
Get Results

Fill out this form to request a free marketing evaluation and quote on digital marketing services from BizIQ.

  • No Term Contracts:
    Our work is always performance based. There are no term contracts.
  • Guaranteed Results:
    If we can't get your business in front of more local customers in 60 days, we work for free until we do.
  • We Work With You Exclusively:
    We work with only one business of each type per geographic area. We'll never market your competitors.
BBBInc 5000Google Partner