mcpField
W
webflow-browser-api

webflow-browser-api

github.com/224-industriesMarketing & growth1069 installsUpdated 1w ago
Repository

About webflow-browser-api

webflow-browser-api is a reference skill for developers using the JavaScript Browser API on Webflow sites with Analyze or Optimize enabled. It covers consent, experiment events, and visitor attributes.

Key features

  1. 01Manage visitor tracking consent
  2. 02Receive experiment variation events
  3. 03Set custom visitor attributes
  4. 04Search references by tag or keyword

Use cases

  1. 01Configure tracking consent
  2. 02Forward experiment results to analytics tools
  3. 03Filter audiences and results by visitor attributes

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/224-industries/webflow-skills --skill webflow-browser-api

After installing, type/webflow-browser-apiin Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

references/
attributes.md
consent-management.md
introduction.md
optimize-overview.md
variations.md
wf-ready.md
scripts/
search_references.py

Details

From the project README

Webflow Browser API

The Browser API is a JavaScript interface exposed via the global wf object on all Webflow sites with Analyze and Optimize enabled. It requires no manual installation. Use it to manage consent, track experiments, and personalize user experiences.

Key Concepts

  • Global wf object — Automatically available on all sites with Analyze or Optimize enabled
  • wf.ready() — All Browser API calls must be wrapped in this readiness callback. See references/wf-ready.md
  • Consent management — Three methods to manage tracking consent: getUserTrackingChoice(), allowUserTracking(), denyUserTracking()
  • Variations — Track experiment results via onVariationRecorded() and forward to analytics tools
  • Custom attributes — Set visitor attributes via setAttributes() for audience targeting and result filtering (Enterprise only)

API Methods

MethodDescription
wf.ready(callback)Execute code after the Browser API loads
wf.getUserTrackingChoice()Returns "allow", "deny", or "none"
wf.allowUserTracking(options?)Opt user into tracking
wf.denyUserTracking(options?)Opt user out of tracking
wf.onVariationRecorded(callback)Register a callback for variation events
wf.setAttributes(scope, attributes)Set custom visitor attributes

Important Notes

  • The Browser API is only available on sites with Webflow Analyze or Optimize enabled
  • Custom JavaScript attributes (setAttributes) are only available on Enterprise sites
  • Always wrap all API calls inside wf.ready() to prevent calls before initialization
  • Place scripts in <head> custom code for earliest possible execution

Reference Documentation

Each reference file includes YAML frontmatter with name, description, and tags for searchability. Use the search script in scripts/search_references.py to find relevant references.

Getting Started
Consent Management
Optimize
Searching References
# List all references with metadata
python scripts/search_references.py --list

# Search by tag (exact match)
python scripts/search_references.py --tag <tag>

# Search by keyword (across name, description, tags, and content)
python scripts/search_references.py --search <query>

Scripts

  • scripts/search_references.py: Search reference files by tag, keyword, or list all with metadata

Comments

Markdown supported