SKR Tips logo SKR TipsWebsite tips that actually work
Web Tips

How to Add a Click to Call Button to a Business Website

Most visitors who want to phone a local business are on a mobile, and if your number sits as plain text in the footer they have to copy it, switch apps and paste it, which is exactly where people give up and call the next result instead.

A smartphone held in one hand showing a small business website with a green call button at the top, a shop counter blurred in the background

Most visitors who want to phone a local business are on a mobile, and if your number sits as plain text in the footer they have to copy it, switch apps and paste it, which is exactly where people give up and call the next result instead. A click to call button fixes that with one tap. It is one of the smallest changes you can make to a business website and one of the few that shows up directly in your phone log.

This guide covers the link format that makes it work, three ways to add it in WordPress, where to place it, and how to track whether anyone uses it. Expect about 20 minutes for the whole job.

How a click to call button works

Under the hood it is an ordinary link that uses the tel: scheme instead of https. When someone taps it on a phone, the dialer opens with the number filled in. On a desktop it may open a calling app like Skype or FaceTime, or do nothing at all if none is installed.

The link looks like this in HTML: a href="tel:+441632960123" wrapped around the visible text, such as "Call 01632 960123." Three details matter more than people expect:

  • Use the international format in the link. Start with a plus sign and the country code, then drop the leading zero of the local number. That way the call connects even when the visitor's phone is set to a different region or roaming.
  • Strip spaces and brackets from the link part. Most phones tolerate them, but some older Android builds do not. Keep formatting only in the visible text.
  • Make the visible text readable. Show the number the way locals write it. People trust a number they recognize more than a button that only says "Call."

Three ways to add a click to call button in WordPress

1. The block editor, no plugin

Add a Buttons block, type your label, and in the link field enter tel: followed by the number, for example tel:+15555550142. WordPress will accept it like any other link. This takes two minutes and adds zero weight to the page. Put it in a reusable pattern so you can drop the same button into your header template, contact page and service pages without retyping.

Many themes, including Astra, Kadence and GeneratePress, have a header builder with an HTML or button element. Place the button there and it appears site-wide. Check the mobile header separately, because themes often use a different layout under 768 pixels and your button may vanish on exactly the devices that need it.

3. A sticky call bar plugin

Plugins that pin a call bar to the bottom of the mobile screen are popular with trades like plumbers and locksmiths, where nearly every lead is a phone call. Pick one that loads under about 15 KB, lets you hide the bar on desktop, and does not pull fonts or icons from an external server. If a plugin adds more than 50 KB, write the button yourself and use a few lines of CSS for the sticky position.

Where to place the button

Placement decides whether the button gets used. In my experience with small service sites, these spots carry almost all the taps:

  1. Mobile header, top right. Visible on every page without scrolling.
  2. The first screen of each service page. Someone reading "Emergency boiler repair" is ready to call now, not after three paragraphs.
  3. Beside your opening hours. Pair the number with hours so people know whether anyone will pick up.
  4. The contact page, above the form. Many people prefer a call to a form, especially for urgent jobs.

Keep the tap target at least 44 by 44 pixels and leave space around it. A button squeezed next to the menu icon gets tapped by accident, and accidental calls annoy both sides.

The counter-take: do not put it everywhere

The usual advice is "make your phone number impossible to miss." For many businesses that is right. For some, it backfires. A one-person bookkeeping practice that cannot answer during client meetings will collect missed calls and voicemails from people who expected a live answer, and a missed call often feels worse to a customer than a form that promises a reply within four hours.

If you cannot answer at least most calls during business hours, consider showing the button only when you are open. A small script can swap it for a "Send a message" button outside opening hours, or you can simply label it "Call, Mon to Fri 9 to 5." Honest expectations convert better than a button that rings out. And if forms become your main channel, make sure they actually arrive; our guide on why contact forms on small business sites quietly stop working covers the usual silent failures.

Tracking how many people tap it

A button you cannot measure is a guess. Tracking tap events is easy with most analytics setups:

  • Google Analytics 4. Enhanced measurement does not log tel: clicks by default. In Google Tag Manager, create a Click trigger for links whose URL starts with "tel:" and fire a GA4 event named something like phone_click.
  • Lightweight analytics. Tools like Plausible or Fathom support custom events with a small attribute or one line of script. If you have not chosen one yet, see our guide on adding website analytics without slowing your site.
  • A dedicated number. Some businesses use a separate number only on the website. Every call to it came from the site, no scripts required, though it costs a few dollars a month.

Remember that a tap is not a call. Some people tap, see the dialer, and change their mind. Compare tap events against your phone log for a month to see the real ratio. On sites I have checked, around 60 to 75 percent of taps turned into connected calls.

Common mistakes to avoid

  • Putting the number inside an image, which no phone can tap and no screen reader can read.
  • Using different numbers in the header, footer and contact page, which confuses visitors and local search listings.
  • Forgetting the label for screen readers. Visible text like "Call 01632 960123" is enough; an icon alone is not.
  • Testing only on your own phone. Try one iPhone and one Android before you call it done.

For more quick fixes in the same spirit, browse our web tips for small sites.

Frequently asked questions

Does a click to call button help SEO?

Not directly as a ranking signal. It helps visitors act, which can improve engagement and leads, and a consistent number across your site and business listings supports local search trust. Treat it as a conversion fix, not a ranking trick.

Desktops only handle tel: links if a calling app is installed and set as the default. Many visitors will see nothing happen. Keep the full number visible as text so desktop users can read and dial it themselves.

Should the button say "Call now" or show the number?

Show the number, or combine both, such as "Call 01632 960123." People like to see where they are calling before they tap, and a visible number also helps anyone who wants to save it for later.

SF
Saskia Ferrante

Saskia has built WordPress sites for clients since the early 2010s and tested more themes than she can remember. She edits SKR Tips and writes about themes, builders and plugins.

More posts by Saskia

More in Web Tips

01doorganico 084goad 3hot8 4465456 after5internprogram ahandfulofblessings ahmadpc ahomcybersecurity allodialresources annodex antiquesandperiodcollectibles aotc asianworldkashmir beedlectrics bloggertemplatefree bluefeatheragency bodyweightsolution campaign08blog carfixadvisor catstreetcollective cbstvsports cnfanspurchasing committeeof500yearsofdignityandresistance covertopsdjs cs-kaiyuangame cuestacomunicaciontotal cxoutlet dancebetgame deskgearhub destinyvillastay detectmagazine di33 diamondsteelbuildings donmo dyanadropship emarsysfinance emimattl escapechan eskitarih evautoplay everythingweddings-orlando farmzone feedviewerapp foxstudiosscratch gamevui123 gleasongrade greetingsday hacklabasu haskell iw-kaiyun jagoanproperti jilidskripsi joltbusinessfinance juegodepokergratis juegospucca kaeru-festival latestmehndidesigns lestanzediottaviano litemagazines localcommunityhero lustrsazan mariashebets menswheels newwebstechs1 nikkit ootheday oxigenvpn plurfitness prefetial probudgetcarpetcleaning psychicmrsmartin pyaten qvantor rejoignezlogis rexzbot riselayouts ruchin rwxqsgd5 sakaltime shibiaowang shop-bot strcoding tetapatrium topselller uneplanteartificielle vipertechcr webtech1223411 wo-kygaming yamaha-mekar yeknava yoybuysheets zenunwa yamaha-mekar jilidskripsi ankertoto ankertoto ankertoto ankertoto