Telephone number links

Hi all, have googled it, but can’t seem to find an answer. When you input a telephone number on your website, so that someone viewing on a mobile phone can just tap it to call the number, is there any way of making that to happen only if they’re viewing on a phone? So that it’s not underlined or clickable if they view, for example, on a desktop. The helps appreciated. Dez

That’s interesting as I was thinking about that yesterday. I did not know you could click on the link and the phone would ring the number so could not see the point of it!

I think Javascript based on the width of the screen would work

I believe that iPhones will automatically make telephone numbers dial-able if they are in the correct format.

I think the first question is: how do you define what is and what is not mobile?
Is width enough, or do you want to get into browser sniffing? :grimacing:

If you are happy going be width, a media query can do it.


<a class="moblink" href="tel:123456789" title="Call Me">123456789</a>


            @media screen and (min-width: 500px) { /* W/E width you call "Mobile" */
                .moblink {
                    color: inherit;
                    text-decoration: none;
                    pointer-events: none;

If you want to get into browser sniffing, there may be a JS method, but I recall seeing a Wordpress function (PHP) that detects mobile called wp_is_mobile which looks like this :grimacing:

function wp_is_mobile() {
    if ( empty($_SERVER['HTTP_USER_AGENT']) ) {
        $is_mobile = false;
    } elseif ( strpos($_SERVER['HTTP_USER_AGENT'], 'Mobile') !== false // many mobile devices (all iPhone, iPad, etc.)
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Android') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Silk/') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Kindle') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'BlackBerry') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Opera Mini') !== false
        || strpos($_SERVER['HTTP_USER_AGENT'], 'Opera Mobi') !== false ) {
            $is_mobile = true;
    } else {
        $is_mobile = false;
    return $is_mobile;

Which could be borrowed. Though when I saw it I got the strange urge to re-invent it in a less ugly, verbose, WPish form:-

    function is_mobile() {
        $is_mobile = false;
        $mobies = array('Mobile', 'Android', 'Silk/', 'Kindle', 'BlackBerry', 'Opera Mini', 'Opera Mobi'); // Add any you want
        foreach($mobies as $mobi) { if(strpos($_SERVER['HTTP_USER_AGENT'], $mobi)) { $is_mobile = true ; } }
        return $is_mobile ;

…even though I had no intention of using it. :thinking:

Another question that comes to mind: what’s wrong with having the link on desktop?
It could be used on desktop (or tablet) if the device has Skype or similar such software installed.


How much faith do you have in user behavior?
Most smart phones automatically allow you to click and call on phone-links. Users may know this or instinctively try tapping or tapping anything next to a phone icon. So the simplest solution might be to style the phone-link to NEVER have an underline :slight_smile:

Thanks all, good points as always here. :+1:

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.