To track button clicks without writing code, use a tool that records clicks for you and lets you define events visually: install one tracking script, open your site in "picker" mode, click the button you care about, give it a name, and save. From then on every click on that button is counted, tied to the visitor who made it, and — if you mark it as a conversion — counted toward your goals. This guide shows the three ways to track button clicks (code, Google Tag Manager, and a visual picker), walks through the no-code method step by step with real screenshots, and covers the matching rules and mistakes that decide whether your numbers can be trusted.
Key takeaways
- Page views tell you where visitors went; button clicks tell you what they tried to do. "Add to cart", "Request a quote" and "Chat with us" are your earliest signals of intent.
- Google Analytics 4 doesn't track clicks on your own buttons out of the box — you need code, Google Tag Manager, or a tool with a visual event picker.
- With Clicktics you click the button on your live page and the event is created for you: no tags, no triggers, no developer.
- Match by element (CSS selector) when the button's design is stable, and by visible text when classes change between deploys.
- Count visits, not raw clicks, and look at who clicked — their source, journey and recording — not just how many.
Why track button clicks at all?
Most analytics setups measure pages: how many people viewed the product page, how many reached the thank-you page. That leaves a blind spot in the middle. A visitor who clicks "Add to cart" and then abandons, or clicks "Request a quote" and never finishes the form, looks identical in page reports to someone who glanced at the page and left. Button clicks fill that gap. They're micro-conversions — small, measurable steps that show intent long before a purchase or a lead.
Tracking the right clicks answers practical questions:
- How many visitors try to buy, compared with how many complete checkout?
- Is anyone using the size guide, the comparison table, or the pricing toggle you spent a week building?
- Which traffic source sends people who click "Request a quote" — not just people who land on the page?
- Did the new button design get more clicks than the old one?
If your site gets traffic but few sales, click data is often where the leak first shows up — our guide to why a website gets traffic but no conversions walks through the full diagnosis.
Three ways to track button clicks
| Method | What you do | Skills needed | Typical setup time | What you get |
|---|---|---|---|---|
Code (e.g. a gtag('event', …) call in an onclick) | A developer adds a tracking call to each button and deploys | JavaScript, access to the codebase | Hours per release cycle | Exact control; a counter in your analytics tool |
| Google Tag Manager | Enable click variables, create a click trigger with conditions, create a GA4 event tag, preview, publish | GTM and GA4 concepts (triggers, variables, tags) | 30–60 minutes per event the first time | An event in GA4 reports, usually without visitor-level detail |
| Visual event picker (Clicktics) | Click the button on your live page, name the event, save | None | About two minutes | A counted event, plus who clicked, their source, journey and session recording |
A note on Google Analytics 4: its "enhanced measurement" tracks things like scrolls, outbound links, site search, file downloads and form interactions automatically, but not clicks on your own buttons. A click on "Add to cart" or "Book a demo" needs one of the three methods above.
How to track a button click without code, step by step
Here's the whole process in Clicktics, using a demo outdoor-clothing store. The example: tracking the "Add to cart" button on a product page.
Step 1: Install the tracking script once
Add the Clicktics script to your site — one line in the page head, or through your site builder's "custom code" setting. That's the only code involved, and you do it once. From that moment, every click is recorded along with the element that was clicked and its visible text, which is what makes everything below possible without further setup.
Step 2: Open your website in picker mode
In Clicktics, go to Events, click New Event, then Pick on my website. Your site opens in a new tab with a green bar at the top. As you move the mouse, the element under the cursor is outlined and its selector appears at the bottom of the screen:

div.product > div > div.buy > button.add-to-cart. Press Esc to cancel (demo store).Picker mode only turns on when the link carries your own site key, and that page load isn't recorded — so choosing buttons doesn't add fake visits to your reports.
Step 3: Click the button
Click "Add to cart". The page doesn't actually add anything to a cart; instead the selection is sent back to your Clicktics tab, where the event form fills itself in. The match type is set to CSS Selector, the selector is filled in, and the event name is taken from the button's text:

Step 4: Decide whether it's a conversion
Turn on Mark as conversion for clicks that represent a goal in themselves — a "Request a quote" or "Book a call" button, for example — and optionally give it a value in US dollars. Leave it off for helpful-but-not-final actions like opening a size guide. Then click Create event.
Step 5: See who clicks
The Events page lists every event with the number of visits that triggered it, which ones count as conversions, and a breakdown by country:

The more useful view is the Visitors list, which shows the events each visitor triggered next to their location, traffic source, landing and exit pages, time on site, and a play button for their recording. Conversions show in green, other events in blue, and the "With events" and "With conversion" filters narrow the list to people who did something:

This is where click tracking becomes useful. A count tells you 24 visits clicked "Add to cart". The list tells you which 24 people they were, where they came from, and lets you watch the ones who added to cart and then left.
Selector or text: choosing how a button is matched
Clicktics can match a click two ways, and the choice decides whether your event keeps working after the next website update.
Match by CSS selector
The picker gives you a path to the element, built from up to four levels of the page structure — for example div.product > div > div.buy > button.add-to-cart. If the element has an id, the selector is simply #that-id, which is the most reliable of all. A click counts when its recorded selector contains the value you saved, which gives you a useful choice:
- Keep the full path to count one specific button in one place.
- Shorten it — to
button.add-to-cart, say — to count every "Add to cart" button across all product pages, whatever surrounds it.
Match by text
Choose Text Match and type the button's visible label, such as Request a quote. A click counts when the clicked element's text contains those words, ignoring upper and lower case. Text matching survives redesigns that change classes, but it counts every element with that wording — so "Learn more" is a poor choice, while "Request a quote" is usually unique. Only the first 60 characters of an element's text are recorded, so match on the start of long labels.
Which should you use?
| Situation | Best match type |
|---|---|
The button has an id | CSS selector (#id) |
| Same button repeated on many pages | CSS selector, shortened to the button's own class |
Your site's class names look random (css-1x9k2p) and change on every deploy | Text match |
| A label that appears once and won't change | Either; text is easier to read later |
| A generic label like "Submit" or "Learn more" | CSS selector |
If you can edit your site, the single best thing you can do for click tracking is give important buttons a stable id — id="request-quote" — and pick them after that.
Beyond buttons: other events you can track without code
The same Events page handles more than clicks. Each of these is set up the same way — a name, a match type and a value:
- URL contains / URL exact — someone reached a page, such as
/checkoutor/thank-you. The "Reached checkout" event in the screenshots above is one of these. - Referrer — a visit arrived from a particular site, such as a partner or a review site.
- Scroll depth — a visitor scrolled at least a given percentage of a page, such as 75%.
- Time on page — a visitor stayed on a page for at least a given number of seconds.
- JS error — a JavaScript error whose message contains the text you enter, so you can count how many visits hit a broken script.
Which button clicks are worth tracking?
Track the clicks that sit between arriving and converting. A good starting set, by type of site:
- Online stores: Add to cart, size guide, add to wishlist, apply coupon, the checkout button in the cart.
- SaaS: Start free trial, Book a demo, the monthly/yearly pricing toggle, "Compare plans", Log in.
- Lead generation and local business: Request a quote, call button, WhatsApp button, "Get directions", chat.
- Content and media: newsletter sign-up, outbound affiliate links, downloads, "Read next".
Five to ten well-named events beat fifty vague ones. If you wouldn't change anything based on a number, don't track it.
Turning click data into decisions
- Compare clicks with completions. In the demo store, 24 visits clicked "Add to cart" but only 11 reached checkout — so at least 13 visits that wanted the product never got to the payment step. That's a cart problem, not a traffic problem.
- Watch the near-misses. Filter Visitors to "With events", find people who clicked "Add to cart" but never reached checkout, and play their recordings. Shipping costs revealed late, a forced account, a coupon field that sends people hunting for codes — you'll usually see the reason in a handful of sessions. Our guide to seeing what visitors do on your website covers how to review recordings quickly.
- Check clicks by source. The Visitors list shows each clicker's source, so you can see whether "Request a quote" clicks come from organic search, newsletters or paid social. Pair it with UTM tracking to compare individual campaigns.
- Look for clicks that don't work. If people click something repeatedly or click things that aren't buttons, that's frustration rather than intent — see our guide to rage clicks and dead clicks.
- Record only the visits that matter. In Settings → Tracking you can tell Clicktics to start recording only when a visitor triggers one of your events — so you get replays of people who clicked "Add to cart", not thousands of quick bounces.
Common click-tracking mistakes
- Counting clicks instead of visits. One impatient visitor can click a slow button eight times. Clicktics counts each event once per visit, so the number means "visits that did this".
- Matching on classes that change. Some site builders and frameworks generate class names like
css-1x9k2pthat change on every deploy. An event built on them quietly drops to zero. Use text match, or ask for anid. - Forgetting the mobile version. Many sites show a different button on phones — a sticky "Add to cart" bar, a hamburger-menu link. Pick it on a narrow browser window too, or match by text so both versions count.
- Vague names. "Button click 3" means nothing in six months. Name events after the action: "Request a quote", "Size guide opened".
- Not re-checking after a redesign. After any visual update, glance at the Events page the next day. A count that suddenly falls to zero usually means the button changed, not that people stopped clicking.
What about privacy?
Click tracking records which element was clicked and its visible text — not what visitors type. Form fields are masked in the visitor's browser before anything is sent, and you can keep any part of a page out of recordings entirely. If you track visitors in the EU or UK, run the script behind your consent banner like any analytics tool; our comparison of GDPR-compliant session replay tools explains the setup.
Frequently asked questions
Can I track button clicks without Google Tag Manager?
Yes. A tool with a visual event picker, such as Clicktics, records every click automatically and lets you define an event by clicking the button on your live page. There are no tags, triggers or variables to configure, and no code beyond the one-time tracking script.
Does Google Analytics 4 track button clicks automatically?
Not clicks on your own buttons. GA4's enhanced measurement covers page views, scrolls, outbound link clicks, site search, video engagement, file downloads and form interactions. To count clicks on buttons like "Add to cart" or "Book a demo", you need code, Google Tag Manager, or a tool that records clicks for you.
How do I track clicks on a phone number or WhatsApp button?
Treat it like any other button: open your site in picker mode and click the call or WhatsApp button, or create a text-match event on its label, such as "Call us". Mark it as a conversion if a call is a lead for your business.
Will clicks from before I created the event be counted?
The count on the Events page starts when you create the event. Because Clicktics already records every click, the Visitors list matches your new event against clicks that were recorded earlier, so you can see past visitors who clicked that button as well.
What's the difference between a click event and a conversion?
Every conversion is an event, but not every event is a conversion. Mark an event as a conversion when it represents a goal — a quote request, a booked call — and optionally give it a value. Leave supporting actions, like opening a size guide, as plain events.
Start tracking your buttons today
Clicktics records every click from the moment the script is installed, so tracking a button takes a click and a name — then shows you who clicked, where they came from, and the recording of what happened next. Heatmaps, funnels, form analytics and live chat come with it.
Try it free for 14 days → No credit card required — or see everything included on the features page.
Tomás García
Tomás García writes for the Clicktics blog about session replay, analytics engineering, and building privacy-first products that agencies love. Reach the team at [email protected].