Ideal House
सामग्री पर जाएं

Shopware 6 एकीकरण#

Shopware 6 प्लगइन या कस्टम थीम के माध्यम से Room Visualizer जोड़ें और चयनित सेल्स-चैनल प्रोडक्ट नंबर को ideal.house प्रोडक्ट कोड के रूप में उपयोग करें।

सत्यापन स्थिति: Shopware स्टोरफ्रंट दस्तावेज़ीकरण 7 सितंबर 2026 को समीक्षित किया गया था। कोई ग्राहक दुकान उपलब्ध नहीं थी। यह पथ मानक Shopware 6 Twig स्टोरफ्रंट का लक्ष्य है; हेडलेस/कम्पोजेबल स्टोरफ्रंट्स को उनके फ्रेमवर्क-विशिष्ट एडैप्टर की आवश्यकता होती है।

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

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

एक विकास दुकान, प्लगइन/थीम स्रोत पहुंच, एक स्टेजिंग सेल्स चैनल, Shop ID, Publishable Key, और आयातित प्रोडक्ट नंबर तैयार करें। स्टोरफ्रंट कोर या वेंडर थीम को बदलने के बजाय एक प्लगइन या चाइल्ड थीम में काम करें।

न्यूनतम SDK अनुबंध#

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

Shopware productNumber को ideal.house sku के साथ ठीक से मैप करें। SDK Shopware की स्टोर API का पूछताछ नहीं करता है।

प्रोडक्ट टेम्पलेट का विस्तार करें#

अपने प्लगइन में, अपने इंस्टॉल किए गए Shopware वर्शन में खरीद विजेट के पास उपयोग किए जाने वाले Twig टेम्पलेट/ब्लॉक का विस्तार करें। वर्तमान सेल्स-चैनल प्रोडक्ट का उपयोग करके एक होस्ट रेंडर करें:

twig
{% sw_extends '@Storefront/storefront/component/buy-widget/buy-widget-form.html.twig' %}

{% block buy_widget_buy_container %}
    {{ parent() }}
    {% if page.product.productNumber %}
        <div class="idealhouse-host">
            <div
                data-idealhouse-button-container
                data-product-code="{{ page.product.productNumber|escape }}">
            </div>
        </div>
    {% endif %}
{% endblock %}

ब्लॉक नाम और संदर्भ Shopware रिलीज़ और थीमों के बीच बदल सकते हैं। सक्रिय वर्शन के टेम्पलेट का निरीक्षण करें, सबसे संकीर्ण विस्तार ब्लॉक का चयन करें, और पुष्टि करें कि page.product वहाँ उपलब्ध है। प्रोडक्ट कार्ड के लिए, कार्ड के प्रोडक्ट संदर्भ का उपयोग करें।

SDK लोड करें#

Shopware प्लगइन स्टोरफ्रंट JavaScript जोड़ सकते हैं और टेम्पलेट को ओवरराइड कर सकते हैं। एक स्थानीय स्टोरफ्रंट एंट्री जोड़ें जो SDK स्क्रिप्ट एक बार बनाए:

js
if (!document.querySelector('script[src="https://sdk.ideal.house/sdk.js"]')) {
  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);
}

अपने Shopware वर्शन के लिए प्रक्रिया का उपयोग करके स्टोरफ्रंट एसेट्स को कम्पाइल करें और प्लगइन/थीम को सक्रिय करें। पुनर्चालन योग्य प्लगइन में क्रेडेंशियल्स के लिए कॉन्फ़िगरेशन मानों का उपयोग करें; केवल ब्राउज़र-सुरक्षित Publishable Key रेंडर करें।

वैरिएंट्स और डायनामिक कंटेंट#

Shopware अक्सर खरीद योग्य वैरिएंट्स को उनके अपने productNumber और कैनोनिकल URL के साथ अलग प्रोडक्ट्स के रूप में दर्शाता है। पूर्ण नेविगेशन पर, सर्वर-रेंडर्ड Twig स्वाभाविक रूप से नया कोड उत्पन्न करता है। यदि आपकी थीम पेज लोड के बिना वैरिएंट्स को बदलती है, तो उसके दस्तावेज़ीकृत पूर्णता कॉलबैक को इससे जोड़ें:

js
function replaceIdealhouseProduct(host, productNumber) {
  host.replaceChildren();
  const code = String(productNumber || '').trim();
  if (!code) return;
  const container = document.createElement('div');
  container.dataset.idealhouseButtonContainer = '';
  container.dataset.productCode = code;
  host.append(container);
}

यह ब्रिज ग्राहक-स्वामित्व वाला है क्योंकि थीम और थर्ड-पार्टी वैरिएंट प्लगइन अलग होते हैं। फ़िल्टर/ऑफ-कैनवास कंपोनेंट्स के माध्यम से लोड किए गए सूचीकरणों को नए DOM के आने के बाद साफ़ कंटेनर रेंडर या पुनर्निर्माण करने होंगे। SDK-जनित बच्चों को क्लोन न करें।

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

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

कोई भी स्टोर API/एडमिन API सिंक, शेड्यूल टास्क, या फ्लो बिल्डर/वेबहुक एकीकरण अलग ग्राहक कोड है।

सत्यापित करें और हटाएं#

एक पैरेंट, प्रत्येक विज़ुअलाइज़ेबल वैरिएंट, गायब और अज्ञात प्रोडक्ट नंबर, सूचीकरण, फ़िल्टर, ऑफ-कैनवास/क्विक व्यू, ब्राउज़र बैक/फॉरवर्ड, मोबाइल लेआउट, कैश/प्रॉक्सी व्यवहार, और सभी प्रासंगिक सेल्स चैनल/डोमेन का परीक्षण करें। एक SDK अनुरोध और सटीक productNumber/SKU मेलखाने की पुष्टि करें।

हटाने के लिए, प्लगइन को निष्क्रिय/अनइंस्टॉल करें या चाइल्ड-थीम Twig और JavaScript को हटाएं, स्टोरफ्रंट एसेट्स को पुनर्निर्माण करें, कैश साफ़ करें, और पुष्टि करें कि कोई SDK अनुरोध या कंटेनर शेष नहीं है।

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