返回 Skill 列表
extension
分类: 营销与增长无需 API Key

webflow-browser-api

通过浏览器API从JavaScript控制Webflow分析和优化。在管理跟踪同意、集成CMP(如OneTrust、TrustArc)、跟踪实验变体、设置自定义访客属性或个性化用户体验时使用。

person作者: jakexiaohubgithub

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

| Method | Description | |--------|-------------| | 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