Call Now Button Widget
Add a single, unmistakable Call now button wherever a visitor decides to ring you - beside a price list, under a service description, at the end of an emergency page. Show the number in the button if you like, add your phone hours underneath, and offer 'or send a text' for people who would rather not talk.
Live preview
Under the widget on your page: Powered by A2Z Tools
Embed code
Fill in the required fields above - until then this code shows nothing on your site.
<div data-a2z-kit="call-now-button"></div> <script async src="https://a2z.tools/embed/kit.js" referrerpolicy="no-referrer"></script>
One small script from A2Z draws the component on your page inside its own Shadow DOM. It loads no social-network or tracking scripts and sets no cookies. How the A2Z kit works.
Works with
How it works
Phone numbers arrive in every style - (555) 010-0123, 020 7946 0000, +44.20.7946.0123. RFC 3966 says the visual separators in a telephone number carry no meaning, so the button strips spaces, dots, dashes and brackets and checks that what remains is 5 to 16 digits, optionally after a single plus sign. Letters are refused rather than translated: a vanity number like 0800 FLOWERS would dial differently on different keypads, so write its digits. The link becomes tel:+442079460123 while the label keeps your formatting - 'Call 020 7946 0000' reads naturally to local visitors. Add the international prefix if people call you from abroad; a number without it dials as a local number in the caller's own country. The hours note under the button is plain text you write, such as 'Mon-Fri 9am-6pm', and is never compared with the clock. Turn on the text link and an sms: link to the same number appears beside it. Brand style colours the button in a deep call green (#15803D) with white text at more than 4.5:1 contrast.
Method
- digits = number with spaces . - ( ) removed; valid when ^\+?[0-9]{5,16}$
- href = tel:<digits>; label = 'Call now', or 'Call ' + number as typed when 'show number' is on
- Text link (optional) = sms:<digits>, with ?&body=<encoded> when a message is set
Worked examples
UK number shown in the button
Inputs: phone 020 7946 0000; show number on
Result: Button 'Call 020 7946 0000' -> tel:02079460000
The label keeps the spaces you typed; the link has digits only.
International number with hours and a text link
Inputs: phone +1 (555) 010-0123; hours Mon-Fri 9am-6pm; text link on
Result: Call now -> tel:+15550100123; under it 'Mon-Fri 9am-6pm' and 'or send a text' -> sms:+15550100123
Brackets and dashes are removed from both links; the hours are shown exactly as written.
A vanity number
Inputs: phone 0800 FLOWERS
Result: No button on the live page; the builder asks for digits
Letters are refused instead of being guessed.
Limitations
- Letters in vanity numbers are not converted to digits.
- Extensions (ext. 4) are not dialled; put them in the hours note instead.
- Whether a computer can place the call depends on the visitor's own software.
Where publishers use it
- A 24-hour locksmith's landing page for paid search, where the call is the only conversion that matters
- A GP surgery or vet listing its appointment line with the hours the phones are staffed
- A taxi firm's booking page offering 'or send a text' for passengers in noisy places
- A product page for made-to-measure furniture where buyers want to talk before ordering
Questions
What happens when someone clicks it on a laptop?
The browser hands tel: to whatever the computer uses for calls - FaceTime or Continuity on a Mac, Phone Link or Teams on Windows - and usually asks first. If nothing is installed, nothing happens, which is why 'show number' is useful: a desktop visitor can read and dial it.
Should I include the country code?
If any caller might be abroad, yes: +44 20 7946 0000 works from every country, while 020 7946 0000 only works inside the UK. You can still show the local format in the label by writing your own button text, such as 'Call 020 7946 0000'.
Can it show 'Closed' outside my hours?
No. The hours line is your own text and is always shown; the button never hides itself or claims to know whether anyone will answer. For a live open/closed status use a business-hours widget next to it.
Does the text link prefill a message?
Only if you set one. The link uses the sms:number?&body= form, the variant widely used because both iOS and Android messaging apps accept it; without a message it opens a blank text to your number.
Sources
- RFC 3966: The tel URI for Telephone Numbers - IETF . global numbers start with +; visual separators - . ( ) are ignored
- RFC 5724: URI Scheme for Global System for Mobile Communications (GSM) Short Message Service (SMS) - IETF . sms: URI and the body field
Cite or recommend this tool
If you reference this tool in an article, course or documentation, these formats are ready to copy. They are optional - nothing is added to your site unless you paste it.
A2Z Tools Call Now Button https://a2z.tools/embed/call-now-button
<a href="https://a2z.tools/embed/call-now-button">A2Z Tools Call Now Button</a>
[A2Z Tools Call Now Button](https://a2z.tools/embed/call-now-button)
Call Now Button by A2Z Tools - https://a2z.tools/embed/call-now-button
Related widgets
-
A bottom bar for phones with up to five big actions: call, WhatsApp, directions, share, book.
-
A round corner button that unfolds into labelled Call, WhatsApp, Email, Directions and booking actions.
-
Large Call, Text, Email, WhatsApp and custom-link tap targets in a stack, row or pill bar.
-
A digital business card with call, email, website and directions buttons plus a .vcf contact download.
-
Your phone, email, address and reference numbers in a tidy list, each with a one-tap Copy button.
-
A scroll-to-top button that waits until readers scroll, with a progress ring and keyboard-friendly focus.
