Beginner's Guide for WordPress - Start your WordPress Blog in minutes.
Choosing the Best
WordPress Hosting
How to Easily
Install WordPress
WordPress Plugins
View all Guides

How to Add Clickable Phone Numbers for Smartphones in WordPress

Last updated on by
Special WordPress Hosting offer for WPBeginner Readers
How to Add Clickable Phone Numbers for Smartphones in WordPress

The number of users browsing websites from their phones is increasing every day. A lot of businesses put their phone numbers on their website, but it is not clickable. Recently, one of our readers who was working on a local restaurant site asked us if there was a way to convert phone numbers into clickable links for mobile users. This would allow the mobile users to tap and call the restaurant right from the website. In this article, we will show you how to add clickable phone numbers for smartphones in WordPress.

If a phone number is written in a recognizable phone number format, then most smart phones would automatically recognize the telephone number and convert it into a link. However, if you want the number to be replaced by an anchor text, or you want to link an image to a phone number, then you would want to manually create the link.

The proper format to write a telephone number is:

<Country Code> <(Area Code) > <Local Number >

Example: +1 (555) 555-1212

However, most smart phones would also recognize these formats:

  • +15555551212
  • +1.555.555.1212
  • 555-555-1212
  • 555 555 1212

Tapping on a properly formatted phone number opens dialer in smart phones

Writing phone numbers in proper format will automatically convert them into links for mobile phone users. However, users with older phones may not see the link.

<!--This link will work on Android and iPhone. It will be visible to desktop users but will result in an error when clicked -->
<a href="tel://+15555551212">+1 (555) 555-1212</a> 

<a href="tel://15555551212">Call Me</a>

The problem with the above link is that it will be visible to users on all devices. If someone on the desktop click on it, then it will do nothing on Google Chrome and will show an error in Firefox.

<!-- This link will open Skype on desktop and notebooks, on mobile phones it will ask users if they would like to open skype or dial this number using their phone -->
<a href="callto://15555551212">+1 (555) 555-1212</a>

In the example above we have used callto: protocol. This protocol is used by Skype along with skype: protocol. Using this has an advantage that smartphone users will be able to call the number using their phone service, while users on desktops and other devices will be able to make a call using Skype.

<!-- Link a number to an image -->
<a href="callto://15555551212" title="Call Me"><img src="/images/call-me.png" alt="Call Me" /></a>

The above example links an image to a number using Skype’s callto: protocol. The problem with this syntax is that a smartphone may recongnize the Skype protocol, but it may not recognize the phone number. Furthermore, it may not offer the user a chance to call using their phone.

You can also create links to Skype usernames and provide live chat support, or voice call support to your visitors.

<a href="skype:echo123">Skype</a>

We hope that this article helped you add clickable phone numbers for smartphones in WordPress. Do you use the tap to call feature when using mobile browsing? Let us know by leaving a comment below.

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi. Page maintained by Syed Balkhi.

WPBeginner's Video Icon
Our HD-Quality tutorial videos for WordPress Beginners will teach you how to use WordPress to create and manage your own website in about an hour. Get started now »


  1. Saranya says:

    I follow the same process in wordpress, but i’m getting the error as “Oops Not found”

  2. Shannon says:


    I put in <a href=”tel://000 0000 000″> 000 0000 000</a> but it shows a planet next to it and i don’t know why

    Can anyone help

  3. Abhishek suna says:

    how can i display *123# using the code. while i am writing it as *123#
    the output is only showing *123 key but not # key

  4. evden eve nakliyat says:

    I have learned that google gives extra care to clickable phone number. thanks for this article.

  5. Mohammad Raihan Mazumder says:

    Skype Call & Chat: “YOUR-ID” is skype ID.

    Call us in Skype

    “name”: “dropdown”,
    “element”: “SkypeButton_Call_YOUR-ID”,
    “participants”: [“YOUR-ID”],
    “imageSize”: 24


  6. woosa says:

    How can create a script that detect and convert all number into tel ?….- that is the question

  7. vinodh says:

    thanks for this.
    I was not aware of callto://

  8. Keely Worth says:

    Not working for me :( – client has a 1300 number (Australia). Here’s the code I tried: (bracket)a href=”callto://1300 XXX XXX”(close bracket)1300 XXX XXX(closing tag)

  9. Fărcaş Gelu Dănuţ says:

    For my WordPress websites, i use Call Now Button plugin (free).

    • Erik Askviken says:

      Farcas, thank you for this! Call Now Button plugin works like a dream. 2 minutes and the problem was solved!

      • Fărcaş Gelu Dănuţ says:

        I’m glad I could help. Sorry for my poor English language, i use Google translate (Romanian to English)

  10. James says:

    Thaks very much! very useful. though couldn’t get the callto protocol to work I used the tel protocol

  11. Mandy Grigoriou says:

    Many thanks for this article …however, you don’t say which file we put the code in! To some of us that presents a problem :)

    • WPBeginner Support says:

      Mandy, these are hyperlinks, you can add them into your posts,pages, by either clicking on the link button in the editor. Or switch to Text editor and add them manually.

  12. Jake Tyler says:

    Thanks, this is actually really helpful.

  13. Travis Pflanz says:

    While this post didn’t bring anything new to light for me, it made me decide to double check all my websites… I found that one site (my main business website) was not clickable.

    I had a around the phone number, giving it a larger font-size than the surrounding text. the was not allowing the phone number to be clickable… So, thanks for putting in my mind to check!

  14. John Evans says:


    In this day and age I believe it is essential to have a phone number that is clickable. Especially given the amount of traffic a web site receives from mobile devices.

    I wrote a plugin last year that:
    1. detects a mobile device and makes the link clickable only if it’s a mobile device
    2. Can display alternative text if it is a mobile is detected. That is display “Call Us” instead of your number. Of course it will still link to your number so when it is clicked the number in question still gets called.
    3. It obfuscates the telephone number. Whilst this may not be a major issue for some, it is for others. I for instance have my mobile number on my site so the fact that it is hidden from robots suits me.

    What do I get out of this? Nothing, there is no financial incentive for me to link to my own plugin but I truly believe that within the context of this post the plugin could be a great help to some.

    The plugin can be found at

    Or by searching in the WordPress plugins directory for “Link/Obfuscate Telephone Numbers”

    I do all I can to help if anybody can’t get it working.

    • Editorial Staff says:

      Hey John,

      Thanks for sharing the plugin. In my opinion, you should never put your cell # on your website. Use Google Voice or something else.


      • John Evans says:

        Hi Syed,

        Thanks for replying. Normally I would agree with you but with the amount of traffic my site receives and the obfuscation I cannot see it being a problem (although I’m prepared to be proved wrong).

        Considering my mobile/cell is my business phone I feel it appropriate that I provide a way for people who like to communicate via voice to contact me. I know that I personally do not trust businesses that don’t provide a phone number as I feel they are trying hide something or avoid confrontation over poor services etc.

        i can see your point though

        • Editorial Staff says:

          You can direct your Google Voice to your cell number and control business hours. For ex: If someone on the other side of the world calls you in their day time which is 3 a.m in the morning for you, then you don’t want your phone ringing. I’m speaking from experience there :)

          So just to be clear, you are still providing them with a way to contact you. You are just using an alias number that is forwarding to your main number that the user never sees. Hope that clarifies my initial statement.


    • NZ says:

      Don’t really want to “Guided transfer” my site from to as your plug in is the only one I want. Any way to get the same on

    • ART says:

      Really helpful to make a phone number clickable on mobile. Still working in newest WP. Thanks.

    • ART says:

      John, my comment was to your nice plug-in. Reply isn’t pointing to the correct comment.

  15. Brankica says:

    Coolest tip ever. I didn’t think about putting this on my site but now that I know how easy this is, I am adding it. Thanks

  16. Gurjit Singh Khehra says:

    Yeah, Good to know this. But i am not going to implement it soon as i don’t think that i need a clickable phone number on my blog. But i’ll surely follow this guide when i need to.

    Thanks and Regards.

  17. Frithjof says:

    Cool! This will be very helpful!
    I recently put a Google maps code into a client’s footer widget and noticed that in a phone browser a “phone” button appears that calls the Google maps number.
    I thought that is very cool!

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.