Skip to main content

Chrome Extension (Intent Tagger)

The kenbun Intent Tagger is a Chrome extension that lets you visually tag elements on any website to track user interactions. Instead of writing code, you point and click to define what should be tracked — button clicks, form submissions, even data from JavaScript objects.

What It Does​

The Intent Tagger captures engagement signals without touching your website's code:

  • Visual Element Tagging: Click on buttons, links, or forms to start tracking them
  • Global Tagging: Create rules that apply across multiple pages (header/footer elements)
  • DOM Data Extraction: Pull data from JavaScript objects like Google Tag Manager's dataLayer or user information
  • DataLayer Event Capture: Intercept GTM dataLayer.push() events in real time (purchases, form submissions)
  • Lead Profile Updates: View and annotate identified leads from any page
  • LinkedIn Import: Add contacts from LinkedIn with automatic account resolution
  • Team Collaboration: Share tagging rules across your organization

The extension works hand-in-hand with the Web Beacon — you tag elements with the extension, and the beacon sends the events to kenbun.

Why Use It​

  • Fast Setup: No developer required. Marketing ops teams can deploy tracking in minutes
  • Universal Compatibility: Works on any website where the kenbun beacon is installed, including third-party sites
  • Dynamic Elements: Track elements that appear conditionally or are loaded via JavaScript frameworks
  • Testing-Friendly: Test tagging rules offline before deploying to production

Installation​

From the Chrome Web Store​

Install directly from the Chrome Web Store.

Load Unpacked (Developer Mode)​

For local development:

  1. Download or clone the kenbun repository
  2. Open Chrome and navigate to chrome://extensions
  3. Enable Developer Mode (toggle in the top-right corner)
  4. Click Load unpacked
  5. Select the chrome-extension directory
  6. The extension icon will appear in your toolbar

Requirements: Chrome version 114 or later (for Side Panel support).

Configuration​

Before you start tagging, configure the extension to connect to your kenbun environment.

Initial Setup​

  1. Click the kenbun Intent Tagger icon in your Chrome toolbar
  2. The side panel opens on the right side of your browser
  3. Click the Settings icon
  4. Configure the following:
SettingDescriptionExample
Backend URLYour kenbun backend URLhttps://app.kenbun.io
Organization Unit IDYour OU identifierou_abc123 (auto-detected from session when logged in)
Testing ModeEnable to work offline without backendChecked for local testing, unchecked for production
  1. Click Save Settings

Auto-Detection of Your Organizational Unit​

When you're logged into kenbun in the same browser, the extension automatically detects your Organization Unit ID from your session. The settings panel shows:

Organization Unit ID: Auto-detected from session

You can override this by manually entering an OU ID (useful for testing multiple organizations).

Testing Mode​

Enable Testing Mode to work offline:

  • Tags saved to local Chrome storage only
  • No backend API calls required
  • Tags do NOT sync across devices

Disable Testing Mode for production:

  • Tags saved to both local storage AND your kenbun environment
  • Tags sync across devices
  • Team members can see and use the same tags

Advanced Authentication Settings​

Authentication is handled automatically when you sign in to kenbun. In most cases, no additional configuration is needed.

For custom or self-hosted deployments, the extension supports overriding the authentication domain and token template. Contact your administrator for the correct values, then enter them under the Advanced: Auth Settings section in the settings panel.

The extension stores settings in Chrome's secure synchronized storage, so they persist across browser sessions and devices.

Feature Guides​

The extension's features are documented in focused sub-pages:

  • Page Tags & Global Rules — Tag elements on a single page or across multiple pages by URL pattern, with custom attributes for additional context
  • DOM Scrapers & DataLayer Events — Extract data from JavaScript objects on the page, and capture GTM dataLayer.push() events in real time
  • Lead Profile & LinkedIn Import — Annotate identified leads with contextual attributes; import contacts from LinkedIn with automatic account resolution
  • Troubleshooting — Common errors, best practices, and worked-example use cases

Integration with the Web Beacon​

The Chrome extension and the Web Beacon work together:

  1. Extension creates rules: You visually tag elements and create DOM scrapers
  2. Extension injects listeners: Content script attaches click/form handlers to matching elements
  3. Events sent to beacon: window.kenbun.push(['track', 'Element Click', { metadata }])
  4. Beacon handles delivery: Session management, visitor identification, sending events to kenbun

Without the beacon installed, the extension cannot send events. The beacon must be present on the target website. See Web Beacon documentation for details on how custom events are structured.

Standardized Event Types​

The extension uses standardized event types in Title Case for consistency across all tracking:

Event TypeWhen It FiresCustom Name Stored In
Element ClickTagged element is clickedevent_name metadata field
Form SubmitTagged form is submittedevent_name metadata field
Your scraper's Event NameDOM scraper captures dataUsed as the event_type directly
DataLayer: <event_name>GTM dataLayer push matches allowlistEvent name embedded in type

Why standardized types? Easier querying (filter by Element Click to see all clicks), consistent with beacon auto-tracked events, predictable vocabulary across the platform.

Next Steps​