Why isn't my phone number clickable on mobile (and how to make it dial with one tap)

If your number does nothing when someone taps it on their phone, it's almost always written as plain text instead of a call link. The fix is to turn it into a tel: link with the full international number (for example tel:+447700900123) and then test it on both an iPhone and an Android phone. If it's already a link and still won't dial, the usual culprits are a typo in the link, a banner or chat bubble sitting on top of it, or a number that's actually an image.

It's a small fix with a real cost while it's broken. A customer on the bus opens your site, taps the number, nothing happens, and the next business in their search results is one tap away. Below you'll find a 30-second check, a symptom table, the exact link format, how to fix it in WordPress and page builders, and the traps that break dialing even when a link is there.

Why the number won't dial: plain text vs. a call link

On a phone, a tap only starts a call if the number is a link whose address starts with tel:. In the page's HTML that's an ordinary link (an a tag) with href="tel:+447700900123", and the visible text can be anything readable, such as 07700 900123 or "Call us".

If the code only contains the digits (inside a paragraph, a span or a heading), the phone has nothing to act on. They're just characters on a page.

What makes this confusing is that Safari on iPhone tries to help: it detects text that looks like a phone number and turns it into a link on its own. Other mobile browsers, including those on Android phones, don't all do this the same way, so you can't count on it. A site can seem fine on the owner's iPhone and do nothing for customers on other phones.

Many themes and page builders drop the number into the header or footer as plain text, and nobody notices, because on a desktop nobody taps a number anyway.

How to check it yourself in 30 seconds

You don't need a developer to find out whether you have this problem:

• Open your site on your own phone, exactly the way a customer would.
• Tap the number once, briefly.
• On an iPhone you should see a small prompt with the number and a Call button. On Android the phone app should open with the number already filled in. Either one means the link works.
• If nothing happens, or you only get a Copy / Add to Contacts menu after a long press, the number is plain text, not a link.
• Read the number the phone offers to call. If it's an old number, the link and the visible text don't match.

A second quick test: try to select the number with your finger. If it highlights like ordinary text, with selection handles, it's almost certainly not a call link.

On a computer, hover the mouse over the number. If it's a link, most browsers show its address (starting with tel:) in the bottom corner of the window. If nothing appears, it's plain text.

Test on at least one iPhone and one Android phone. Because Safari can turn plain numbers into links by itself, an iPhone-only test can hide the problem completely.

Symptoms and fixes at a glance

The right format for a tel: link

Inside the link, write the number in full international format: a plus sign, the country code, then the number without any leading 0 you'd dial inside the country, and no spaces. The standard behind tel: links (RFC 3966) says numbers should be written in global form, starting with +, and it doesn't allow spaces in the link itself. Dashes, dots and brackets are allowed as visual separators, but digits only is the cleanest choice.

Why bother with the country code if your customers are local? Anyone calling from abroad or from a roaming phone gets through without editing the number, and phone apps read a complete international number more reliably. The visible text can stay in the friendly local format. The two don't have to look identical: one is for the phone, the other is for people.

One more detail: keep * and # out of the link. Apple's developer documentation notes that the iPhone Phone app won't dial a link that contains either character.

How to fix it in WordPress, page builders and plain HTML

• WordPress block editor: select the number in a Paragraph or Heading block, click the Link icon in the toolbar (or press Ctrl+K, Cmd+K on a Mac), type tel:+447700900123 and press Enter. Then save or update the page.
• Header or menu in a block theme: in the Site Editor (Appearance > Editor), select the Navigation block, add a Custom Link and enter tel:+447700900123 as its URL.
• Header or menu in a classic theme: go to Appearance > Menus, open Custom Links, put tel:+447700900123 in the URL field and the number or "Call us" in Link Text, add it to the menu and save.
• Page builders: buttons, icon boxes and text widgets almost always have a Link field. Enter tel: plus the number there. If the builder has its own phone or "call" option, check on a phone that it really produces a tel: link.
• Hand-coded site: wrap the number in a link with href="tel:+447700900123" and keep the readable number as the link text.

After any change, clear your caching plugin or CDN cache if you use one, then test again on a real phone. A fix that "didn't work" is often just an old cached copy of the page.

Traps that break dialing even when there's a link

Sites that already tried to add click-to-call can still fail for one of these reasons:

• The number is an image. Sometimes the number is part of a banner or a styled graphic. An image never dials, and screen readers and search engines can't reliably read it as text.
• A typo in the link. tel without the colon, tell:, or a stray space. Some link fields treat anything without a recognized prefix as a web address and quietly add http:// in front, so the link points to a page that doesn't exist. Hover over it on a computer to see the real address.
• Different numbers in the text and the link. This happens after a number change: someone updates the visible digits and the old number stays in the link.
• The theme switches off Safari's detection. A meta tag, format-detection with telephone=no, stops the iPhone from turning plain numbers into links. Real tel: links still work with it, so the fix is the same: a proper link instead of relying on detection.
• Something sits on top of the button. A cookie banner, a chat bubble, a sticky header or an invisible element can catch the tap. Close the banner and try again; if the number suddenly works, the layout needs fixing.
• The target is too small. A tiny number squeezed between other links gets mis-tapped. WCAG 2.2 sets a minimum of 24 by 24 CSS pixels for tap targets (a link inside a sentence is exempt), and its stricter level asks for 44 by 44. For your main call button, aim for the larger size.
• Safari blocked calls from your site during testing. If you cancel the call prompt several times in a row, Safari can show "This website has been blocked from automatically starting a call." Tap Allow Call to reset it. It's a safety feature, not a fault in your site.
• The page was opened inside another app. Some apps' built-in browsers don't pass tel: links on to the phone app. If the link works in Safari and Chrome, the problem is that app, not your site.

What a tel: link does on a computer

A tel: link isn't broken on a desktop, it just behaves differently. Depending on the system, it may open FaceTime on a Mac or another calling app that's installed, offer to send the number to a phone, or ask which app to use. That's why the number should always be visible as text too, so someone on a laptop can read it and dial from their phone.

Take it further: a sticky call button and WhatsApp

Once the number dials, you can make it much easier to reach on mobile:

• A call button fixed to the bottom of the screen, mobile only. It stays in view while people scroll and sits where a thumb reaches it easily. More on placement: where to put the "Call now" button on mobile.
• A WhatsApp button next to it. Plenty of people would rather send a message than call. A link like https://wa.me/447700900123 opens the chat directly; WhatsApp's help page asks for the full number in international format, leaving out any zeros in front, brackets and dashes, and its example leaves out the plus sign too.
• Words that say what happens. "Call now" tells people what the tap will do; a bare number doesn't.
• Measure the taps. Once the link works, count it as a conversion so you know how many calls the site starts: how to track phone-button taps in GA4.

This is exactly the kind of detail we set up on the first pass at MPO Web Studio, a small web studio in Cluj-Napoca. When we build a site, click-to-call, the sticky mobile button and WhatsApp are set up correctly and tested on real iPhones and Android phones, not just on an office screen. We work remotely and can show you a free, working demo before you commit to anything. If you'd like us to take a quick look at your site, send us a WhatsApp message and we'll tell you what's broken and how to fix it.