Generated banner for Wix Vibe Headless
Generated logo for Wix Vibe Headless

Wix Vibe Headless

WixOfficialPublished by Wix

  • Skill
  • Tool integration
  • Automation and integrations
  • MIT
  • Low risk
  • Has scripts

From the author

Connect an existing front end to a live Wix site using client-only REST and its public WIX_CLIENT_ID, without an SDK or backend. Covers Stores/cart/checkout, Bookings and Rentals, Blog, Events and tickets, Portfolio, Restaurants, Donations, Forms, CMS, Pricing Plans, and Members with login, social/SSO and gated content. Use when wiring Wix business data and buyer flows into a vibe-coded app, HTML/JSX/Vite project or design export: shopping, appointments, donations, form submissions, memberships, restaurant orders/reservations and member accounts. Ships dependency-free helpers and wiring guides; never provisions or changes owner content and never mocks data. Use wix-headless instead for SDK integration, Wix CLI builds, hosting or new-site creation.
— the description by Wix

AutoGineer summary

Written by AutoGineer from the skill’s own files, not by the author

Wix Vibe Headless provides a set of dependency-free REST helpers and integration guides to connect existing frontend projects to live Wix sites. It enables developers to display Wix business data—such as store products, blog posts, bookings, and events—directly in their own applications without using the Wix SDK, backend infrastructure, or complex build steps. The skill is designed for read-only access to owner content, ensuring that data remains synchronized with the Wix dashboard.

What it does

  • Connects frontends to Wix sites using a public WIX_CLIENT_ID.
  • Provides REST helpers for Stores, Bookings, Blog, Events, and other Wix business solutions.
  • Supports member login and gated content without redirecting to Wix-hosted pages.
  • Maintains visitor sessions using tokens persisted in local storage.
  • Offers structured guidance for wiring data into HTML, JSX, or Vite projects.
  • Ensures consistent data rendering by using formatted values from Wix API objects.

When to use it

  • When you need to display live Wix site data in a custom frontend application.
  • When you want to add shopping, booking, or membership flows to an existing project.
  • When you prefer a client-only, dependency-free integration over the Wix SDK.
  • When you are working with a vibe-coded app, HTML/JSX, or a design-tool export.

Advantages

  • No backend or build step required for integration.
  • Dependency-free implementation using standard REST calls.
  • Maintains a single source of truth for business data in the Wix dashboard.
  • Supports custom UI design while leveraging Wix's business logic.

Usage examples

“Connect my React app to my Wix store products.”
The agent identifies the storefront vertical, copies the necessary REST helpers to the src directory, and provides instructions to wire the product grid component.
“How do I add a blog feed to my Vite project using my Wix site?”
The agent verifies the blog vertical, sets up the taxonomy context, and guides the integration of the shipped post-grid and post-detail components.

Install

  1. Download the skill as a ZIP:

    https://autogineer.com/agent-skills/wix/wix-vibe-headless/download
  2. Unzip it into the cross-client skills folder of your project:

    mkdir -p .agents/skills && unzip wix-vibe-headless.zip -d .agents/skills

Documentation by Wix

Wix Vibe Headless — client-only REST connectors

Wire an existing front end to a live Wix site from the browser, over the site's public WIX_CLIENT_ID, using hand-rolled REST — no @wix/sdk, no backend, no build step, no dependencies. One skill, one shared transport, and a copy-as-is REST layer per Wix business solution. Everything is read-only over the owner's content: render live Wix data or an honest empty state — never mock, never provision, never invent products, posts, events, menus, plans, reviews, or counts.

When to use this skill

  • The user has (or is building) a front end — a vibe-coded app, plain HTML/JSX, a Vite/React project, a design-tool export — and wants it to show live data from their existing Wix site and complete real purchases/bookings, all from the client.

  • They hand you a public WIX_CLIENT_ID and ask to "connect this to my Wix store / blog / bookings / events / …".

  • They want to replace placeholder/mock data with real Wix content, or add a cart, checkout, booking, RSVP, ticketing, reservation, form, or subscribe flow over an app they already have.

When NOT to use this skill

ScenarioUse instead
Build a new Wix site end-to-end from one prompt (discovery → design → build → host)wix-headless
The project should use the Wix SDK (@wix/sdk) and/or the Wix CLI, or be hosted on Wixwix-headless
Manage/configure the site via REST (install apps, seed catalogs, set up business solutions)wix-manage
Build a Wix app extension (dashboard page, widget, backend, plugin)wix-app

This skill is the deliberately client-only, REST-only path. It is independent from wix-headless (which is SDK + CLI + hosting) — do not mix the two in one project.

The shared model (applies to every vertical)

  • Auth = one public client id. WIX_CLIENT_ID is a buyer/visitor-facing credential — it only mints anonymous visitor tokens. It is not a secret; hardcoding and committing it is fine. The user provides it (their vibe/host platform surfaces a copyable prompt with the id filled in). Paste it into wix-config.js in place of the <YOUR-CLIENT-ID> placeholder.

  • Money/price fields are objects, never scalars. Every price/amount a Wix API returns — Stores price.actualPrice, Bookings service payment.fixed.price, Events ticket registration.tickets.lowestPrice, and the rest — has the shape { value, currency, formattedValue }. Render formattedValue (it already includes the currency symbol), or fall back to building from value + currency. Never drop the object straight into the UI or treat it as a number/string — that renders [object Object] or a bare unformatted number. Donations exception: campaign prices use { amount, formattedAmount }, with a decimal-string amount; donation cart options.amount must instead be a JSON number. Follow the Donations recipe.

  • Visitor token = identity. wix-client.js mints an anonymous visitor token, persists the refresh token to localStorage, and refreshes on expiry. That token IS the identity of the cart / reservation / member session — never re-mint anonymously per load or the cart silently empties.

  • Member login swaps the token set on the same client. The members vertical is custom login — the front owns its login UI; the member is never redirected to a Wix-hosted login page. On success it writes the member's tokens into the same store the visitor token used (setSessionTokens), so every subsequent wixApiRequest runs as the member and the cart/session carries over. "My …" surfaces (plans, orders, bookings, registrations) light up only once logged in.

  • ⚠️ Once you're building on Wix, keep it on Wix — auth, member data, and other business features too. If you're wiring a Wix storefront/blog/etc. over WIX_CLIENT_ID, prefer Wix for the rest of the app as well, rather than reaching for a host platform's own backend or login. Especially for auth: when the user wants members, log them in as a Wix member (members vertical) — don't bolt on the host platform's auth. Likewise, member-generated content (likes, reviews, submissions, "my …" lists) goes in a Wix CMS collection (cms vertical), not a host database.

    • The split-brain trap: the most common failure is mixing the two — e.g. storing "likes" in the host's DB while identifying the member from the Wix session (or logging in with Wix members but keying data on a host user id). The two identities never match, ownership filters silently return nothing (a like vanishes on refresh), and the data never sits with the rest of the Wix content.

    • Rule of thumb: one store and one identity per feature. For a Wix-backed feature that's the Wix member + the Wix collection, with ownership on Wix's server-stamped _owner (never a hand-stored or host-supplied member id). Using a host backend for genuinely host-only data is fine — just never straddle a single feature across both.

  • Never mock, never provision. These scaffolds are read-only over the owner's content. The owner adds products/posts/services/events/menus/plans in the Wix dashboard. If a collection is empty, show the empty state — never fabricate data, reviews, ratings, or counts.

  • Purchases go through Wix. Checkout/ticketing/plan purchase always complete via the Wix redirect-session / Wix-hosted form — never hand-build a /checkout or purchase URL.

  • Fail loudly. The helpers throw on out-of-stock, empty carts, unbookable slots, expired holds, and payment-still-owed. A green path means it really worked — don't swallow the error.

  • Copy the shipped helpers as-is — don't rewrite their internals. Wire your UI to the exported functions; don't "refactor" or reimplement the helper bodies. Several Wix request shapes are exact and easy to break (the members createRedirectSession body is the classic trap — a rewritten version returns 400 and login dies). Extend by calling the exports or adding a new wixApiRequest call for a genuine gap — never by editing the shipped ones.

  • Beyond the snippets, look it up — never guess. The templates and the shipped references/<vertical>/ helpers are the implementation — build from them first. When you hit a genuine gap (a field, an endpoint, or an error the snippets don't cover), extend the client with wixApiRequest — confirming the exact endpoint, method, and body first. For that iteration and troubleshooting — finding the right endpoint, reading a method's request/response schema, or diagnosing an API error — consult the official Wix API documentation using the documentation skill available in your environment to search methods, read pages, and inspect API schemas. Reference index: https://dev.wix.com/docs/api-reference.md

  • Provide the user with deep links to the Wix dashboard: In many cases, the user will need to modify the default vertical data in the Wix dashboard. Always provide the user with these links. The relevant information for each vertical's links is in its INSTRUCTIONS.md file.

How this skill is structured

<SKILL_ROOT> is this file's directory (strip /SKILL.md). Each vertical supplies integration code under references/<vertical>/app/: REST helpers in app/rest/, and, depending on the vertical, utilities, hooks, context, components, or pages. All use the shared transport in references/shared/app/ (app/rest/wix-client.js + wix-config.js, identical for every vertical). Set WIX_CLIENT_ID (and WIX_METASITE_ID) in wix-config.js. Deploying references/<vertical>/app/ and references/shared/app/ into the app's src/ puts every file in place — the REST helpers land in src/rest/, so their relative imports resolve.

Where these files live in the app, and how they get there (pre-installed at setup, or copied in) is your platform's call — follow your platform instructions for that.

Each vertical's INSTRUCTIONS.md specifies its prerequisites, supplied pieces, exported interfaces, and the presentation you must build. Read it before implementation: reuse the supplied pieces and build the missing presentation without reimplementing shipped logic. Follow the platform's and vertical's completion guidance where provided.

Routing — pick the vertical(s) from the request

Load the vertical(s) the user's app needs; a project may combine several (e.g. a restaurant with a blog, or a store with pricing plans).

Each vertical's integration files ship in references/<vertical>/app/; copy that dir plus references/shared/app/ into the app's src/ (base44 does this at install via deploy.cjs).

The user wants…VerticalRead
Online store: products, categories, cart, checkoutstorefrontreferences/storefront/INSTRUCTIONS.md
Donations: fundraising campaigns, one-time or recurring giving, hosted checkoutdonationsreferences/donations/INSTRUCTIONS.md
Appointments: services, time slots, booking, checkout — and the form attached to a bookable servicebookingsreferences/bookings/INSTRUCTIONS.md
Rentals: an item hired for a length the customer picks (by the hour or by the day) — Wix Rentals runs on the Bookings APIs, so it is the same verticalbookingsreferences/bookings/INSTRUCTIONS.md ("Rentals")
Blog/news: post feed, post pages, categories, tagsblogreferences/blog/INSTRUCTIONS.md
Events: browse, event page, RSVP, ticketing — an RSVP is here, not forms, even for one occasion with no ticketseventsreferences/events/INSTRUCTIONS.md
Portfolio/showcase: collections, projects, media galleriesportfolioreferences/portfolio/INSTRUCTIONS.md
Restaurant: menu, online ordering, table reservationsrestaurantsreferences/restaurants/INSTRUCTIONS.md
Any visitor-fillable form: contact/enquiry, lead, signup, waitlist, application, feedback/survey, quote request, intake or registration. Not an event RSVP (events), per-service booking form (bookings) or donation contribution (donations)formsreferences/forms/INSTRUCTIONS.md
CMS content: list/detail, filter/search, data CRUD. A visitor-fillable form is forms — cms only when the app must read the entries backcmsreferences/cms/INSTRUCTIONS.md
Plans & pricing: memberships/subscriptions, subscribe, my planspricing-plansreferences/pricing-plans/INSTRUCTIONS.md
Member accounts: custom login/sign-up (email+password, Google/Facebook, SSO), account area, gated contentmembersreferences/members/INSTRUCTIONS.md

⚠️ Anything a visitor fills in and submits is forms — with four exceptions:

  1. The app must read the entries back → cms. A public gallery, a listing, a member's "my submissions". A visitor cannot read Forms submissions, so those need a collection. Submit-only is always forms: a form wired to insertDataItem works, but gives up the dashboard form builder, spam protection, submission notifications and CRM contact mapping, and needs the owner to set collection permissions by hand before anyone can submit at all.

  2. Confirming attendance to an event or occasion → events. A wedding, party or gathering — events ships a built-in RSVP registration form. Route there even for a single occasion with no tickets.

  3. A form attached to a bookable service → bookings.

  4. A contribution to a donation campaign → donations. Recurring giving is not a Pricing Plans purchase; the donation form must preserve the campaign's amount/frequency rules and use its catalog reference.

When the request doesn't name a Wix Business Solution — ask, or check the site

Don't infer which Wix Business Solution to build (stores, bookings, blog, events, portfolio, restaurants, CMS, pricing plans, members, etc..) from a vague brief. Ask the user one short question — what do they offer (products? appointments? posts? events?) — or check what the site actually has: call a cheap read from each likely solution's helper (queryProducts, queryServices, queryPosts, queryEvents, …) — authenticated with a visitor token minted from the WIX_CLIENT_ID, or with an admin token if you have one — and build for the solutions that return real content. A 428 "app not installed" (blog: 401) means that solution isn't on the site; sample-looking content ("Sample product 3") proves the app is installed, not what the business is about. Never default to store/bookings on silence.

The run

  1. Get WIX_CLIENT_ID. It comes from the user (the handoff prompt from their Wix/vibe platform carries it). If it's missing, ask for it before wiring — nothing works without it.

  2. Pick the vertical(s) from the routing table — and when the request doesn't name any, ask or check the site (see above) instead of guessing. Open each picked vertical's INSTRUCTIONS.md.

  3. Ensure the vertical's files are in place — copy references/<vertical>/app/ and references/shared/app/ into the app's src/, and set WIX_CLIENT_ID in wix-config.js. (Where and how they get there is your platform's call — see its instructions. On base44 the install step writes and verifies wix-config.js for you, so there's nothing to set by hand.)

  4. Build the presentation and wire the integration following the vertical's INSTRUCTIONS.md. Reuse its supplied pieces through their documented interfaces, build the presentation it leaves to you, and connect routes/providers as specified. Do not reimplement shipped logic. Style new presentation using the existing platform theme.

  5. Complete the applicable platform and vertical guidance, including any required checks and handoff instructions they provide.

Some flows need Wix-side setup the user completes later (payments connected, the deployed domain allow-listed on the OAuth client for hosted-checkout return, collection permissions). Those are out of scope here — if a call fails for that reason, flag it and continue; don't fall back to mock data.

Files

references/blog/seed/seed-blog.cjs

// Blog seed helpers — run at BUILD TIME via exec_tool (NOT shipped in the app).
// The agent requires this and calls the functions with plain data; all Wix Blog V3
// request/response mechanics (the required author memberId, single-vs-bulk endpoint switch,
// the flat-per-item bulk shape, Ricos richContent nesting, sequential category/tag creates,
// the cover-image PATCH + re-publish) live here, once.
//
// Usage (build-time exec_tool):
//   const { accessToken } = await base44.asServiceRole.connectors.getConnection("wix");  // Base44
//   const seed = require("/app/.agents/skills/wix-vibe-headless/references/blog/seed/seed-blog.cjs");
//   const ctx = { token: accessToken, siteId: WIX_METASITE_ID };
//   const memberId = await seed.getAuthorMemberId(ctx);                    // STEP 1 — required for every post
//   const cats = await seed.createCategories(ctx, ["Recipes", "Brewing"]); // STEP 3 — only if the brief groups posts
//   const posts = await seed.createPosts(ctx, [
//     { title: "How We Roast Our Beans", categoryIds: [cats[0].id], content: [
//       { type: "heading", text: "From farm to cup", level: 2 },
//       { type: "paragraph", text: "Every batch starts with beans from a single estate." },
//       { type: "quote", text: "Great coffee is grown, not made." },
//     ] },
//   ], { memberId });
//   // optional — import each image url to Wix Media (blog binds by file id), then attach covers + re-publish
//   const files = await Promise.all(imageUrls.map((u) => seed.importImage(ctx, u)));   // → [{ id, url }]
//   await seed.attachPostCovers(ctx, posts.map((p, i) => ({ postId: p.id, fileId: files[i].id })));
//
// Live-verified end-to-end (members author, categories, posts single+bulk, tags, covers, idempotent
// re-runs). If any call ever fails with a shape the caller didn't expect, fall back to the documentation skill available in your environment (search + read the live Wix Blog API reference) — never guess. Source recipe:
// wix-headless/references/inline-recipes/setup-blog.md.

const API = "https://www.wixapis.com";
const BLOG_APP_ID = "14bcded7-0066-7c35-14d7-466cb3f09103"; // installBlogApp installs this before seeding

async function req(ctx, path, { method = "POST", body } = {}) {
  const res = await fetch(API + path, {
    method,
    headers: {
      Authorization: `Bearer ${ctx.token}`,
      "wix-site-id": ctx.siteId,
      "Content-Type": "application/json",
    },
    body: body ? JSON.stringify(body) : undefined,
  });
  const json = await res.json().catch(() => ({}));
  if (!res.ok) throw new Error(`${method} ${path} -> ${res.status}: ${JSON.stringify(json).slice(0, 400)}`);
  return json;
}

// ---- Ricos richContent builder (per recipe § "CRITICAL RICOS NESTING") ----
// A post's `content` is a list of plain block descriptors; this builds the Ricos node tree.
// Rules baked in: TEXT is always a leaf inside a container; BLOCKQUOTE / LIST_ITEM wrap a
// PARAGRAPH; BULLETED_LIST / ORDERED_LIST wrap LIST_ITEM -> PARAGRAPH -> TEXT; every container
// node gets a unique id, TEXT leaves use id "". Supported block types: heading, paragraph,
// quote, bulleted, ordered. For node types the recipe doesn't spell out (CODE_BLOCK, IMAGE, …)
// pass a pre-built `richContent` on the post instead and it's used verbatim (see fall-back below).
const mkText = (text) => ({ type: "TEXT", id: "", nodes: [], textData: { text: text || "", decorations: [] } });
const mkParagraph = (id, text) => ({ type: "PARAGRAPH", id, nodes: [mkText(text)], paragraphData: {} });

function mkRichContent(blocks = [], postIdx = 0) {
  let n = 0;
  const id = () => `p${postIdx}-n${n++}`;
  const nodes = [];
  for (const b of blocks) {
    switch (b.type) {
      case "heading":
        nodes.push({ type: "HEADING", id: id(), nodes: [mkText(b.text)], headingData: { level: b.level ?? 2 } });
        break;
      case "quote":
        // BLOCKQUOTE wraps a PARAGRAPH, per recipe
        nodes.push({ type: "BLOCKQUOTE", id: id(), nodes: [mkParagraph(id(), b.text)], blockquoteData: { indentation: 1 } });
        break;
      case "bulleted":
      case "ordered": {
        // LIST -> LIST_ITEM -> PARAGRAPH -> TEXT, per recipe
        const listType = b.type === "bulleted" ? "BULLETED_LIST" : "ORDERED_LIST";
        nodes.push({
          type: listType, id: id(),
          nodes: (b.items ?? []).map((item) => ({ type: "LIST_ITEM", id: id(), nodes: [mkParagraph(id(), item)] })),
        });
        break;
      }
      case "paragraph":
      default:
        nodes.push(mkParagraph(id(), b.text));
    }
  }
  return { nodes };
}

// One post's plain data -> a flat Blog V3 draft-post object.
// `content` (block list) is turned into Ricos richContent unless a pre-built `richContent` is given.
// media is omitted here — covers are a separate pass (attachPostCovers), optional (a separate covers pass). Per recipe.
function buildPost(p, i, memberId) {
  return {
    title: p.title,
    memberId,
    richContent: p.richContent ?? mkRichContent(p.content, i),
    ...(p.categoryIds ? { categoryIds: p.categoryIds } : {}),
    ...(p.tagIds ? { tagIds: p.tagIds } : {}),
  };
}

// ---- exported operations ----

// STEP 1: fetch a real author memberId (required — every post create needs it; a fabricated id
// fails with "memberIds ... do not exist"). Returns members[0].id; throws loudly if none exist.
async function getAuthorMemberId(ctx) {
  const r = await req(ctx, "/members/v1/members?fieldsets=PUBLIC&paging.limit=1", { method: "GET" });
  const id = r.members?.[0]?.id;
  if (!id) throw new Error(`No site member found for author attribution: ${JSON.stringify(r).slice(0, 400)}`);
  return id;
}

/**
 * STEP 2: create posts, published (publish:true so they go live immediately).
 * Auto-selects the endpoint per recipe: single-post endpoint for exactly one post (nested
 * `{ draftPost }` envelope), the bulk endpoint for >= 2 (flat per-item objects, NOT wrapped).
 * @param posts [{ title, content: [blocks] | richContent?, categoryIds?, tagIds? }]
 *   content blocks: { type:"heading", text, level? } | { type:"paragraph", text }
 *     | { type:"quote", text } | { type:"bulleted"|"ordered", items:[text,...] }.
 *   Pass a pre-built Ricos `richContent` instead of `content` for node types not covered here.
 * @param opts { memberId }  memberId from getAuthorMemberId — required; publish defaults to true.
 * @returns [{ id, index, success }]  (id is the draftPostId; feeds attachPostCovers)
 */
async function createPosts(ctx, posts, { memberId, publish = true } = {}) {
  if (!memberId) throw new Error("createPosts requires opts.memberId (see getAuthorMemberId)");
  if (posts.length === 1) {
    // single-post endpoint uses the nested { draftPost } envelope
    const r = await req(ctx, "/blog/v3/draft-posts", { body: { draftPost: buildPost(posts[0], 0, memberId), publish } });
    return [{ id: r.draftPost?.id, index: 0, success: !!r.draftPost?.id }];
  }
  // bulk endpoint: `bulk` is a path segment BETWEEN v3 and draft-posts; each item is FLAT (no draftPost wrapper)
  const r = await req(ctx, "/blog/v3/bulk/draft-posts/create", {
    body: { draftPosts: posts.map((p, i) => buildPost(p, i, memberId)), publish },
  });
  // Bulk returns 200 even on partial failure — read per-item results[].itemMetadata.success.
  return (r.results ?? []).map((x) => ({
    id: x.itemMetadata?.id, index: x.itemMetadata?.originalIndex, success: !!x.itemMetadata?.success,
  }));
}

const sleep = (ms) => new Promise((r) => setTimeout(r, ms));

// Existing label -> id, straight from the query (the source of truth for what actually persisted).
async function labelIdMap(ctx, kind) {
  const path = kind === "categories" ? "/blog/v3/categories/query" : "/v3/tags/query";
  const r = await req(ctx, path, { body: { query: { paging: { limit: 100 } } } });
  return new Map((r[kind] ?? []).map((x) => [x.label, x.id]));
}

// Create category/tag labels resiliently. TWO hazards this absorbs:
//  1. Fresh-install provisioning window — for a few seconds after the Blog app is installed, per-item
//     category/tag creates return 200 with an id but DON'T persist (last-write-wins; the id is a lie).
//     Posts (bulk) are unaffected. So we never trust the create response — we re-query and treat what
//     the query returns as truth, re-creating anything still missing until it sticks (store warms in ~s).
//  2. Idempotency — an already-present label (e.g. a partial-failure re-run) is skipped, not re-created.
// Category bodies are NESTED (`{ category: { label } }`); tag bodies are FLAT (`{ label }`) — a
// `{ tag: { label } }` body sends an empty top-level label and 400s. Returns [{ id, name }].
async function ensureLabels(ctx, kind, createPath, mkBody, names) {
  let map = await labelIdMap(ctx, kind);
  for (let attempt = 0; attempt < 8; attempt++) {
    const missing = names.filter((n) => !map.has(n));
    if (!missing.length) break;
    if (attempt) await sleep(1500); // backoff only between retries — happy path pays nothing
    for (const name of missing) {
      try { await req(ctx, createPath, { body: mkBody(name) }); }
      catch (e) { if (!String(e.message).includes("-> 409")) throw e; } // 409 = raced, already there
    }
    map = await labelIdMap(ctx, kind);
  }
  return names.map((name) => ({ id: map.get(name), name }));
}

// STEP 3 (optional — only if the request groups posts): create categories. No bulk endpoint.
async function createCategories(ctx, names) {
  return ensureLabels(ctx, "categories", "/blog/v3/categories", (name) => ({ category: { label: name } }), names);
}

// STEP 3 (optional): create tags. Feed the returned ids into post.tagIds.
async function createTags(ctx, names) {
  return ensureLabels(ctx, "tags", "/blog/v3/tags", (name) => ({ label: name }), names);
}

// Import an external image URL into Wix Media → { id, url }. Blog binds the cover by the Wix Media
// file **id**, NOT a url — an external url (e.g. a base44 generate_image result) MUST be imported
// first; the raw url renders nothing. id = wixstatic file id, url = the permanent wixstatic url.
async function importImage(ctx, url, displayName = "image.png") {
  const r = await req(ctx, "/site-media/v1/files/import", { body: { url, mimeType: "image/png", displayName } });
  const f = r.file || r;
  if (!f?.id) throw new Error(`import-file returned no file id: ${JSON.stringify(r).slice(0, 200)}`);
  return { id: f.id, url: f.url };
}

// Attach images step (optional). covers: [{ postId, fileId }] where fileId is the WixMedia
// file.id from importImage (Blog binds the cover by id, not url). Per post:
//   PATCH /blog/v3/draft-posts/{id}  (NOT POST …/{id}/update — that 404s for a single post),
// setting media.displayed:true + media.custom:true + wixMedia.image.id (id ALONE is a silent no-op),
// then re-publish (the PATCH sets hasUnpublishedChanges, so the live post stays cover-less until republish).
// Image failures never block the run — skip a failed cover, leave the post text-only.
async function attachPostCovers(ctx, covers) {
  for (const { postId, fileId } of covers) {
    try {
      await req(ctx, `/blog/v3/draft-posts/${postId}`, {
        method: "PATCH",
        body: { draftPost: { media: { displayed: true, custom: true, wixMedia: { image: { id: fileId } } } } },
      });
      await req(ctx, `/blog/v3/draft-posts/${postId}/publish`, { method: "POST" });
    } catch (e) {
      console.warn(`cover attach skipped for post ${postId}: ${e.message}`);
    }
  }
}

/**
 * DEFAULT one-call path — seed a whole blog in ONE exec call. Resolves the author memberId and
 * category/tag names → ids internally and keeps every id in memory, so nothing is hand-threaded
 * across exec calls. Order: memberId → categories/tags → posts (with resolved ids) → covers.
 * @param plan {
 *   posts: [{ title, content?|richContent?, category?|categories?(name|names), tags?(names), coverImageUrl? }],
 *   categories?: [name],  // pre-create categories even if no post references them
 *   tags?: [name],
 * }
 *   category/categories/tags are display NAMES (resolved to ids here); coverImageUrl is a plain image
 *   url — imported to Wix Media here — and a cover is attached only for posts that provide one.
 * @returns { posts:[{id,index,success}], categories:[{id,name}], tags:[{id,name}], coversAttached }
 */
// Install the Wix Blog app before seeding — base44 sites aren't guaranteed to have it (no separate
// Setup step here, unlike the wix-headless recipe). Idempotent: re-installing returns 200.
async function installBlogApp(ctx) {
  return req(ctx, "/apps-installer-service/v1/app-instance/install", { body: {
    tenant: { tenantType: "SITE", id: ctx.siteId },
    appInstance: { appDefId: BLOG_APP_ID, enabled: true },
  } });
}

async function setupBlog(ctx, { posts = [], categories = [], tags = [] } = {}) {
  await installBlogApp(ctx);
  await sleep(3000); // let a fresh Blog install settle so the first category/tag writes stick (see ensureLabels);
                     // correctness is still guaranteed by ensureLabels' verify-retry — this just cuts the retries.
  const memberId = await getAuthorMemberId(ctx);
  const catNames = [...new Set([...categories, ...posts.flatMap((p) => [].concat(p.category ?? [], p.categories ?? []))])];
  const tagNames = [...new Set([...tags, ...posts.flatMap((p) => [].concat(p.tags ?? []))])];
  const cats = catNames.length ? await createCategories(ctx, catNames) : [];
  const tgs = tagNames.length ? await createTags(ctx, tagNames) : [];
  const catId = new Map(cats.map((c) => [c.name, c.id]));
  const tagId = new Map(tgs.map((t) => [t.name, t.id]));
  const created = await createPosts(ctx, posts.map((p) => {
    const cn = [].concat(p.category ?? [], p.categories ?? []);
    const tn = [].concat(p.tags ?? []);
    return {
      ...p,
      ...(cn.length ? { categoryIds: cn.map((n) => catId.get(n)).filter(Boolean) } : {}),
      ...(tn.length ? { tagIds: tn.map((n) => tagId.get(n)).filter(Boolean) } : {}),
    };
  }), { memberId });
  const covers = [];
  for (let i = 0; i < created.length; i++) {
    const url = posts[i]?.coverImageUrl;
    if (!created[i]?.id || !url) continue;
    try {
      const file = await importImage(ctx, url, `post-${i}.png`);   // → Wix Media file id
      covers.push({ postId: created[i].id, fileId: file.id });
    } catch { /* never block on image failure — leave the post cover-less */ }
  }
  if (covers.length) await attachPostCovers(ctx, covers);
  return { posts: created, categories: cats, tags: tgs, coversAttached: covers.length };
}

module.exports = {
  setupBlog, installBlogApp,
  getAuthorMemberId, createPosts, createCategories, createTags, importImage, attachPostCovers,
};

Requirements and compatibility

Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta

“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.

Needs: Needs Node.js

Security

What our scanner noticed· Low risk

  • Instructions that use the network
  • Scripts that your agent may run

This skill includes scripts that your agent may run. Read them before you use it.

A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.

Attribution and licence

Published by
Wix
Publisher
Wix (Official)
Source
wix/skills · skills/wix-vibe-headless · commit d168bc2
Licence
MIT License (redistribution allowed)
  • LICENSE (added by AutoGineer from LICENSE)
  • ATTRIBUTION.md (written by AutoGineer)
Synced

AutoGineer is not affiliated with or endorsed by Wix or Wix.

Download ZIP

The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download wix-vibe-headless.zip