Open Source · JavaScriptFreeVersion 1.4 · 7 KB minified · no dependencies · MIT

messenger-tracker: which chat button brought the lead

Analytics usually sees only "a WhatsApp click happened". Whether it came from the header, the footer or a floating widget, and on which page, stays invisible: all buttons share one address. The script attaches the place and the page to every click. Supports WhatsApp, Telegram, Viber, VK, MAX and Yandex Messenger.

Source code and guide (GitHub)All tools

GA4 events

An event per place

One messenger_click event for any click plus per-place breakdown. See which placement brings leads and optimize Google Ads and page layout by it.

Event parameters

Messenger, place, page

The GA4 event carries messenger, place, link_id and page_path. The same data goes to dataLayer for GTM (mt_messenger, mt_place, mt_id, mt_page). Yandex Metrica goals via data-ym are supported as well.

Nothing breaks

Invisible to visitors

Link addresses never change. The script does not load any counter itself, so cookie consent stays yours. Configured through attributes, no curly braces, so CMS templates like MODX, Twig or Blade never choke.

Setup in 10 minutes

One script tag and place markers

Add the script. With gtag on the page the GA4 event is sent automatically; with GTM and no gtag the data goes to dataLayer. Add data-ym only if you also want Metrica goals.
Put data-mt-place on blocks with buttons: footer, widget, pricing block. Without markers the place is inferred from header, footer, nav, aside or main content.
In GA4, register messenger and place as custom event parameters so they show up in reports. With GTM: data-layer variables, a custom event trigger messenger_click and a GA4 event tag.
Verify: open any page with ?mt_debug=1 in the address and click the buttons. Links stay closed, a plate in the corner shows messenger, place, page and what was accepted by GA4, dataLayer and Metrica. Force English with &mt_lang=en.

messenger-tracker test page in debug mode: after a click the corner plate shows the messenger, place and page plus delivery to dataLayer and Metrica — The repository ships a test page: with ?mt_debug=1 a plate in the corner shows messenger, place and page after each click, and which sink accepted the event.

Demo on the same test page: click a WhatsApp link, then a Telegram link, and read the plate.

The messenger-tracker debug plate on a 390 pixel mobile screen after a WhatsApp click — The same plate on a 390px screen: messenger, place and page stay readable.

<script src="https://cdn.jsdelivr.net/gh/trendbender/[email protected]/messenger-tracker.min.js" defer></script>

<!-- optional: Yandex Metrica goals on top of GA4 -->
<script src="https://cdn.jsdelivr.net/gh/trendbender/[email protected]/messenger-tracker.min.js"
        data-ym="12345678" data-goals="messenger_click,messenger_%place%" defer></script>

<footer data-mt-place="footer"> ... links to wa.me, t.me ... </footer>
<a class="chat-widget" data-mt-place="widget" href="https://wa.me/15550000000">Ask a question</a>

What the report looks like:

messenger_click  (GA4 event)
  └ whatsapp
      ├ widget  → /services/, /pricing/, ...
      └ footer  → /contact/, ...
  └ telegram
      └ header  → /

Why this and not UTM

Why not UTM and not a code in the link

Link-click goals see only the address, and header, footer and widget buttons usually share one.
Messengers never return UTM tags to analytics: the person leaves the site and does not come back.
The Telegram ?start= parameter works for bots only, and no equivalent exists for the other messengers.
A code inside the WhatsApp message is visible to the client and can be deleted; in sensitive niches it pushes people away. The script has this option, off by default.

Want contact analytics set up end to end?

We install the script, wire GA4 events and build the report of which pages and buttons bring leads, then check calls, forms and chats together.

Get a free 4Queries audit