Howto Remove Skype Plugin Markup with jQuery

web

If you have installed the latest version of Skype on Windows, it automatically installs browser plugins for IE and FireFox. The browser plugin detects phone numbers on the page injects markup with clickable links to dial the number in Sykpe.

This has caused some issues for Web Developers because the plugin sometimes picks up text that is not actually a phone number. Or it can screw up a design that has fixed width requirements.

So how do you disable this nice feature? Skype had supported a meta tag at one point:

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

This meta tag is not supported in the Current Version, as confirmed by a Skype Employee.

The HTML that the plugin injects is all styled with CSS using !important directives, so it is difficult to get rid of their styling using CSS, that's why I had to write some JavaScript disable the skype plugin. Using jQuery makes this very easy, just insert this code into your head tag:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" language="javascript"></script>
<script language="javascript">
	$(document).ready(function() {
		window.setTimeout(function() {
			$('.skype_pnh_container').html('');
			$('.skype_pnh_print_container').removeClass('skype_pnh_print_container');
		}, 800);
	});
</script>

It's annoying that Skype makes you go through these hoops to disable their plugin, it would be nice if they supported something like this:

<meta content="telephone=no" name="format-detection">

Which you can use to tell mobile phones such as an iPhone not to detect phone numbers on the page.



Related Entries

5 people found this page useful, what do you think?

Trackbacks

Trackback Address: 751/D08C7BE39C691E8C18DB3CB30B2C5641

Comments

On 05/03/2010 at 4:57:45 PM EDT Thomas Messier wrote:
1
Hey Pete, I have the plugin installed, but in Firefox I have a button in my toolbar that allows me to easily disable the feature, or even uninstall the plugin. Do you not have this button, or am I missing something?

On 05/04/2010 at 1:03:42 PM EDT Pete Freitag wrote:
2
@Thomas that's not really the issue, the problem is that when the plugin causes a layout problem. You don't want to leave it up to the user to fix it, I'd rather account for it on my end if I know it is going to happen.

On 05/10/2010 at 7:06:17 PM EDT Bernard Samstag wrote:
3
The META tag did not work, but your script did the job! Many thanks!!! My vertical menu on the Theatre40.org web pages was messed up due to the phone number expansion with that damn country code (flag). I came THAT close to uninstalling Skype! Thanks again!

On 06/01/2010 at 10:17:47 PM EDT john f wrote:
4
Thanks Pete. I searched everywhere for this solution. You've got me out of jail with this one.

On 06/02/2010 at 8:35:09 PM EDT Jonathan Schofield wrote:
5
Superb, thanks for this -- works a treat!

On 06/14/2010 at 9:20:51 AM EDT Krishna wrote:
6
Awesome, the time out is what I was missing! Many thanks!

On 06/25/2010 at 6:08:49 PM EDT Diodeus wrote:
7
I just used this CSS and it worked.

span.skype_pnh_container { display:none !important; }

span.skype_pnh_print_container { display:inline !important; }

On 08/19/2010 at 3:27:02 AM EDT axiom wrote:
8
try <meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />

On 08/19/2010 at 11:17:38 AM EDT Pete Freitag wrote:
9
@axiom - the meta tag doesn't work in all versions of skype from what I've read.

On 08/26/2010 at 7:19:15 AM EDT larvitard wrote:
10
thanks for this!!

On 10/02/2010 at 10:21:48 PM EDT kastaneda wrote:
11
I would like to exchange links with your site www.petefreitag.com Is this possible?

On 12/03/2010 at 4:15:11 PM EST cg wrote:
12
This is a great solution. One question why '800', why not '100' or something smaller, to keep it from showing then disappearing?

On 12/03/2010 at 4:19:06 PM EST cg wrote:
13
Also, I liked Diodeus suggestion of the css, but I couldn't get that to work due to conflicting !important tags....

On 12/03/2010 at 4:55:00 PM EST Pete Freitag wrote:
14
The reason I used 800 is because the markup is inserted slightly after the onload event is fired, I found that to be a good value to ensure that it was removed. You could run that code a few times at different intervals to ensure it is removed faster.

On 01/13/2011 at 1:40:26 PM EST Ricardo Campos wrote:
15
Hi Pete

I had the code in my website but I still have the some problem in IE. You know what I can do to get rid of that in IE as well?

On 09/20/2011 at 6:23:06 PM EDT Flugtag wrote:
16
language="javascript"? That crap was deprecated... TWELVE YEARS AGO.

On 10/13/2011 at 11:52:22 AM EDT baggi-t wrote:
17
Does your javascript still work? I've tried it but to no avail, has skype now sneaked around this kill as it has the meta tag?

On 10/13/2011 at 12:04:34 PM EDT baggi-t wrote:
18
Does your javascript still work? I've tried it but to no avail, has skype now sneaked around this kill as it has the meta tag?

On 01/22/2012 at 10:32:00 AM EST wiicker95 wrote:
19
This really is nonsense. Why would anyone pollute its code with some useless javascript, or add CSS divs and classes when there's a better way to do it?

So there's how to do it :

Let's say you want to add this telephone number to your website :

1-234-567-8910

So this number will actually be detected by skype plug-in, and in order to avoid it, just add an HTML comment inside, like this :

1-234-5<!--Anti Skype Plug-in Comment-->67-8910

Or just put some random text.

It will always work, no javascript needed ;)

On 07/16/2012 at 6:49:53 PM EDT Ramón wrote:
20
They actually do support a meta tag, https://cssmantra.wordpress.com/2010/06/14/stopping-skype-plugin-phone-number-mess-up-in-design/

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

On 01/17/2013 at 6:30:12 PM EST j9time wrote:
21
thank you wiicker95!! your solution is so much simpler and more elegant!

Post a Comment




  



Spell Checker by Foundeo

Recent Entries



foundeo


did you hack my cf?