Your Website Loses 67% of Mobile Calls Without This Button
A plumber in Parramatta ranked number one on Google for "emergency plumber Sydney" — and got fewer calls than his competitor sitting in position three. The difference had nothing to do with SEO, reviews, or pricing. His competitor's mobile site had a click-to-call button fixed to the top of every page. The plumber's site had a phone number in the footer, unlinked, in grey text. On a phone, that means the visitor must memorise the number, close the browser, open the dialler, and type it manually. Roughly seven in ten don't bother.
Google's own research shows 70% of mobile searchers call a business directly from search results — and those who visit a website expect the same zero-friction experience. A BrightLocal study found 60% of Australian consumers have used a click-to-call button in the past year. Forrester Research puts the value starkly: phone calls convert to revenue at 10–15 times the rate of web form submissions. For a tradie, a salon, or a restaurant, the phone call is the booking. Everything else on your website is getting them to the point where they pick up the phone.
This guide covers what a click-to-call button is, the exact code to implement one, platform-specific instructions for WordPress, Wix, and Squarespace, where to place it for maximum tap rate, and how to measure whether it is actually driving calls. If you have a developer, hand them this article. If you don't, the basic version takes about ten minutes.
What Is a Click-to-Call Button?
A click-to-call button is a hyperlink — usually styled as a button — that uses the tel: URI scheme to trigger a phone call when tapped on a mobile device. When a visitor on their smartphone touches it, their device immediately opens the dialler with your number pre-filled. One tap to confirm, and they are calling you. On a desktop, clicking the same link typically prompts the user's default calling application (Skype, FaceTime, Teams) — or does nothing, which is why placement and conditional display logic matters.
The underlying HTML is deliberately simple:
<a href="tel:+61412345678">Call Us Now</a>The tel: protocol is supported by every modern mobile browser — Chrome, Safari, Samsung Internet — and has been a web standard since RFC 2806. You do not need JavaScript, a plugin, or a third-party service for the basic functionality. What separates a high-performing click-to-call button from a low-performing one is placement, design, copy, and visibility — not the underlying code.
The Numbers Behind Click-to-Call
Understanding why click-to-call works requires understanding how Australians actually use their phones to find and contact local businesses.
- 65% of Australian web traffic is mobile (StatCounter, 2025). For local service businesses — tradies, salons, restaurants, medical practices — that figure often exceeds 75%.
- The average local business phone call lasts 4–5 minutes, compared to a web session that averages under two minutes. Callers are higher intent.
- Adding a click-to-call button increases mobile call conversions by 200–300% in Google's case studies of small business advertisers. Organic website visitors respond similarly.
- 78% of local mobile searches result in an offline purchase within 24 hours (Google/Ipsos). The person searching "electrician near me" at 7pm needs someone tonight — not a web form answered tomorrow.
- Google Business Profile listings with a click-to-call mechanism receive up to 25% more direct calls than listings that route visitors through a website first.
Every additional tap between a visitor and your phone number is a conversion you are leaving on the table. A linked phone number reduces that friction from three taps (copy number, open dialler, type) to one.
Step-by-Step: How to Add a Click-to-Call Button
The following steps work for any website with access to custom HTML. Platform-specific instructions for WordPress, Wix, and Squarespace follow in the next section.
Step 1: Format Your Phone Number Correctly
The tel: URI requires your number in E.164 international format — country code, no spaces, no brackets, no hyphens. For Australian numbers:
- Mobile:
+61412345678(drop the leading zero, add +61) - Landline:
+61298765432(drop the leading zero from the area code)
Incorrect formatting — tel:0412 345 678 — fails silently on some devices, particularly older Android browsers. Always use +61 format for Australian numbers, and test on a real device before publishing.
Step 2: Write the Base HTML
The minimum working implementation:
<a href="tel:+61412345678" class="cta-call">Call 0412 345 678</a>Display the number in human-readable format in the link text — 0412 345 678, not +61412345678. Visitors should be able to read the number if they want to verify it before calling. The class cta-call is referenced in the CSS below.
Step 3: Style It as a Button
A plain hyperlink gets ignored. A visually distinct button gets tapped. Add this CSS to your stylesheet or a <style> block:
.cta-call {
display: inline-block;
background-color: #e63c00;
color: #ffffff;
padding: 14px 28px;
border-radius: 6px;
font-size: 1.1rem;
font-weight: 700;
text-decoration: none;
letter-spacing: 0.02em;
}
.cta-call:hover {
background-color: #cc3400;
}The colour is your choice — use your brand's primary action colour. Orange and red outperform blue for call-to-action buttons in heat-map studies because they signal urgency. Apple's Human Interface Guidelines and Google's Material Design both specify a minimum tap target of 44×44 pixels — the padding above satisfies that requirement on all modern devices.
Step 4: Make It Sticky on Mobile
A button buried in the body copy will be missed. A sticky bottom bar — fixed to the bottom of the screen regardless of scroll position — converts at two to three times the rate of an inline button. Add this to your CSS:
.sticky-call-bar {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #e63c00;
text-align: center;
padding: 14px;
z-index: 9999;
display: none;
}
@media (max-width: 768px) {
.sticky-call-bar {
display: block;
}
}And the corresponding HTML:
<div class="sticky-call-bar">
<a href="tel:+61412345678"
style="color:#fff; font-weight:700; font-size:1.1rem; text-decoration:none;">
Tap to Call — 0412 345 678
</a>
</div>The @media (max-width: 768px) rule ensures the sticky bar only appears on mobile and tablet. Desktop visitors see nothing, avoiding the jarring experience of a sticky phone bar on a screen where clicking it does nothing useful.
Step 5: Add It to Your Navigation and Header
Sticky bars work, but a phone number also belongs in the header of every page — visible above the fold before the visitor scrolls anywhere. Place it in the top-right corner of your navigation, styled as a button. This is the standard pattern for service businesses: navigation links on the left or centre, prominent call button on the right. Visitors trained by years of web browsing look to the top-right for the primary action on a page.
Platform-Specific Instructions
WordPress
In any WordPress theme using the block editor (Gutenberg): add a Button block, set the link to tel:+61XXXXXXXXX, and set the text to your number. For the sticky bar, paste the HTML and CSS into the Additional CSS panel (Appearance → Customise → Additional CSS) and add the HTML via a Custom HTML block in your header template or footer.php. If you use Elementor, the Button widget accepts tel: links directly — paste the formatted number into the link field. The same applies to Divi and WPBakery.
Wix
In Wix (from $17/month AUD), click Add Elements → Button, then under Link choose Phone and enter your number. Wix automatically formats the tel: link. For a sticky mobile button, use the Wix mobile editor to add a strip fixed to the bottom — toggle to mobile view, add a button element, and pin it to the bottom of the viewport. Important: Wix's mobile editor is a separate layer from the desktop editor. Changes made in desktop view do not automatically transfer to the mobile layout.
Squarespace
In Squarespace (from $16/month AUD), add a Button Block to any section and set the URL to tel:+61XXXXXXXXX. For site-wide placement, add the button to a header or footer section. Squarespace does not natively support a sticky mobile bar without a Code Block — paste the sticky CSS into Design → Custom CSS and the HTML into a Code Block in your page footer, or into the Footer Code Injection field under Settings → Advanced → Code Injection.
Custom-Built Website
If you have a custom-built site, all of the HTML and CSS above applies directly. A competent developer can implement a sticky mobile call bar, a header button, and Google Analytics 4 event tracking in under an hour. For businesses looking at professional builds — including websites for tradies and contractors — click-to-call and mobile optimisation should be standard inclusions, not optional extras.
Where to Place Your Click-to-Call Button
Placement is where most businesses get this wrong. A single button at the bottom of the contact page helps almost no one — the visitor who navigated to the contact page was already committed. The visitors you are losing are those on your home page, your services page, or your blog, who have not yet decided to contact you. Meeting them where they are with a visible call option is what moves the needle.
The five highest-converting placements, in order:
- Sticky mobile footer bar — visible on every page at every scroll position. Consistently the highest-converting placement for mobile visitors.
- Top-right header button — above the fold on every page. The top-right corner is where visitors look first for the primary action.
- Hero section — the large image and text block at the top of the home page. A Call Now button here, alongside a secondary CTA like Get a Quote, captures visitors in the first five seconds.
- Service pages — immediately below each service description. A visitor reading about your services is evaluating whether to contact you. Do not make them scroll further to find the number.
- Above the fold on the contact page — the phone number as a click-to-call button should be the first element on the page, before any form.
For service businesses that take bookings by phone — hair salons and barbers, medical practices, emergency tradespeople — the sticky footer bar and header button combination is non-negotiable. For restaurants and cafés, the same applies. ZenPacks Australia and similar hospitality-adjacent businesses regularly see the majority of their phone enquiries placed by mobile visitors who found them through a category search — a click-to-call button on the menu or ordering page captures those calls before the visitor taps back to Google and rings a competitor.
Design Principles That Increase Tap Rates
Use Action Colour, Not Brand Colour
Many businesses colour the call button the same as their logo — a navy blue that blends into a navy header, or a dark green that reads as a text link. Your call-to-action button should be a high-contrast colour that stands out from the surrounding design. If your brand is blue and white, use orange or green for the button. The goal is unmissable, not cohesive. A button that blends in converts at roughly the same rate as no button at all.
Button Copy That Converts
Generic copy kills tap rates. "Contact Us" converts poorly. "Call" is better. "Call Now — Free Quote" is better still. The most effective button copy for Australian service businesses combines an action verb with a specific, relevant benefit:
- "Call Now — Available 24/7" (tradies, emergency services)
- "Call to Book Your Appointment" (salons, clinics, physios)
- "Order by Phone — 0412 345 678" (restaurants, takeaways)
- "Call for a Free Quote" (tradies, pest control, painters)
- "Call Now — Same-Day Service" (locksmiths, plumbers, electricians)
Size and Touch Target
The button must be large enough to tap accurately with a thumb. Apple's Human Interface Guidelines specify a minimum touch target of 44×44 points. Google's Material Design recommends 48dp minimum. A button with at least 14px vertical padding and 24px horizontal padding on a font size of 1rem or larger meets this threshold on all modern devices. Buttons that are too small generate what UX researchers call tap rage — the user taps, misses, taps again, and gives up. You do not get a third chance.
Contrast Ratio
WCAG 2.1 accessibility guidelines require a contrast ratio of at least 4.5:1 for normal text. White text on a solid red or orange button comfortably meets this threshold and produces the highest visibility against most page backgrounds. Use the WebAIM Contrast Checker (webaim.org/resources/contrastchecker) to verify your colour combination before publishing. Failing accessibility contrast is also a flag in Google's PageSpeed Insights — another reason to get it right from the start.
Should Click-to-Call Appear on Desktop?
Most articles skip this question. Here is the honest answer: yes, but only with a sensible fallback experience.
On desktop, a tel: link triggers the user's default calling application — Skype, FaceTime, Microsoft Teams, or a softphone. Roughly 30–40% of Australian desktop users have a default calling application configured. For those users, the button works exactly as intended. For the other 60–70%, clicking it does nothing useful — or worse, triggers an error dialog.
The correct approach for desktop is to display the phone number as a readable, clickable link rather than a prominent sticky button. Desktop visitors can see the number, note it, and dial manually — that interaction is natural on a desktop. The sticky, always-visible button treatment belongs on mobile. Use the @media (max-width: 768px) approach from Step 4 to show the full sticky bar on mobile only, while the header button remains visible on all screen sizes. This is a five-minute CSS change that eliminates the awkward desktop experience entirely.
The Hidden Reason Most Click-to-Call Buttons Fail
Here is what almost no article on this topic mentions: the button is only as good as the phone experience that follows it.
If a visitor taps your click-to-call button at 6:30pm on a Friday and the call goes unanswered — or worse, to a carrier's generic voicemail — you have lost them. According to Google's research, 85% of people who cannot reach a business on the first call will not call back. You got the tap. You lost the customer.
A click-to-call button that drives volume requires the following operational infrastructure to convert that volume into revenue:
- A professional voicemail greeting — your name, your business, what you do, and when you will return the call. Not the carrier's robotic default.
- Stated availability hours next to the button — "Available Mon–Fri 7am–6pm. Leave a message — we call back same day." Set expectations before they tap, not after.
- Actual same-day follow-up on missed calls — check for missed calls at least twice a day if you run a sole-trader operation. Every missed call notification is a lead.
- A call tracking number — services like CallRail (from approximately $50 AUD/month) or Google Ads call extensions let you attribute calls to specific pages, keywords, and campaigns. Without this data, you are optimising blind.
For trade businesses like APX Trade Group, licensed electricians operating across Sydney, missed calls mean missed jobs that go to the next tradie in the Google results. A click-to-call button is the trigger; the process behind answering it is what converts. The businesses that see the largest lift from click-to-call are those that pair it with a disciplined same-day response system.
How to Track Click-to-Call in Google Analytics 4
Adding a button without measuring it is like running a Google Ads campaign without checking conversions. Google Analytics 4 can record every tap as an event, giving you data on which pages drive calls and which don't.
Method 1: GA4 Enhanced Measurement (No Code Required)
GA4's Enhanced Measurement automatically tracks outbound link clicks, including tel: links. Go to Admin → Data Streams → your web stream → Enhanced Measurement and ensure Outbound clicks is toggled on. You will see tel: link clicks appear in GA4 as click events with the link_url parameter set to your phone number. This requires no code changes and works on any website that has GA4 properly installed.
Method 2: Custom Event for Full Attribution
For granular data — including which page section each click came from — add an onclick attribute to your button HTML:
<a href="tel:+61412345678"
onclick="gtag('event', 'click_to_call', {
'event_category': 'phone',
'event_label': 'sticky_footer'
})">
Call 0412 345 678
</a>Replace sticky_footer with a descriptive label for the button's location — header_button, hero_section, services_page. In GA4, create a conversion event from click_to_call under Admin → Conversions. You now have a conversion metric tied directly to phone call intent — one you can optimise against in Google Ads or use to prioritise page improvements in Google Search Console.
What to Do With the Data
Cross-reference click-to-call event data in GA4 with your top landing pages in Google Search Console. If your services page drives 40% of your organic traffic but generates only 5% of your click-to-call taps, the button placement on that page needs work. Conversely, if a blog post about a common customer problem drives a disproportionate number of call taps, consider building more content in that category. The data tells you where intent is highest — follow it.
Click-to-Call Implementation: DIY vs Professional Website
| Option | Click-to-Call Capability | Implementation Effort | Cost |
|---|---|---|---|
| Wix (DIY) | Native Phone button type; sticky bar requires manual setup | 30–60 min | $17–$36/month AUD |
| Squarespace (DIY) | Button Block with tel: link; sticky bar needs code injection | 30–90 min | $16–$49/month AUD |
| WordPress + Elementor (DIY) | Full control; sticky bar via plugin or custom CSS | 1–2 hours | $10–$30/month AUD hosting |
| Freelancer-built site | Full implementation including GA4 tracking | Part of build brief | $1,500–$4,000 build + $20–$50/month hosting |
| Agency-built site | Full implementation, analytics, A/B testing | Handled for you | $3,000–$8,000 build + $50–$200/month hosting |
| weauto ($99 + GST) | Click-to-call included, mobile-optimised, GA4 ready | None — live in 5 business days | $99 + GST build + optional $24.95 + GST/month care |
The technical barrier to a basic click-to-call button is low. The barrier to implementing it correctly — sticky mobile bar, GA4 event tracking, correct E.164 number format, WCAG-compliant design, and integration with your overall mobile layout — is moderate. For a business owner managing staff, stock, and customers simultaneously, "moderate" often becomes "it never gets done." That is the real cost of a button that lives on a to-do list.
Frequently Asked Questions
Does a click-to-call button work on every phone?
Yes. The tel: URI scheme is supported by every major mobile browser — Chrome, Safari, Firefox, Samsung Internet, and Opera — on both iOS and Android. It has been a web standard since RFC 2806 and works on all devices manufactured after 2010. The only variable is whether the device has an active SIM card and mobile service. Users on Wi-Fi-only tablets may be prompted to use FaceTime Audio or another VoIP application instead of a standard phone call.
Can I use a click-to-call button with a 1300 or 1800 number?
Yes. Format the number as tel:1300123456 or tel:1800123456 — no country code prefix is required for Australian 1300 and 1800 numbers, as they are not in the standard E.164 geographic format. Test on an actual mobile device before publishing to confirm it dials correctly. Some VOIP providers that supply 1300 numbers have quirks with mobile dial behaviour — verify against your specific provider.
Will a click-to-call button improve my Google ranking?
Not directly — Google does not use click-to-call taps as a direct organic ranking signal. However, a well-placed button reduces bounce rate (a visitor who calls rather than immediately leaving still counts as an engaged session in some GA4 configurations), and strong mobile usability contributes to better Core Web Vitals scores, which Google has confirmed are a ranking factor. The indirect SEO benefit is real even if the direct link is not. More importantly, your Google Business Profile's click-to-call activity does influence your local pack prominence — GBP listings with higher call-through rates consistently appear higher in map results.
Should I show my number in the button or just say "Call Now"?
Show the number. Displaying the actual number in the button copy achieves two things: it builds trust (the visitor can see they are calling a local mobile or landline, not a call centre), and it provides a manual dial option for users who want to call later from a different device. "Call Now — 0412 345 678" consistently outperforms "Call Now" in tap rate tests because it reduces anxiety about who will answer. A visitor who can read the number before tapping feels in control.
What is the difference between click-to-call and call tracking?
Click-to-call is the mechanism — the button that initiates a phone call. Call tracking is the measurement layer — software that assigns unique phone numbers to different traffic sources so you can attribute each call to its origin. Services like CallRail (from approximately $50 AUD/month) and Australian provider Delacon provide full call tracking. Google Ads call extensions offer basic tracking for paid traffic at no additional cost. For most small businesses, GA4 event tracking on the click-to-call button is sufficient. Full call tracking becomes valuable once you are running paid campaigns across multiple channels and need to compare cost-per-call by source.
My website was built years ago — can I add click-to-call without rebuilding it?
Yes, if you have access to your website's HTML via a CMS, a web editor, or your hosting control panel. Add the HTML and CSS from Steps 2–4 of this guide to any page. For site-wide placement, the sticky bar code goes into a footer template file or a globally-included snippet — most CMS platforms have a "Footer Code Injection" or "Global Footer" field for exactly this purpose. If you do not have access to your own website code, that is a separate and serious problem worth addressing regardless of click-to-call — a website you cannot edit is a liability.
What happens when someone taps click-to-call outside my business hours?
They reach your voicemail — so make it earn its keep. Record a professional greeting that includes your business hours and explicitly invites them to leave a message: "You have reached [name] at [business]. We are available Monday to Friday, 7am to 5pm. Please leave your name, number, and what you need, and we will call back the same business day." A well-scripted voicemail converts a missed call into a callback request. Pair it with a note near your call button — "Available Mon–Fri 7am–5pm. Leave a message for same-day callback" — to pre-empt the frustration of calling after hours and hearing silence.
Does click-to-call work with Google Business Profile?
Google Business Profile has its own built-in click-to-call mechanism in the listing card shown in Google Search and Google Maps — this is separate from your website button but operates identically. Ensuring your GBP listing has an accurate, verified phone number is equally important to having one on your website. Many local businesses receive more direct calls from their GBP listing than from their website, particularly for searches on mobile. Both should be set up, both should display the same number, and both should be monitored — GBP Insights shows you call volume directly from the listing, which you can compare against your GA4 click-to-call event data to understand your full call funnel.
If your current website does not have click-to-call built in as standard, weauto builds mobile-optimised websites for Australian small businesses for $99 + GST, live in five business days — with sticky call bars, correct number formatting, and GA4 event tracking included from day one.
Related reading
weauto builds professional websites for Australian local businesses — live in 5 business days for $99 + GST.