How To Prevent Skype from Highlighting Phone Numbers
In this tutorial I will show you 3 solutions, from a developer´s point of view, how to prevent Skype from automatically highlighting phone numbers displayed in your Website. Also I will show you, from a user´s point of view, how to disable Skype phone highlighting in Internet Explorer.
The Problem
If you have Skype installed on your computer and you use Internet Explorer as your Web browser, then there is a good chance that Skype highlights phone numbers on Web pages as shown in the image below. I find this Skype “feature” intrusive. This Skype modification is not aesthetically appealing, is obtrusive, does not flow nicely with the page design, and sometimes breaks the layout on the page.
The XHTML markup associated with the image above is the following:
<h2>Get in touch</h2> <!-- code removed for brevity --> <span class="phone">(570) 585-1026</span>
My Observations:
The Skype phone number highlighting seems to affect only IE browser. The other browsers are not affected. However; I will not be surprised if other browsers are (or will be) affected depending if skype add-ons exist (or will exist) for them.
The Solutions: From a Developer´s Point of View
For a Web developer, I am going to list 3 solutions. Choose the method that best fits your needs. All 3 solutions passed XHTML 1.0 Transitional and Strict validation. After you implement any of the 3 solutions, you should expect that Skype is prevented from highlighting phone numbers, as shown in the image below:
Solution1: Use HTML Soft Hyphen
Put the soft hyphenation somewhere inside the phone number in order to prevent Skype from recognizing it as a phone number. Make sure that the phone number does not split across two lines. This is an easy solution that passes validation.
<h2>Get in touch</h2> <!-- code removed for brevity --> <!-- In HTML, soft hyphen is represented by the character entity reference ­ (­ or ­)--> <span class="phone">(570)­ 585-1026</span> <!-- OR you could do the following--> <span class="phone">(570) 585­-1026</span>
Reference:
Solution2: Use CSS Trick
This is another method to prevent Skype from highlighting phone numbers of Web pages by injecting code that splits the phone number and thus preventing skype from recognizing it as a phone number. Also, from an SEO perspective, this method is harmless since between the <span> tag (with the display: none property), there are no hidden links, no hidden images, no stuffed keywords to improve search ranking, no stuffed text, and no hidden malicious code.
<h2>Get in touch</h2> <!-- code removed for brevity --> <!-- Insert invisible <span> with "-" inside phone number. The hyphen will not show, but that's fine. You could keep space between the set of numbers. --> <span class="phone">(570) 585<span style="display:none;">-</span> 1026</span>
Solution3: Use Meta Tag
This solution is discussed in the Skype community Forum referenced below. Add a vendor-specific meta tag. This solution is especially useful for Web pages that display a lot of data (phone numbers or otherwise) that are highlighted (mistakenly or not) by Skype. In this case it will be much easier to add one meta tag at the head of the HTML document instead of modifying every single number on the page. This method, like the previous two, validates for XHTML 1.0 Transitional and Strict.
At the head section of your HTML document, insert the following Meta tag.
<head> <title>Blue Olive Online</title> <!-- code removed for brevity. --> <meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" /> <!-- code removed for brevity. --> </head>
Reference:
The Solution: From a User´s Point of View
If you are an Internet Explorer Web user, and you are annoyed by this Skype feature, then follow the steps below. This solution is tested for IE8. I am not sure about other versions of Internet Explorer.
- From your IE browser, go to: Tools -> Skype add-on for Internet Explorer
- From the dialog box, you have 2 choices:
- Either uncheck the box that says "Turn number highlighting on"
- Or click "Uninstall" to completely remove this Skype add-on.
- Click "Ok" and Skype will no longer automatically highlights phone numbers in Web pages.
Reference:
Note: If the Video below does not run in your browser, either use a different browser or save it on your computer.
Did you know!
By following any of the 2 choices above, you also prevent Skype from automatically highlighting your phone number in your Email´s signature.
Conclusion
This tutorial lists 3 solutions for Web developers that prevent Skype from intrusively highlighting phone numbers in your Website. Also it shows Web users how to disable automatic Skype phone highlighting in Internet Explorer. This issue had been reported to Skype almost four years ago. It seems that Skype views this as a feature and not an issue.
Do you have anything to say? If so, please share it in the comments section.
Boutros, Thanks very much for sharing this tip. I have an issue where a toolbar I installed creates links out of certain words or phrases on my website. I don’t usually install toolbars so never noticed it before. But your skype solution works for this as well. The difference is you need to know which words are being turned into the redirected link. I am hoping a google search gives me a better solution then downloading various toolbars and see what they do :) If you have any suggestions of reading material I’d really appreciate it, again thanks for sharing your knowledge regards Nick
I just tried your Meta Tag solution and it worked! I tested it with IE 9. I wouldn’t have minded having Skype show up, but the skype blue is nearly the same as my client’s wordpress theme color and you couldn’t see the phone number. Unless something is changed, I don’t believe that the skype colors can be changed. Thanks so much for your post!
Thanks – nice and easy for a novice like me
Hey man,
Thanks for so great way to get rid of the skype’s garbage. I am using the meta tag method, and it works as a charm. There is so much garbage on internet about this topic, but your tutorials are going straight to the point. Thanks again!
Let’s turn the question: what script to use to style all of your phone numbers on your own website?
Can this be done through javascript?
Thank you for your help.
William,
you use CSS to style for the phone numbers and not JavaScript.
You can use google Chrome’s developer tools or Mozilla’s Firefox developer tools to know what CSS code I used.
Let me know if you need further help.
Thanks.
OMG. I have read through many solutions, but all so complicated. Just go to your control panel and find SKYPE CLICK TO CALL (SKYPE PLUG-IN) and uninstall it.
POOF! GONE! How simple was that? You techies make everything sooooooo difficult.
Hi Diane,
what you are suggesting is fine from a user’s point of view (see my answer to a comment).
From a Web developer’s point of view is totally different, a Website owner can’t ask visitors that visit the Website to disable Skype add-on on their browsers. The Web developer need to find a way for Skype not to highlighting phone numbers. First it’s very annoying and second it is ugly (no design appeal).
I assume you are not a developer yourself.
Boutros.
Dear Mr. AbiChedid,
Thank you for your article on Skype Css highlighting.
I tried your “meta-tag” suggestion, and it prevented the “highlighting” of the telephone numbers on a “test-page” that I opened in my Internet Explorer-8 browser.
But then I read somewhere that your meta-tag “is not supported in the Current Version [of Skype], as confirmed by a Skype Employee.”
And, as the Skype “highlighting” enables a web-page viewer to call a “highlighted-number” simply by clicking on it, or to “copy” that number to a “clipboard,” or to add that number to one’s Skype “Contact List,” through the use of a “dropdown-menu” on the left-hand side of the “highlighted-number”…many people might not mind “highlighted” telephone numbers on the web pages they view.
Therefore, if a web-page developer would rather allow the Skype telephone-numbers on their web pages to be “highlighted,” here is a simple idea that can be incorporated into the “layout” of a web page, to take into account those web-page viewers who have “Skype” software installed on their computers:
By placing a telephone number within a “span” tag of say, “150 pixels” in width, with the telephone number aligned to the left-side, center, or right-side of the “span” tag, that same number, when “highlighted” by Skype, will simply fill up the “span” tag, without nearby page content being affected.
Below is an Example Script of such “span” tags, with and without Skype “highlighting.” (I replaced the last digit of the “blueoliveonline.com” phone number with a “semi-colon” in three of the telephone numbers in the Example Script below to prevent them from being “highlighted.” Also, a “red border” has been added to each “span” tag for observing purposes.)
Sincerely,
Brian Jones
Example Script:
Thanks Brian for your comment and feedback. I have skype plugin un-installed on IE8 so I could not test your script.
But I’ll take your word for it that it works.
Note: For next time if you want to add a snippet of HTML code:
use*:
{html}
Some code here….No need to encode characters.
{/html}
* Replace { with [ and replace } with ]
Dear Mr. AbiChedid,
A correction is in order.
The “span” tags that I used in the “Example Script” in my first “Comment” should have been “div” tags, as are used in this “Skype Highlighting Example Script”:
http://whowillbethenextonline.com/skype-css-test.html.
Thank you,
Brian
Ok Brian. I corrected your script above.
Thanks.
Just got rid of Skype’s vile number hijacker – thank you!
K
You’re Welcome keith. I know what you mean.
This tutorial is my third most viewed post ever.
Boutros.
When I unchecked the box to have Skype highlight phone numbers, there was no place to click OK. The box could not be expanded. I could try to click another country, but still there was no place to click OK or to save the setting. There was no place to click to uninstall the Skype add-on. I have IE version 9, so they must have circumvented your fix and it is now impossible to uncheck the highlighting. Any ideas? I am not a programmer.
Hi Marian,
I tested this on IE9 and there is an ‘Ok’ and ‘Cancel’ buttons. I am not sure why you can’t see it. In any case, you are right that you can’t re-size the dialog box.
1. Another Method to disable Skype Phone Highlighting from a User’s point of view is to Disable the Skype Add-on Completely. That should take care of it.
To do that: Open IE9 and in the top Menu go to ‘Tools’ -> ‘Manage add-ons’. The ‘Manage Add-ons’ dialog box open. If you scroll down you should see 1 or 2 Skype related add-ons.
Once you highlight one of them, you should be able to Disable it (disabling any one should disable both) and then close the dialog.
Restart your browser and see if phone numbers are still being highlighted.
2. A third method is to completely Uninstall the Skype add-on for Internet Explorer by going to the Menu: ‘Tools’ -> ‘Skype add-on for Internet explorer’ and then click on the ‘Uninstall’ button.
Let me know if this works for you (or Not).
Thanks for commenting.
Boutros.
I disabled one of the Skype add-ons. That did seem to work. Thank you.
Thank u it saved me lot of time fixed my issue by putting the first solution.
You’re Welcome kaushik. I’m glad you found my tutorial helpful to your problem.
Thanks for the solutions!:) Do you know if the solution affects SEO in any way? Will Google read it as a space?
I meant to ask about solution nr. 1, the one with the soft hyphen.
Thanks for your comments.
No it has NO effect on SEO, this is just a phone number, unless one of your keywords is your phone number (very very slim probability) and even in this case Google search will still pick up your phone number with no problems. Google will read it the same way it renders in the Website with a soft hyphen.
If this what you chose for a solution go for it and don’t worry about SEO.
Hope this helps.
Boutros.
Thats the problem, its not a phone number. I work on a site that are similar to the yellow pages, and some of the businesses have 9 digits in the beginning of the company name (example: 045-888000 transport). I need the company name to be searchable without Google thinking it is ’0 45-888000 transport’ instead of ’045-888000 transport’.
I see that some use the soft hyphen to split words and make them searchable. In Norwegian we, in some cases, take two words and make them one. For example the English words ‘shopping cart’ will in Norwegian become ‘handlevogn’, which is the same as ‘shoppingcart’, just in Norwegian of course. So some people use the soft hyphen like this: ‘handlevogn’. And then both ‘handle’ and ‘vogn’ is searchable, even though its presented like ‘handlevogn’.
Ok Nymphad. If this solution does not work in your language, then try the other solutions that I discussed in the post.
I appreciate your feedback on this.
Boutros.
Thank you so much! I’m so happy I finally got rid of that Skype “feature”!
You’re Welcome Antoaneta.