Humblytics
  • Overview
    • Introduction to Humblytics
    • Features Overview
    • Frequently Asked Questions
    • Pricing Plans
      • Plus Plan
      • Business Plan
      • Scale Plan
      • Enterprise Plan
  • How to Get Started
    • Create a New Account
    • Adding Webflow Analytics to Your Site
    • Adding Framer Analytics to Your Site
  • How to Track Custom Form Submissions
    • How to Track Typeform Submissions in Framer
    • How to Track Cal.com Booking Submissions in Framer
    • How to Track Typeform Submissions in Webflow
    • How to Track Cal.com Booking Submissions in Webflow
  • How to Track Custom Click Events
    • How to Track Custom Click Events on Any Website with Humblytics
    • How to Add Custom Event Tracking for Framer Sites
    • How to Add Custom Event Tracking for Webflow Sites
  • Understanding Your Data
    • Understanding Site Traffic
    • Understanding Pages Data
    • Understanding Forms Data
    • Understanding Click Data
  • Split Testing Overview
    • Setting Up a Split Test
    • How to Create an A/B Page Variant
    • How to Analyze Split Test Data
    • Using the Humblytics A/B Split Test Sample Size Calculator
  • Campaign Tracking with UTM Links
  • Support & Resources
    • Resources
  • Privacy
Powered by GitBook
On this page

Was this helpful?

  1. How to Track Custom Click Events

How to Track Custom Click Events on Any Website with Humblytics

Tracking key user interactions—like CTA clicks or nav link taps—shouldn’t require a dev team or a tag manager. Humblytics makes it incredibly easy to track custom clicks on any website by using HTML attributes, just like you would in Webflow.

This works for:

  • WordPress (via HTML blocks or page builders)

  • Shopify (in Liquid templates)

  • Static HTML sites

  • Framer, Squarespace, Ghost, etc.

Step 1: Install the Humblytics Tracking Script

Add this to the <head> of your site:

<script async src="https://app.humblytics.com/hmbl.min.js?id=ID"></script>

Replace ID with your actual site ID from your Humblytics dashboard.

Step 2: Add a Custom Attribute to Any Clickable Element

To track a specific button or link, just add a custom attribute like this:

<a href="/signup" humblytics="hero-signup-btn">Sign up</a>

Or:

<button humblytics="pricing-cta">View Pricing</button>

No JavaScript. No configuration. Just pure, privacy-first tracking.

Step 3: See Results in Your Dashboard

  1. Go to your Humblytics dashboard

  2. Click on the Clicks tab

  3. Look for your custom attribute value (e.g. hero-signup-btn)

You’ll see:

  • Click counts

  • Page breakdowns

  • Traffic source filters

  • Device segmentation

Best Practices

What to Track

Example Attribute

Hero CTA

humblytics="hero-cta"

Pricing button

humblytics="pricing-btn"

Navigation link

humblytics="nav-about"

Footer contact button

humblytics="footer-contact"

Use clear and unique values to make reporting and filtering easy inside your dashboard.

Where to Add Attributes by Platform

Platform

How to Add the humblytics Attribute

Webflow

Use the “Custom Attributes” field in the Designer

WordPress

In Gutenberg, use the HTML view or a Code block

Shopify

Add attributes in theme.liquid or section files

Framer

Use Embed blocks or custom components

HTML sites

Add directly to your element’s tag

Summary

No listeners, no JS, no cookies—just drop a humblytics="your-id" attribute on your element, and Humblytics handles the rest.

PreviousHow to Track Custom Click EventsNextHow to Add Custom Event Tracking for Framer Sites

Last updated 12 days ago

Was this helpful?