Goal Tracking

Track button clicks, form submissions, and user interactions using HTML attributes.

Basic Click Tracking

Add the two-bucks-goal attribute to any element:

<button two-bucks-goal="signup_clicked">
  Sign Up
</button>

When the button is clicked, a custom event named "signup_clicked" will be tracked.

With Custom Properties

Add additional data using two-bucks-goal-* attributes:

<button 
  two-bucks-goal="plan_selected"
  two-bucks-goal-plan="pro"
  two-bucks-goal-price="29">
  Choose Pro Plan
</button>

This tracks an event with:

Event name: plan_selected
Properties: { plan: "pro", price: "29" }

Works On Any Element

Goal tracking works on any clickable element:

<!-- Links -->
<a href="/pricing" two-bucks-goal="pricing_link_clicked">
  View Pricing
</a>

<!-- Divs (with cursor pointer) -->
<div two-bucks-goal="hero_cta_clicked" style="cursor: pointer">
  Get Started
</div>

<!-- Forms -->
<form two-bucks-goal="newsletter_submitted">
  <input type="email" />
  <button type="submit">Subscribe</button>
</form>

Property Naming

Property names are converted from two-bucks-goal-* to lowercase with underscores
two-bucks-goal-user-id becomes user_id
two-bucks-goal-plan-name becomes plan_name

Examples

E-commerce Purchase Button

<button 
  two-bucks-goal="add_to_cart"
  two-bucks-goal-product-id="123"
  two-bucks-goal-product-name="Premium Widget"
  two-bucks-goal-price="49.99">
  Add to Cart
</button>

Form Submission

<form two-bucks-goal="contact_form_submitted">
  <input name="name" />
  <input name="email" />
  <button type="submit">Send</button>
</form>

PreviousCustom Events

NextScroll Tracking