WiXAnything

Give Claude Code real sight of a Wix Studio site — every element, ID, type, layout, style, cloud media asset & CMS field — so the Velo it writes is accurate and correctly connected.

WiXAnything is a drop-in knowledge layer for the official Wix + Claude setup (Wix CLI + Git Integration). The official integration lets Claude edit your site's code; WiXAnything lets Claude actually see the site — so it stops guessing.

---

Why this exists

When you connect a Wix site to a local repo, Claude can edit your Velo (JS) code — but it's blind to everything you built in the Studio editor. It can't see which elements exist, their IDs, their types, or how the page is laid out. So it guesses, and writes code like:

$w('#priceBox').text = 'From $30k';   // ❌ fails — #priceBox is a Box, not a Text

…which targets the wrong element or the wrong property, and you burn time fixing it.

The fix is hiding in plain sight. Wix already generates a map of every element's #id → $w type (via the official wix sync-types) — but it lands in the gitignored .wix/types/ folder, so a gitignore-respecting agent never reads it. WiXAnything:

1. Surfaces that map into committed, agent-readable files (wix-elements.md / .json) — every element's ID, type, page, whether Velo references it, and how to set it.
2. Adds the visual layer by reading your published page: real geometry, computed styles, and layering, keyed back to your IDs. (The official Wix MCP/plugin exposes none of this to an external agent — Wix's own dev community has an open request for it.)
3. Bridges the cloud the repo can't see: a Wix repo has no local image files and no CMS schema, so wix:media surfaces the Media Manager (each asset's ready-to-use Velo .src) and wix:cms surfaces every Data Collection + field schema — both into committed maps, so Claude references real assets and real field keys instead of guessing.

Result: Claude codes against your actual site — right elements, right properties, correctly connected — the first time. It's a read-only layer that extends the official Wix + Claude integration and stays 100% within Wix's Terms (official tooling + reading your own public page; no editor automation).

Before:  Claude can't see elements → guesses IDs/types → broken Velo, back-and-forth
After:   Claude reads wix-elements.md → every ID + type + layout + how to set it → it just works

Measured: in a 10-task Velo benchmark (same model, only difference = the map), Claude went from 2/10 correct (blind) → 10/10 (sighted), with element-ID hallucinations 7 → 0. → docs/BENCHMARK.md

---

How it compares

The official Wix + Claude integration edits your code, but nothing in it exposes the site's elements, layout, or styles to an external agent. That's the gap WiXAnything fills:

For an external coding agent	Wix MCP	Wix Site MCP	Aria (Wix AI)	WiXAnything
Element IDs + $w types	❌	❌	❌	✅
Layout + computed styles + nesting	❌	❌	❌	✅
Edit your Velo against real IDs	➖	❌	❌	✅
AI visual editing of native elements	❌	❌	✅¹	➖²
Media assets + CMS field schema in the repo	➖³	➖³	❌	✅
Live CMS / Stores / bookings row data	✅	✅	➖	➖⁴

_{¹ Aria edits visually but only as Wix's own first-party agent — not your repo/agent. ² Frontier; needs Wix-internal APIs (see the ceiling doc). ³ WiXAnything writes media + CMS schema into committed, agent-readable maps (wix:media / wix:cms); the MCPs can query the same REST live but don't commit it to your repo. ⁴ For live row data / writes, use the Wix MCP.}

Install

Run from your Wix site's repo root (the folder with wix.config.json):

# 1) install the addon straight from GitHub (no local paths)
npx -y github:AnthonySeshat/WiXAnything --repo .
#    …or pin a release for reproducible installs:
#    npx -y github:AnthonySeshat/WiXAnything#v0.3.0 --repo .

# 2) enable the visual (layout/styles) scanner — one-time
cd visual && npm install && cd ..

# 3) one command: sync element types + scan layout/styles + merge
npm run wix:full -- --url "<your-published-page-url>"

Then open wix-elements.md — that's what Claude reads. Re-run npm run wix:full … (or npm run wix:elements for types only) after any change in the editor.

🔒 Needs the Wix CLI logged in (wix login) once, so it can sync the latest element maps. The committed wix-elements.md then works for anyone. (Public repo — the npx github: install works for everyone; npm publish would later enable a shorter npx wixanything.)

---

What you get

• 🟢 Element map (proven). wix-elements.md/.json + a CLAUDE.md rules block: every element, its $w type, hidden state, Velo-referenced flag, and per-type "how to set it". Refreshed headlessly by wix sync-types. npm run wix:diff shows what changed.
• 🎨 Visual layer (proven). The visual/ scanner reads your published page(s) for real geometry + computed styles + layering, merged into the map (--full walks multi-step UIs; pass --url more than once for whole-site coverage). Each scan is fingerprint-matched to its page, so layout never leaks across same-named elements on different pages.
• 🖼 Media bridge. npm run wix:media — a Wix repo has no local image files (media lives in the cloud Media Manager), so this surfaces them into wix-media.md/.json with each file's ready-to-use Velo .src. Works zero-auth from URLs already in code; lists the whole Media Manager with a read-only Wix API key. See docs/MEDIA.md.
• 🗄 CMS bridge. npm run wix:cms — lists every Data Collection + field schema (keys, types, references) into wix-cms.md/.json with a ready-to-paste wixData.query(), so Claude writes wix-data queries against real field keys instead of guessing. Needs a Wix API key ("Manage Data Collections"). See docs/CMS.md.
• 🟡 Code-owned UI. npm run wix:scaffold custom-element|html-component|repeater <name> — sections Claude owns 100% in code (one editor placement each). See docs/BRIDGE.md.
• 🟢 Companion app. npm run wix:app "<name>" — a private @wix/cli app that auto-places a code-owned widget on the homepage + an Editor panel (real @wix/editor SDK).
• 📄 The honest ceiling. docs/STRUCTURAL-EDITING.md grades what's possible vs. what needs Wix's internal APIs. docs/MCP-SETUP.md: Wix MCP is for data (CMS/CRM), not elements.

Commands

Command	Does
npm run wix:full -- --url "<page>"	element map + layout/styles + merge (one shot)
npm run wix:elements	wix sync-types + regenerate the element map (types)
npm run wix:diff	regenerate + report ids added / removed / retyped
npm run wix:doctor	auth check → sync → generate, with status
npm run wix:lint	flag .text-on-a-container / unknown-id bugs in your Velo (uses the map)
npm run wix:media	list cloud Media Manager images/files → wix-media.md (full listing needs a Wix API key)
npm run wix:cms	list CMS Data Collections + field schema → wix-cms.md (needs a Wix API key)
npm run wix:scaffold <kind> <name>	scaffold a code-owned component
npm run wix:app "<name>"	scaffold the companion app (widget + editor panel)

How it works

.wix/types/<pageId>.d.ts         published page (Thunderbolt model + rendered DOM)
   (gitignored id→type map,         │  comp-id ↔ nickname + geometry + computed styles
    via official wix sync-types)     ▼
        └────────────┬───────────────┘
                     ▼
   wix-elements.json + wix-elements.md + CLAUDE.md   (committed; Claude reads these)

Pure Node, zero runtime dependencies (the visual scanner adds Playwright in visual/). npm run selftest validates the toolkit without a real site.

Limits to know

• The .wix/types map is id→type only; geometry/styles come from the optional visual scan, which reads the published/test-site state (use --full for multi-step UIs). Layout is present only for pages you actually scanned (plus global header/footer/menu elements) — a blank Layout means "not scanned", not "no element". Scan more pages with extra --url flags.
• HiddenCollapsedElement masks the real type until the element is shown.
• $w can never create native elements — new native UI needs one editor placement (or a code-owned Custom Element / the companion app). True visual structural editing of native elements is a Wix-internal capability (see the honest ceiling doc).

Security

.env is never committed (gitignored + a pre-commit hook blocks it). The Wix Headless/OAuth client ID is public-by-design. See SECURITY.md.

License

MIT — see LICENSE. Not affiliated with or endorsed by Wix.com or Anthropic; "Wix"/"Velo" are trademarks of Wix.com Ltd., "Claude" of Anthropic.