एकीकरण Wix#

Wix एक्सटेंशन सतह के माध्यम से Wix Stores के साथ Room Visualizer को एकीकृत करें जो आपके साइट प्रकार से मेल खाती है। Wix Editor और Wix Studio को अलग-अलग दृष्टिकोणों की आवश्यकता होती है।

सत्यापन स्थिति: Wix एक्सटेंशन दस्तावेज़ीकरण 7 सितंबर 2026 को समीक्षा किया गया था। कोई ग्राहक Wix साइट या ऐप प्रमाणीकरण उपलब्ध नहीं थे, इसलिए यह अंत-से-अंत प्रमाणित नहीं है। SDK को अपने कंटेनर के साथ स्टोरफ्रंट DOM साझा करना होगा; एक HTML iframe एक विकल्प नहीं है।

** SDK को लोड करने से पहले:** डैशबोर्ड → सेटिंग्स खोलें, अपने स्टोरफ्रंट ओरिजिन को Allowed Origins (CORS) में जोड़ें, और सहेजें पर क्लिक करें। प्रकाशित होस्टनेम और किसी भी प्रीव्यू या स्टेजिंग ओरिजिन को शामिल करें जिन्हें आप उपयोग करते हैं; कई ओरिजिन को कॉमा से अलग करें। कॉन्फ़िगरेशन के चरण देखें।

सही Wix पथ चुनें#

Wix दस्तावेज़ीकरण करता है कि स्टोर एम्बेडेड स्क्रिप्ट्स Wix Studio में उपलब्ध नहीं हैं और ऐप्स को साइट प्लगइन एक्सटेंशन की ओर निर्देशित करता है। एक एडिटर एम्बेडेड-स्क्रिप्ट समाधान इंस्टॉल न करें और स्टूडियो कवरेज का दावा न करें।

पूर्व शर्तें#

एक Wix टेस्ट साइट तैयार करें जिसमें Wix Stores हो, कस्टम कोड या ऐप एक्सटेंशन प्रकाशित करने की अनुमति, ideal.house Shop ID और Publishable Key, और एक आयातित टेस्ट SKU। निर्धारित करें कि चयनित Wix वेरिएंट का अपना SKU है या नहीं। सभी ऐप सीक्रेट्स और बैकएंड API कुंजियों को ब्राउज़र पेज से बाहर रखें।

न्यूनतम SDK मार्कअप#

जहाँ Wix आपके कोड को स्टोरफ्रंट दस्तावेज़ में चलने देता है, वहाँ समर्थित ideal.house मार्कअप है:

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

प्रोडक्ट कोड को आयातित ideal.house sku से बिल्कुल मेल खाना चाहिए।

Wix Editor: एक साइट के लिए इंस्टॉल करें#

Wix डैशबोर्ड में, सेटिंग्स → कस्टम कोड के माध्यम से SDK टैग जोड़ें, इसे बॉडी/बॉडी के अंत में रखें, और उन प्रोडक्ट पेजों का चयन करें जिनकी आवश्यकता है। साइट प्रकाशित करें; प्रीव्यू मोड प्रोडक्शन जांच के लिए पर्याप्त नहीं है।

फिर एक उत्पाद-पृष्ठ कस्टम तत्व या Wix Stores एक्सटेंशन पॉइंट जोड़ें जो उसी शीर्ष-स्तरीय दस्तावेज़ में कंटेनर उत्पन्न करे। बटन के लिए Wix HTML Embed से बचें: यह एक iframe के अंदर चलता है, इसलिए माता-पिता दस्तावेज़ में एक स्क्रिप्ट उसका कंटेनर खोज नहीं सकती और iframe में एक स्क्रिप्ट उत्पाद पृष्ठ को नियंत्रित नहीं कर सकती।

प्लेसेबल एलिमेंट को आपके अपने कोड में एक ऑपरेशन प्रदर्शित करना चाहिए:

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);
}

इसे केवल तब कॉल करें जब Wix आपके पेज या एक्सटेंशन के लिए उपलब्ध API के माध्यम से एक पूर्ण वर्तमान प्रोडक्ट/वेरिएंट की रिपोर्ट करे। यह ग्राहक एडैप्टर कोड है; यह जानबूझकर किसी सत्यापित नही Wix पेज इवेंट का नाम नहीं लेता।

Wix ऐप: Wix Editor स्टोर के लिए एम्बेडेड स्क्रिप्ट#

Wix Stores एम्बेडेड स्क्रिप्ट एक्सटेंशन के लिए details-placeholder और bottom-placeholder स्थान प्रदान करता है। उनमें से एक प्लेसहोल्डर में होस्ट जोड़ें; अन्य ऐप्स इसे साझा कर सकते हैं इसलिए इसकी सामग्री को बदलें नहीं। SDK स्क्रिप्ट को एक अलग एम्बेडेड फ्रैगमेंट के रूप में कॉन्फ़िगर करें या इसे सटीक src, data-shop-id, और data-publishable-key एट्रिब्यूट्स के साथ प्रोग्रामेटिक रूप से बनाएं।

CLI-बनाए गए एम्बेडेड स्क्रिप्ट्स के लिए उपलब्ध Wix साइट API स्टोरफ्रंट संदर्भ पढ़ सकता है। Wix के समर्थित स्टोरस API के माध्यम से वर्तमान वेरिएंट SKU को रिज़ॉल्व करें, फिर अपने setIdealhouseSku() ब्रिज को कॉल करें। जब तक एक पूर्ण SKU मौजूद न हो, प्लेसहोल्डर को खाली रखें।

Wix Studio: साइट प्लगइन#

एक दस्तावेज़ीकृत प्रोडक्ट-पेज स्लॉट को टारगेट करते हुए एक Wix Stores साइट प्लगइन बनाएं। कंटेनर को प्लगइन UI से रेंडर करें और SDK को Wix-रेंडर्ड साइट दस्तावेज़ में लोड करें। प्लगइन को अपने रिज़ॉल्व्ड वर्तमान-वेरिएंट SKU को DOM कंटेनर में पास करना होगा। Wix Studio स्लॉट नाम और कंपोनेंट APIs विकसित हो सकते हैं; एक्सटेंशन जनरेट करते समय उन्हें वर्तमान CLI/API संदर्भ से चुनें, इस गाइड से एक नाम कॉपी न करें।

ऐसे प्लगइन स्लॉट का उपयोग न करें जो नियंत्रण को एक अलग iframe के अंदर रेंडर करते हैं: SDK और इसका व्यूअर उस सीमा के लिए प्रमाणित नहीं हैं। एक Wix एक्सटेंशन पॉइंट चुनें जो स्टोरफ्रंट दस्तावेज़ में कंटेनर रखता है, या एक हेडलेस स्टोरफ्रंट का उपयोग करें जहाँ आप दस्तावेज़ को नियंत्रित करते हैं।

प्रोडक्ट मैपिंग और नेविगेशन#

Wix उत्पाद या वेरिएंट sku को ideal.house sku से मैप करें। चुपचाप Wix उत्पाद आईडी पर वापस न जाएं क्योंकि एक जनरेट आईडी कैटलॉग SKU से मेल नहीं खाएगी, जब तक कि आपने इसे जानबूझकर आयात नहीं किया हो।

Wix प्रोडक्ट पेज ऑप्शन चयन या क्लाइंट नेविगेशन के दौरान सामग्री को बदल सकते हैं। हर दस्तावेज़ीकृत प्रोडक्ट/चॉइस कॉलबैक पर:

1. पिछले रेंडर किए गए कंटेनर को साफ़ करें;
2. चयनित पूर्ण वेरिएंट को रिज़ॉल्व करें;
3. उसके SKU के साथ एक ताज़ा कंटेनर इनसर्ट करें;
4. जब कोई पूर्ण या विज़ुअलाइज़ेबल SKU मौजूद न हो, होस्ट को खाली रखें।

गैलरी और रीपीटर के लिए, हर आइटम को अपने आइटम-लेवल SKU की आवश्यकता होती है। क्विक-व्यू और मोडल प्रोडक्ट्स को मोडल स्लॉट में समान लाइफ़साइकिल ब्रिज की आवश्यकता होती है।

प्रोडक्ट आयात करें#

Wix Stores स्वतः ideal.house के साथ सिंक नहीं होता है। Wix प्रोडक्ट और वेरिएंट फ़ील्ड्स को एक्सपोर्ट करें, हर वांछित Wix SKU को sku के रूप में सेट करें, और उत्पाद अपलोड का उपयोग करें। देखें उत्पाद आयात करें, कार्य की स्थिति, उत्पादों की सूची देखें, उत्पाद अपडेट करें, उत्पाद हटाएँ, और त्रुटियाँ और पुनः प्रयास।

एक स्वचालित Wix-से-ideal.house सिंक, ऐप इंस्टॉलेशन फ़्लो, या Wix वेबहुक प्रोसेसर ग्राहक-मालिकाना कार्य है; यह गाइड एक का वादा नहीं करती।

प्रकाशन से पहले सत्यापित करें#

1. डेस्कटॉप और मोबाइल पर एक प्राइवेट ब्राउज़र विंडो में प्रकाशित साइट का टेस्ट करें।
2. पुष्टि करें कि SDK कंटेनर के साथ उसी दस्तावेज़ में एक बार लोड होता है।
3. DOM प्रोडक्ट कोड को आयातित SKU के साथ बिल्कुल तुलना करें।
4. हर ऑप्शन बदलें जब तक एक अंतिम वेरिएंट चयनित न हो; पुष्टि करें कि पुराना कंटेनर हटा दिया गया है और एक नया दिखाई देता है।
5. Wix क्लाइंट नेविगेशन, उत्पाद गैलरी/रीपीटर पृष्ठ, क्विक व्यू, ब्राउज़र Back/Forward, सहमति सेटिंग्स, और सदस्य/लॉग-आउट मोड का परीक्षण करें।
6. पुष्टि करें कि एक अज्ञात या खाली SKU कोई टूटा हुआ विज़ुअलाइज़र कंट्रोल नहीं छोड़ता।
7. एक ऐप के लिए, जहाँ समर्थित हो, अलग-अलग Wix Editor और स्टूडियो टेस्ट साइट्स में इंस्टॉलेशन, सक्षम करना, अक्षम करना, और अनइंस्टॉल का टेस्ट करें।

एकीकरण हटाएं#

Wix कस्टम कोड एंट्री को हटाएं या अक्षम करें और प्रोडक्ट-पेज एलिमेंट को हटाएं। एक ऐप के लिए, एम्बेडेड स्क्रिप्ट या साइट प्लगइन एक्सटेंशन को हटाएं और टेस्ट साइट से इसे अनइंस्टॉल करें। प्रकाशित करें, फिर पुष्टि करें कि स्क्रिप्ट रिक्वेस्ट और सभी data-idealhouse-* नोड्स गायब हो गए हैं।

आधिकारिक प्लेटफ़ॉर्म संदर्भ#

• Wix: एम्बेडेड स्क्रिप्ट्स का उपयोग करके Wix Stores को कस्टमाइज़ करें
• Wix: एम्बेडेड स्क्रिप्ट्स के बारे में
• Wix: साइट एक्सटेंशन के बारे में
• Wix: कस्टम एलिमेंट्स