Skype click to call issue? [duplicate] - css

Question

On those Windows machines with Skype installed, it tends to convert all phone-formatted numbers to Skype links so you can click it in order to make a call on Skype.
The question is how do you prevent that to happen for a certain number on page?

Answer 1

Try not outputting the numbers as a single piece of text. Instead of
<span>888-555-1212</span>
try
<span>888-</span><span>555-1212</span>
and it will disable skype

Answer 2

Update
This answer is no longer accurate - see Daniel Byrne's answer for more information.
Using CSS only, it can be removed by overriding the styles used by Skype. Try adding these two lines to your stylesheet:
span.skype_pnh_container {display:none !important;}
span.skype_pnh_print_container {display:inline !important;}

Answer 3

Skype has taken to adding a randomly generated string of numbers to the end of their span tag, so the above response from Groo is not entirely accurate anymore. To correctly select all Skype tags on a page, use CSS3 wildcard selectors like such :
span[class^='skype_pnh_container'] {display:none !important;}
span[class^='skype_pnh_print_container'] {display:inline !important;}
the ^= operator causes an attribute selector to mach elements that have an class containing a value that STARTS WITH 'skype_pnh_container' and 'skype_pnh_print_container'

Answer 4

<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />

Answer 5

The official solution is to add the following meta tag to the head section of your webpage. This will prevent skype from doing any reformatting on phone numbers.
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
This is a vendor-specific tag. See Skype Toolbar meta tag

Answer 6

EDIT: Sorry, I just discovered that IE9 has issues with this solution as it does not support soft hyphens.
There is an alternative solution to this problem:
You can use a soft-hyphen character (­) inside the phone number to address the issue. For example, given the number
<span>0664 111 222 3</span>
change to
<span>0664­ 111 222 3</span>
and be happy :)

Answer 7

I just found that if you use the new HTML5 tel protocol it blocks the Skype junk from appearing:
1 800 123 4567

Answer 8

I saw over the interweb a lot of possible solutions javascript solutions, meta tags, css and maybe I found an hack actually working for my websites, I tested on some computers and it work and I think it will work until skype don't change something in their code.
I was looking what is the skype exactly doing on our pages, and it creates some span around the phone numbers, as you already said, but it even add an tag at the end of the document, just after the body closed tag.
And here I saw the trick! Just before that object there is a configuration tag:
<span id="skype_highlighting_settings" display="none" autoextractnumbers="1"></span>
This is added dynamically by the plugin! but here the solution become obvious, to finalle stop skype messing with your design and avoid changing phone number the solution is to insert very early in the document the following tag:
<span id="skype_highlighting_settings" display="none" autoextractnumbers="0"></span>
notice the autoextractnumbers="0", here is the trick. The document will not validate anyway with that tag because there is no attribute "autoextractnumbers" but i noticed that it works even if commented:
<!-- <span id="skype_highlighting_settings" display="none" autoextractnumbers="0"></span> -->
And that's it! Enjoy your webpages free from messy plugins! And your web page will still validate correctly. Hope it works for you too! I have tested on a couple of computer 3 different browsers and 2 different skype versions, for now it works for me, let me know if it works for you too and if it works share it :)

Answer 9

I added a space in the first term of the number.
Instead of [phone] I entered ( 888 ) 222-3333
Granted: may look weird, but it works and it is simple.

Answer 10

I added a hyphen in a span before the number and then set display:none on the span style, which worked.
<span class="anti-skype-hyphen">-<span>01273 200 ***

Answer 11

All you need to do is insure your CSS selector is more specific than the selector Skype uses. In the current skype style sheet they use:
span.skype_pnh_container span.skype_pnh_highlighting_inactive_common span.skype_pnh_text_span {...}
You will need to add an extra class — your own website context — to this selector, i.e.
.myclass span.skype_pnh_container span.skype_pnh_highlighting_inactive_common span.skype_pnh_text_span {...}

Answer 12

Try this. It substitutes spaces in the phone number with an invisible span + the original space char. So skype cannot understand it is a number and our beloved phone number stays the same :) I had to use this approach since I usually let the content administrator change phone numbers at his will therefore I could not use a hard coded number inside javascript. Of course your markup should look like <span class="phone_number">your number with some spaces inside it<span>.
$(document).ready(function() {
if ($(".phone_number").length>0) {
$(".phone_number").each(function() {
$(this).html($(this).html().replace(/\s/g,"<span style=\"display:none\">_</span> "));
});
}
});

Answer 13

You can also leave the number alone and remove it with JS.
jQuery(document).ready(function(){jQuery('.skype_pnh_container').parent().html('(555) 222 - 3333');
jQuery('.skype_pnh_container').remove()}
It is harder to do in normal HTML, but Skype doesn't remove the parent container, so put the number in something with an ID, you can do a "getElementById" on it, set the innerHTML to the phone number.
document.getElementById('phoneNumberContainer').innerHTML='(555) 222 - 4444';

Answer 14

If you are using PhoneGap on iOS this can be a UIWebView issue (separate from Skype).
The following line fixes the problem if you don't want automatic links generated in UIWebView:
self.viewController.webView.dataDetectorTypes = UIDataDetectorTypeNone;
inside AppDelegate.m in -(BOOL)application:(UIApplication*)application didFinishLaunchingWithOptions:(NSDictionary*)launchOptions