A WhatsApp button for your website: the link, a pre-filled message, placement on mobile and measurement

A WhatsApp button for your website is usually the most comfortable way for an Israeli visitor to get in touch: no form, no waiting for a reply by email. The problems start after it is installed. On mobile the button covers the form's submit button, nobody knows which page the chat started from, and nothing at all is recorded in Analytics. In this article we go through the official link format according to WhatsApp, how to prepare a different opening message for each page, where to place the button on mobile, how to turn a click into a measured conversion, and what is needed for the button to be accessible.

How to build a WhatsApp button for your website: the official format

Every plugin, every website builder and every link generator produces the same single link in the end. So it is worth knowing it, even if someone else installs the button for you.

According to the WhatsApp Help Centre, the format is https://wa.me/<number>, where <number> is a full phone number in international format, with no leading zero, no brackets and no dashes. In Israel that means dropping the 0 at the start of the number and putting 972 in its place. Zeros inside the number itself stay.

• The actual number: 052-123-4567
• The correct link: https://wa.me/972521234567
• What does not work: a number with dashes, with brackets or with a 0 at the start

Two things worth knowing about the button itself. First, WhatsApp has an official branded button called Chat on WhatsApp, in green and white and in three sizes, and they ask you to use it as it is, without altering it. Second, the official button exists in English only. On a Hebrew site that means a choice in practice: either the official button as it comes, or a button of your own with text in Hebrew. We usually go for the second, because דברו איתנו בוואטסאפ ("talk to us on WhatsApp") is clearer to an Israeli visitor than wording in English. More button wordings are collected in our article on the call to action button.

After installing it, test the link in three situations: on a phone with the app installed, on the phone of someone who does not have your number saved, and on a computer, where the link opens in WhatsApp Web.

A different pre-filled message on every page, so you know where the chat came from

You add a pre-filled message with the text parameter, that is https://wa.me/972521234567?text=..., with the text encoded for a web address. Most plugins encode Hebrew by themselves. If you are adding the link by hand, make sure the message appears as proper Hebrew on the phone and not as a string of symbols.

This is where the big advantage hides: you can give a different message on every page. The message is written in the first person, as though the customer wrote it, and it is what tells you where they came from.

Note two limits. First, the visitor sees the text before sending and can delete it, so keep the message short and natural enough that they will not want to. Second, UTM parameters that led to your site do not carry on with the visitor into the WhatsApp conversation, because the conversation opens in a different app. The pre-filled message is the practical substitute for that. How to attach a campaign source to a lead all the way through we explained in our guide to UTMs.

Where to put the button on mobile, and what it must never cover

A floating button in the bottom corner works, but in Israel that corner is crowded. On many sites the accessibility menu, a fixed call bar or a cookie consent banner are already sitting there. Our rule is simple: the floating button must not cover anything that can be clicked.

• The opposite side from the accessibility menu. If the accessibility widget is in the right-hand corner, put WhatsApp in the left.
• A gap from the bottom of the screen. Test it on a narrow screen (360 pixels wide) and with the keyboard open, while the visitor is filling in a form.
• Not on top of a submit button. The most common mistake: the floating button sits exactly on the form's "send" button at the bottom of the page.
• A button inside the content as well. Besides the floating button, add an ordinary WhatsApp button next to every call to action, at the end of the service page and on the contact page.

Does WhatsApp replace a form? In our view, no. The two serve different people: some prefer to write straight away, and some leave their details at night and wait for a call. So we show both on the same page, with a clear hierarchy: one primary action, and the second in a weaker design. The rest of the small changes that lift enquiries are collected in our conversion optimisation checklist.

Accessibility for a floating button: name, size and keyboard

A WhatsApp button is almost always an icon with no text, which makes it one of the elements most prone to accessibility failures. Three basic requirements:

1. An accessible name for the button. According to MDN's documentation, aria-label is designed for exactly this case: an interactive element with no visible text, such as a button containing an SVG icon. If visible text describing the button already exists on the page, MDN recommends linking to it with aria-labelledby instead of writing an aria-label. The example on WhatsApp's own page also includes an aria-label on the link. On a Hebrew site, write the name in Hebrew — for example פתיחת צ'אט בוואטסאפ ("open a WhatsApp chat").
2. Keyboard operation. The button has to be a real link or a real button, not a div that only responds to a mouse click. A visitor navigating by keyboard has to be able to reach it and see a clear focus indicator.
3. A comfortable tap area. An icon that is too small is a problem on mobile before it is ever an accessibility problem. The recommended tap-area sizes we set out in our article on the call to action button.

On top of that, if clicking opens a small chat window on the site itself rather than moving over to WhatsApp, that window has to close with the Esc key and return focus to the button. What Israeli law requires of a business website on accessibility is collected in our website accessibility guide.

Measuring clicks as a conversion, and why a click is still not a lead

A wa.me link leads to another domain, so GA4 is already counting it. According to Google Analytics' documentation, when enhanced measurement is on, a click event is sent every time a visitor clicks a link leading outside your domain, with parameters such as link_domain and link_url. In other words, the information is already there even if you have not set anything up.

The next step is to turn it into a number you actually look at:

1. Create a dedicated event for clicks where link_domain is WhatsApp's domain, so you can separate them from the rest of your outbound links.
2. Mark it as a key event. According to Google's documentation, key events are the important events you want to measure, and you can build conversions in Google Ads on top of them.
3. Import it into Google Ads if you advertise, so that the algorithm receives this action as a signal.

And now the important warning: a click is not a message that was sent. Some visitors click, see the WhatsApp screen and close it. So do not report to yourself "40 leads" when what you have is 40 clicks. Once a month, count how many new conversations really did open in WhatsApp, and compare with the number of clicks. The ratio between the two is a number worth knowing. How to set up the rest of the conversions on your site, phone calls and forms included, we explained in our conversion tracking guide.

What happens after the click: answering, business hours and common mistakes

The button is the beginning, not the end. Before you publicise it, decide who answers, from which device and during which hours. A business that routes every enquiry to the owner's personal number usually discovers after two weeks that half the messages were answered the next day.

Outside business hours there are two options: an automatic reply explaining when you get back to people, or a bot that carries on asking questions and hands over to a person with the context. Either way, do not promise a response time in the button or the message that you cannot keep. Proactive marketing on WhatsApp — messages you send to customers — has entirely different rules and consents, and those are collected in our WhatsApp marketing guide.

Four mistakes we see in almost every review:

• Mistake #1: a number in the wrong format. A 0 at the start or dashes in the link, and the conversation does not open for some users.
• Mistake #2: the same pre-filled message across the whole site. You lose the only information you could have had for free.
• Mistake #3: a floating button that covers another button. Mainly the form's submit button and the accessibility menu.
• Mistake #4: nobody measures anything. Without an event in GA4 there is no way to know whether the button is working or simply taking up space.

What Simple Web does about it

Simple Web is an AI-first marketing agency from Bnei Brak, certified Meta partners and Google advertising experts, working with 200+ businesses and holding 35 five-star Google reviews. On every website and landing page we build, the WhatsApp button is installed with a different pre-filled message per page, positioned so that it does not cover the form or the accessibility menu, and connected as an event in GA4 from day one. Accessibility is built to Israeli law, an accessible name for the button included.

When answering is itself the bottleneck, we build a WhatsApp bot that replies, qualifies and hands over to a person with all the context. The bot is trained on the business's services, prices and frequently asked questions, speaks full Hebrew, and saves the lead into the CRM. A basic bot is ready within about a week, and a tailored bot with full training within two to three weeks. The price is quoted according to scope, usually with a monthly operating cost, after a free diagnostic call.

Summary

A WhatsApp button for your website is half an hour of work, but only if you do it properly. The link has to be in international format with 972, the pre-filled message should differ on every page, and the button should not cover anything that can be clicked. Add an accessible name, set up an event in GA4, and remember that a click is still not a message. Want us to go over the button, the placement and the measurement on your site? Book a free diagnostic call.

Sources

• WhatsApp Help Center: How to use click to chat: the official link format, writing the number in international format, and adding a pre-filled message with the text parameter
• Google Analytics Help: Enhanced measurement events: the click event on links leaving your domain, and the link_domain and link_url parameters
• Google Analytics Help: Key events: marking an event as a key event and building Google Ads conversions on top of it
• MDN: aria-label: when to use aria-label for an icon button with no visible text