How to Track Click Events on Custom / Self‑Hosted Site

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 src="https://app.humblytics.com/optimize.min.js?id=YOURID"></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

Last updated

Was this helpful?