Ecwid इंटीग्रेशन#
एक Ecwid कस्टम स्टोरफ्रंट ऐप और दस्तावेज़ीकृत स्टोरफ्रंट JS API जीवनचक्र का उपयोग करें ताकि Ecwid उत्पाद पेजों पर Room Visualizer नियंत्रण जोड़े जा सकें।
** सत्यापन स्थिति:** Ecwid स्टोरफ्रंट JS API दस्तावेज़ीकरण 7 सितंबर 2026 को समीक्षा किया गया था। कोई Ecwid ऐप या व्यापारी परीक्षण स्टोर उपलब्ध नहीं था। सटीक पेज पेयलोड फ़ील्डों की पुष्टि डिप्लॉयमेंट से पहले वर्तमान
OnPageLoadedसंदर्भ के विरुद्ध की जानी चाहिए।
** SDK को लोड करने से पहले:** डैशबोर्ड → सेटिंग्स खोलें, अपने स्टोरफ्रंट ओरिजिन को Allowed Origins (CORS) में जोड़ें, और सहेजें पर क्लिक करें। प्रकाशित होस्टनेम और किसी भी प्रीव्यू या स्टेजिंग ओरिजिन को शामिल करें जिन्हें आप उपयोग करते हैं; कई ओरिजिन को कॉमा से अलग करें। कॉन्फ़िगरेशन के चरण देखें।
पूर्वशर्तें और समर्थित पथ#
Ecwid को स्थायी स्टोरफ्रंट कस्टमाइज़ेशन के लिए एक कस्टम ऐप की आवश्यकता होती है जिसमें एक स्वयं-होस्टेड JavaScript फ़ाइल हो। एक Ecwid विकास स्टोर/ऐप, एक HTTPS-होस्टेड एडैप्टर फ़ाइल, Shop ID, Publishable Key, और आयातित उत्पाद/वैरिएशन SKU तैयार करें।
यदि Ecwid किसी अन्य CMS में एम्बेडेड है, तो कस्टम स्टोरफ्रंट ऐप कोड के लिए विश्वसनीय स्थान बना रहता है क्योंकि यह Ecwid स्टोरफ्रंट के साथ चलता है। एक पैरेंट-पेज स्क्रिप्ट हर एम्बेड मोड में समान जीवनचक्र या दस्तावेज़ साझा नहीं कर सकती।
न्यूनतम SDK अनुबंध#
<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>
उस सटीक Ecwid SKU का उपयोग करें जिसे आपने ideal.house sku के रूप में आयात किया था।
अपना Ecwid स्टोरफ्रंट ऐप प्रारंभ करें#
स्वयं-होस्टेड फ़ाइल को पंजीकृत करने के लिए Ecwid के कस्टम स्टोरफ्रंट क्विकस्टार्ट का पालन करें। इसे दस्तावेज़ीकृत API-तैयार कॉलबैक के साथ शुरू करें, फिर ideal.house SDK को एक बार लोड करें:
Ecwid.OnAPILoaded.add(function () {
if (document.querySelector('script[src="https://sdk.ideal.house/sdk.js"]')) return;
const script = document.createElement('script');
script.src = 'https://sdk.ideal.house/sdk.js';
script.async = true;
script.dataset.shopId = '<SHOP_ID>';
script.dataset.publishableKey = '<PUBLISHABLE_KEY>';
document.head.append(script);
});
एक मल्टी-स्टोर ऐप के लिए, अपने ऐप की सुरक्षित सार्वजनिक कॉन्फ़िगरेशन से दो सार्वजनिक ideal.house मान प्राप्त करें। कभी भी इस फ़ाइल में Ecwid ऐप सीक्रेट, एक्सेस टोकन, या ideal.house Client Secret न डालें।
उत्पाद पेजों पर रेंडर करें#
Ecwid Ecwid.OnPageLoaded.add() का दस्तावेज़ीकरण करता है और इसके कॉलबैक को पेज जानकारी प्रदान करता है। उत्पाद-पेज प्रकार और पहचानकर्ता की पुष्टि करने के लिए वर्तमान API संदर्भ का उपयोग करें, उत्पाद डेटा को Ecwid के समर्थित क्लाइंट इंटरफ़ेस के माध्यम से प्राप्त करें या पढ़ें, फिर हल किया गया SKU पास करें:
function mountIdealhouse(host, sku) {
host.replaceChildren();
const code = String(sku || '').trim();
if (!code) return;
const container = document.createElement('div');
container.dataset.idealhouseButtonContainer = '';
container.dataset.productCode = code;
host.append(container);
}
host को एक स्थिर उत्पाद-विवरण स्थान में डालें जब Ecwid पेज रेंडर करना समाप्त कर ले। पेज प्रकार बदलने पर पूर्ववर्ती होस्ट को हटा दें। DOM सिलेक्टर और पेज-पेयलोड-से-उत्पाद लुकअप ग्राहक एडैप्टर कोड हैं क्योंकि Ecwid स्टोरफ्रंट लेआउट और पेयलोड संस्करण बदल सकते हैं।
विकल्प और नेविगेशन#
जब कोई खरीदार उत्पाद विकल्प चुनता है, तब तक प्रतीक्षा करें जब तक Ecwid खरीद योग्य वैरिएशन और उसका SKU हल न कर ले। उस SKU के साथ mountIdealhouse() कॉल करें, या यदि चयन अधूरा है तो होस्ट को साफ़ करें। विकल्प लेबलों को जोड़कर कोड बनाने का प्रयास न करें।
Ecwid एक एक-पेज स्टोरफ्रंट है। ब्राउज़र के DOMContentLoaded के लिए सुनने के बजाय इसके दस्तावेज़ीकृत पेज लाइफ़साइकिल (OnPageLoaded/पेज-स्विच कॉलबैक) का उपयोग करें। श्रेणी/खोज नेविगेशन, ब्राउज़र बैक/फॉरवर्ड, एम्बेडेड विजेट और प्रोडक्ट पॉपअप को पुराने प्रोडक्ट होस्ट हटाने होंगे और रेंडरिंग के बाद एक नया कंटेनर माउंट करना होगा।
प्रोडक्ट आयात करें#
Ecwid उत्पाद और वैरिएशन SKU फ़ील्ड को निर्यात करें और उन्हें ideal.house sku से मैप करें। उत्पाद अपलोड का उपयोग करें, जिसमें उत्पाद आयात करें, कार्य की स्थिति, उत्पादों की सूची देखें, उत्पाद अपडेट करें, उत्पाद हटाएँ, और त्रुटियाँ और पुनः प्रयास शामिल हैं।
कोई भी Ecwid REST API निर्यात, वेबहुक, OAuth इंस्टॉलेशन, या आवर्ती सिंक ग्राहक-स्वामित्व वाला है और इसे उचित Ecwid अधिकार के साथ सर्वर-साइड पर लागू किया जाना चाहिए।
सत्यापित करें और हटाएं#
ऐप इंस्टॉलेशन, API इनिशियलाइज़ेशन, उत्पाद/श्रेणी/खोज संक्रमण, हर वैरिएशन, अनुपस्थित और अज्ञात SKUs, ब्राउज़र बैक/फॉरवर्ड, किसी अन्य साइट पर एम्बेडेड Ecwid विजेट, मोबाइल लेआउट, सहमति, और लॉग-इन/लॉग-आउट ग्राहकों का परीक्षण करें। होस्ट वाले दस्तावेज़ में एक SDK अनुरोध और सटीक SKU समता की पुष्टि करें।
हटाने के लिए, स्वयं-होस्टेड JavaScript फ़ाइल को कस्टम ऐप से अलग करें या ऐप को अनइंस्टॉल करें, इंजेक्टेड होस्ट/लिस्टनर हटाएं, और पुष्टि करें कि स्टोरफ्रंट नेविगेशन और हार्ड रिफ़्रेश के बाद SDK URL और सभी data-idealhouse-* नोड गायब हो जाते हैं।