Insert telephone number in header on mobiles

Please note:the following snippet applies to the Astrid, Perth, Sydney and West themes.

You can use the following code to insert a clickable telephone number right before the header on mobiles devices. This way, your visitors can simply click the number to call you directly.

jQuery(function($) {

	var telNumber = '123.456.789'; //Change this to your phone number. (keep the quotes)
	var beforeNumber = 'Call us at  '; //Some text that shows up before the number. (keep the quotes)

	//Nothing to change under this line
	if (window.matchMedia('(max-width: 991px)').matches) {
		$( '<div class="mobilePhone" style="text-align:center;font-size:18px;padding:10px;"><a href="tel:' + telNumber + '">' + beforeNumber + telNumber + '</a></div>').insertBefore('.site-header');
INFO: This is a JS snippet. If you don't have a child theme or don't know how to use one, we recommend that you use this plugin.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.