Wix integration#
Integrate the Room Visualizer with Wix Stores through the Wix extension surface that matches your site type. Wix Editor and Wix Studio require different approaches.
Verification status: Wix extension documentation reviewed on September 7, 2026. No customer Wix site or app credentials were available, so this is not end-to-end certified. The SDK must share the storefront DOM with its container; an HTML iframe is not a substitute.
Before loading the SDK: Open Dashboard → Settings, add your storefront origin to Allowed Origins (CORS), and click Save. Include the published hostname and any preview or staging origins you use; separate multiple origins with commas. See configuration steps.
Choose the correct Wix path#
| Storefront | Recommended insertion path | Limitation |
|---|---|---|
| Wix Editor site, one merchant | Site Custom Code plus a product-page element or custom app | Page data still needs a customer bridge |
| Wix app for Wix Editor Stores | Embedded Script Extension and Wix Stores placeholders | Embedded Scripts for Wix Stores do not support Wix Studio |
| Wix Studio site | Wix Stores site plugin slot | Requires a Wix app/extension project |
| Headless Wix storefront | Add the SDK in your own React/Vue frontend | Follow the relevant framework guide |
Wix documents that Stores Embedded Scripts are unavailable in Wix Studio and directs apps to a site plugin extension. Do not install an Editor embedded-script solution and claim Studio coverage.
Prerequisites#
Prepare a Wix test site with Wix Stores, permission to publish custom code or an app extension, ideal.house Shop ID and Publishable Key, and an imported test SKU. Decide whether the selected Wix variant has its own SKU. Keep all app secrets and backend API keys off the browser page.
Minimal SDK markup#
Where Wix lets your code run in the storefront document, the supported ideal.house markup is:
<script
src="https://sdk.ideal.house/sdk.js"
data-shop-id="<SHOP_ID>"
data-publishable-key="<PUBLISHABLE_KEY>"
async
></script>
<div data-idealhouse-button-container data-product-code="CHAIR-OAK-01"></div>
The Product Code must exactly match the imported ideal.house sku.
Wix Editor: install for one site#
In the Wix dashboard, add the SDK tag through Settings → Custom Code, place it in the body/end of body, and choose the product pages that need it. Publish the site; preview mode is not sufficient for a production check.
Then add a product-page custom element or a Wix Stores extension point that produces the container in the same top-level document. Avoid Wix HTML Embed for the button: it runs inside an iframe, so a script in the parent document cannot discover its container and a script in the iframe cannot control the product page.
The placeable element should expose one operation in your own code:
function setIdealhouseSku(host, sku) {
host.replaceChildren();
const code = typeof sku === 'string' ? sku.trim() : '';
if (!code) return;
const container = document.createElement('div');
container.dataset.idealhouseButtonContainer = '';
container.dataset.productCode = code;
host.append(container);
}
Call it only after Wix reports a complete current product/variant through the API available to your page or extension. This is customer adapter code; it intentionally does not name an unverified Wix page event.
Wix app: Embedded Script for Wix Editor Stores#
Wix Stores provides details-placeholder and bottom-placeholder locations for Embedded Script Extensions. Append a host to one of those placeholders; do not replace its contents because other apps can share it. Configure the SDK script as a separate embedded fragment or create it programmatically with the exact src, data-shop-id, and data-publishable-key attributes.
The Wix Site API available to CLI-created embedded scripts can read storefront context. Resolve the current variant SKU through Wix's supported Stores API, then call your setIdealhouseSku() bridge. Keep the placeholder empty until a complete SKU exists.
Wix Studio: site plugin#
Create a Wix Stores site plugin targeting a documented product-page slot. Render the container from the plugin UI and load the SDK in the Wix-rendered site document. The plugin must pass its resolved current-variant SKU to the DOM container. Wix Studio slot names and component APIs can evolve; choose them from the current CLI/API reference when generating the extension rather than copying a name from this guide.
Do not use a plugin slot that renders the control inside an isolated iframe: the SDK and its viewer have not been certified for that boundary. Choose a Wix extension point that places the container in the storefront document, or use a headless storefront where you control the document.
Product mapping and navigation#
Map the Wix product or variant sku to ideal.house sku. Do not silently fall back to Wix product ID because a generated ID will not match a catalog SKU unless you imported it intentionally.
Wix product pages can replace content during option selection or client navigation. On every documented product/choice callback:
- clear the previously rendered container;
- resolve the complete selected variant;
- insert a fresh container with its SKU;
- leave the host empty when no complete or visualizable SKU exists.
For galleries and repeaters, each item needs its own item-level SKU. Quick-view and modal products require the same lifecycle bridge in the modal slot.
Import products#
Wix Stores does not automatically synchronize with ideal.house. Export the Wix product and variant fields, set each desired Wix SKU as sku, and use Product upload. See import products, job status, list products, update products, delete product, and errors and retries.
An automated Wix-to-ideal.house sync, app installation flow, or Wix webhook processor is customer-owned work; this guide does not promise one.
Verify before publishing#
- Test the published site in a private browser window on desktop and mobile.
- Confirm the SDK loads once in the same document as the container.
- Compare the DOM Product Code with the imported SKU exactly.
- Change every option until a final variant is selected; confirm the old container is removed and a new one appears.
- Exercise Wix client navigation, product gallery/repeater pages, quick view, browser Back/Forward, consent settings, and member/logged-out modes.
- Confirm an unknown or blank SKU leaves no broken visualizer control.
- For an app, test installation, enablement, disablement, and uninstall in separate Wix Editor and Studio test sites as supported.
Remove the integration#
Delete or disable the Wix Custom Code entry and remove the product-page element. For an app, remove the Embedded Script or site plugin extension and uninstall it from the test site. Publish, then confirm the script request and all data-idealhouse-* nodes are gone.