skilld
All skills
wix avatar

/wix-vibe-headless

@1563591 official
by Wix.comwix/skills33 stars
33

Client-only, dependency-free REST scaffolds for connecting an already-built front end (a vibe-coded app, an HTML/JSX/Vite project, a design-tool export) to a live Wix site over the site's public WIX_CLIENT_ID — the browser talks to Wix directly, no SDK, no backend, no build step. One skill covering every Wix business solution: Stores/eCommerce storefront (products, cart, checkout), Bookings (services, slots, appointments), Blog (posts, categories, tags), Events & Tickets (browse, RSVP, ticketing), Portfolio (collections, projects, galleries), Restaurants (menu, online ordering, reservations), Forms (any visitor-fillable form — contact/enquiry, signup, waitlist, application, survey, quote request; schema-driven render + submit), CMS / Wix Data (list, detail, filter, CRUD), Pricing Plans (memberships, subscriptions, checkout), and Members (custom login — email+password, Google/Facebook, and custom SSO — plus account areas and member-gated content). Each vertical ships a copy-as-is REST layer plus wiring instructions. Read-only over the owner's content — never provisions, never mocks data. Triggers: connect my Wix store/shop, build a storefront over Wix, add a cart and checkout, connect Wix Bookings, take appointments/reservations, show my Wix blog, list my Wix events, sell tickets, take RSVPs, build a portfolio from Wix Portfolio, show my restaurant menu / order online / book a table, display my Wix CMS collection, wire a contact form to Wix, add a contact/enquiry form, build a signup or application form, take survey responses, sell membership/subscription plans, add member login / sign up, let members log in with Google or Facebook, custom login page, account / profile page, gate content behind login, sign in with SSO/Okta, 'here is my WIX_CLIENT_ID', connect this app to my Wix site over REST. Use this for CLIENT-ONLY REST integration over an existing site; use `wix-headless` instead for SDK + Wix CLI builds, hosting, and one-prompt new-site creation.

Ask your Agent

Use this Skill: https://skilld.dev/gh/wix/skills/wix-vibe-headless

This session only. Nothing lands on disk.

referencesportfolioseedSEED.md

≈1.6k tokens on demand. Your agent reads this file only when SKILL.md points to it.

Portfolio — seeding

Seed a Wix Portfolio by calling seed-portfolio.cjs — don't hand-write the REST calls. It's a build-time module (run via exec_tool, not shipped in the app) that abstracts every Wix Portfolio seed operation. require it and call the functions with plain data.

Collections before projects. A project is assigned to collections by a collectionIds array that Wix does not validate — a wrong id silently orphans the project. Create the collections first, then thread their real ids into each project.

Seeding is additive — never delete or overwrite existing content. Don't clean up, don't remove "sample" data, don't reset. Just add.

DEFAULT — one call. setupPortfolio(ctx, plan) runs the whole flow in the right order (collections → projects → items → covers), threading ids in memory. Pass covers/items only when you have them. Drop to the individual functions below only for step-by-step control.

// build-time exec_tool
const { accessToken } = await base44.asServiceRole.connectors.getConnection("wix");
const seed = require(require("path").resolve(".agents/skills/wix-vibe-headless/references/portfolio/seed/seed-portfolio.cjs"));
const ctx = { token: accessToken, siteId: WIX_METASITE_ID };

const summary = await seed.setupPortfolio(ctx, {
  collections: [
    { title: "Brand Identity", description: "Logo systems and visual identities." },
  ],
  projects: [
    { title: "Northwind Rebrand", description: "Full identity refresh for a logistics firm.",
      collection: "Brand Identity",                    // resolved to that collection's id
      details: [{ label: "Year", text: "2025" }],
      // cover/items are optional and attached IN this one call. Pass plain urls — the module imports
      // them to Wix Media for you (portfolio binds by file id). Use the FINAL https://media.base44.com/...
      // url from the COMPLETED generate_image (it runs in the background while you build — wait for it),
      // never a still-generating /__generating__/<id>.png placeholder.
      coverImageUrl: "https://media.base44.com/…",
      items: [{ sortOrder: 1, title: "Hero", imageUrl: "https://media.base44.com/…" }] },
  ],
});
// summary => { collections:[{id,slug,revision}], projects:[{id,slug,revision}], itemsCreated, coversAttached }

Escape hatch — individual functions

Reach for the functions below only when the one-call setupPortfolio doesn't fit (step-by-step control, partial re-seed). setupPortfolio is built from them, in this order:

const collections = await seed.createCollections(ctx, [                                 // STEP 1
  { title: "Brand Identity", description: "Logo systems and visual identities." },
]);
const projects = await seed.createProjects(ctx, [                                       // STEP 2
  { title: "Northwind Rebrand", description: "Full identity refresh for a logistics firm.",
    collectionIds: [collections[0].id], details: [{ label: "Year", text: "2025" }] },
]);

// optional — import each url to Wix Media first (portfolio binds by file id), then attach
const files = await Promise.all(imageUrls.map((u) => seed.importImage(ctx, u)));   // → [{ id, url }]
await seed.attachProjectCovers(ctx, projects.map((p, i) => ({ id: p.id, revision: p.revision, imageId: files[i].id, height: 1024, width: 1024 })));
await seed.attachCollectionCovers(ctx, collections.map((c, i) => ({ id: c.id, revision: c.revision, imageId: files[i].id, height: 1024, width: 1024 })));
await seed.createProjectItems(ctx, [{ projectId: projects[0].id, sortOrder: 1, title: "Hero", imageId: files[0].id, height: 1024, width: 1024 }]);

Functions

fn does
setupPortfolio(ctx, plan) DEFAULT — one call: collections → projects → items → covers; returns {collections,projects,itemsCreated,coversAttached}
createCollections(ctx, collections) STEP 1 — [{title,description?,hidden?}] → [{id,slug,revision}]
createProjects(ctx, projects) STEP 2 — [{title,description?,collectionIds,details?,hidden?}] → [{id,slug,revision}]
importImage(ctx, url) import an external url into Wix Media → {id,url} (file id + wixstatic url); covers + items bind by this file id
attachProjectCovers(ctx, [{id,revision,imageId,height,width}]) PATCH each project's cover (optional); imageId = a Wix Media file id from importImage
attachCollectionCovers(ctx, [{id,revision,imageId,height,width}]) PATCH each collection's cover (optional)
createProjectItems(ctx, [{projectId,sortOrder,title,imageId,height,width}]) one POST per gallery image (optional)

hidden defaults to false (shown) — omit it for visible entities; send hidden: true only to hide. setupPortfolio installs the Wix Portfolio app first (installPortfolioApp, idempotent), so seeding works even if the site doesn't have it yet.

Reference

If a call returns a shape you didn't expect, or you need an operation this module doesn't cover, use the documentation skill available in your environment to search + read the live Wix API reference — never guess. The authoritative source recipe is wix-headless/references/inline-recipes/setup-portfolio.md.

Transcribed from the recipe — NOT yet live-verified. The endpoints/fields mirror setup-portfolio.md; confirm against a real run or the Wix docs before trusting edge shapes.

Read a method's page before writing its call: it carries the exact body shape, the required permission scope, and the response envelope.

Source: SKILL.md on GitHub

Third-party checks

1 warning6d3 checks · Risk SAFE
  • Gen Agent Trust Hub6d

    The skill is safe and provides a comprehensive integration framework for Wix Headless services. It uses platform-secured connectors for authentication and includes automated scaffolding utilities to assist with project setup.

  • Socket6d

    No alerts

  • Snyk6d

    Risk: MEDIUM · 1 issue

Provenance

Signed by skilld at 1563591. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub 2 days ago.

Activeupdated 4 weeks ago

README badge

README badge for wix/skills/wix-vibe-headless