Prevent Skype Ruining Your Design

11th November 2011

When a user installs the Skype application on their PC, it gives them the option to install a component in their web browsers which convert telephone numbers into links to initiate a chargeable Skypeout call when clicked.

This may sound like a good idea, however if you want your contact area to be presented as it was designed it with the fonts, text size and colours intact, this can be annoying.

The method outlined by Skype to prevent this from happening involves adding a meta tag to the document head to tell the skype component to not touch the numbers, however this does not work reliably and in my experience is usually ignored.

Add a hidden character

Rather than rely on Skype’s unreliable override, my preferred solution is to make telephone numbers still look like telephone numbers to visitors, but not to Skype. To do this we can add an underscore in the middle of the telephone number. If we enclose it within a span we can hide it with CSS so it does not display on the website. <span style=”display:none;”>_</span>

Using this within WordPress

I turned this into a simple function to go into either the theme’s functions.php or into a functionality plugin. This adds an easy-to-remember shortcode _ which can be inserted within any phone number.

// ==============================================
//       PREVENT SKYPE CLICK-TO-CALL HIJACK
//       usage: add _ within the phone number
//       eg: Tel: 123_45678
//       cubecolour.co.uk
// ==============================================
function cc_noskype( $atts, $content = null ) {
	return '_';
}
add_shortcode('noskype', 'cc_noskype');