Shopify प्लगइन के लिए उन्नत प्रोडक्ट और कलेक्शन डिस्प्ले अनुकूलन
ये उन्नत सेटिंग आपको WordPress पर अपना स्टोरफ़्रंट कस्टमाइज़ करने, अपने बिज़नेस ब्रैंड को मनमुताबिक बनाने और अपने ग्राहकों के खरीदारी अनुभव को बेहतर बनाने में मदद करती हैं।
इस पेज पर
Shopify प्लगइन और Shopify स्टोरफ़्रंट कॉम्पोनेंट
Shopify प्लगइन, Shopify Storefront Web Components के साथ बनाया गया है। आपके Shopify स्टोरफ़्रंट के बिल्डिंग ब्लॉक के रूप में नीचे दिए गए कॉम्पोनेंट का इस्तेमाल किया जाता है:
- प्रोडक्ट कार्ड कॉम्पोनेंट: यह कॉम्पोनेंट व्यक्तिगत प्रोडक्ट की जानकारी दिखाता है, जिसे आम तौर पर उत्पाद लिस्टिंग या कलेक्शन पेज पर दिखाया जाता है। इसमें अक्सर प्रोडक्ट इमेज, शीर्षक, कीमत और कार्ट में जोड़ें बटन जैसे एलिमेंट शामिल होते हैं।
- प्रोडक्ट क्विक व्यू मॉडल कॉम्पोनेंट: यह कॉम्पोनेंट मौजूदा सामग्री पर प्रोडक्ट विवरण, कार्ट में जोड़ें बटन और पूरे प्रोडक्ट विवरण देखने के लिए एक लिंक के साथ एक मॉडल दिखाता है।
- प्रोडक्ट विवरण पेज कॉम्पोनेंट: यह कॉम्पोनेंट पूरे प्रोडक्ट विवरण के साथ एक ही प्रोडक्ट दिखाता है। हर प्रोडक्ट विवरण पेज कॉम्पोनेंट का एक खास URL होता है।
- कलेक्शन कॉम्पोनेंट: यह कॉम्पोनेंट आपके द्वारा बनाए गए प्रोडक्ट के कलेक्शन को दिखाता है।
Shopify प्रोडक्ट और कलेक्शन डिस्प्ले अनुकूलन
आपके प्लगइन पर डिफ़ॉल्ट Shopify स्टोरफ़्रंट कॉम्पोनेंट में आसान खरीदारी अनुभव बनाने में मदद करने वाले टूल होते हैं। आपके पास अपनी खास ब्रैंड पहचान और डिज़ाइन की ज़रूरतों के मुताबिक इन कॉम्पोनेंट के डिस्प्ले को कस्टमाइज़ करने की सुविधा भी है।
इस तरह के अनुकूलन करने के लिए, आपके पास अपनी WordPress थीम फ़ाइल और डायरेक्टरी को बदलने का एक्सेस होना चाहिए। इस प्रोसेस में आपकी सक्रिय WordPress थीम की डायरेक्टरी में एक खास फ़ोल्डर बनाना शामिल है।
चरण:
Shopifyफ़ोल्डर बनाएं: सीधे अपनी सक्रिय थीम की डायरेक्टरी मेंShopifyनाम का एक नया फ़ोल्डर बनाकर शुरुआत करें। यह फ़ोल्डर आपके कस्टम कॉम्पोनेंट ओवरराइड के लिए केंद्रीय लोकेशन के रूप में काम करता है।- अलग-अलग कॉम्पोनेंट को ओवरराइड करें: किसी खास कॉम्पोनेंट को बदलने के लिए, नए बनाए गए Shopify फ़ोल्डर के अंदर एक खास नाम वाली PHP फ़ाइल जोड़ें। इन ओवरराइड फ़ाइलों के लिए नाम रखने का तरीका महत्वपूर्ण है, ताकि प्लगइन आपके कस्टम वर्शन को पहचान सके और लागू कर सके:
- प्रोडक्ट कार्ड कॉम्पोनेंट को ओवरराइड करने के लिए,
Shopifyफ़ोल्डर मेंproduct-card.phpनाम की एक PHP फ़ाइल बनाएं। - प्रोडक्ट क्विक व्यू मॉडल कॉम्पोनेंट को ओवरराइड करने के लिए,
Shopifyफ़ोल्डर मेंmodal.phpनाम की एक PHP फ़ाइल बनाएं। - प्रोडक्ट विवरण पेज कॉम्पोनेंट को ओवरराइड करने के लिए,
Shopifyफ़ोल्डर मेंpdp.phpनाम की एक PHP फ़ाइल बनाएं। - संग्रहण कॉम्पोनेंट को ओवरराइड करने के लिए,
Shopifyफ़ोल्डर मेंcomponent.phpनाम की एक PHP फ़ाइल बनाएं।
- प्रोडक्ट कार्ड कॉम्पोनेंट को ओवरराइड करने के लिए,
आपकी कस्टम PHP फ़ाइल बन जाने के बाद, प्लगइन उस खास एलिमेंट के लिए अपनी डिफ़ॉल्ट कॉम्पोनेंट फ़ाइल को नज़रअंदाज़ कर देता है। आप इन ओवरराइड फ़ाइलों में स्टैटिक HTML ब्लॉक से लेकर कॉम्प्लेक्स PHP लॉजिक तक, कोई भी कोड लागू कर सकते हैं।
हालांकि, एकरूपता और बिल्ट-इन Shopify फ़ंक्शन तक ऐक्सेस के लिए Shopify स्टोरफ़्रंट वेब कॉम्पोनेंट (जैसा कि डिफ़ॉल्ट प्लगइन संरचना में उपयोग किया गया है) का उपयोग करने की पुरज़ोर सलाह दी जाती है, लेकिन आप इन्हीं तक सीमित नहीं हैं। आप एडवांस कस्टमाइज़ेशन के लिए प्रोडक्ट और संग्रहण डेटा को फ़ेच करने और प्रदर्शित करने के लिए अन्य तरीकों को भी इंटीग्रेट कर सकते हैं।
ज़्यादा जानकारी और सर्वोत्तम कार्यप्रणालियों के लिए, WordPress प्लगइन डेवलपर डॉक्यूमेंटेशन देखें।
Shopify प्रोडक्ट और संग्रहण रीराइट
जब आप Shopify पर कोई प्रोडक्ट या संग्रहण प्रकाशित करते हैं, तो हर प्रोडक्ट और संग्रहण का एक खास URL होता है। डिफ़ॉल्ट रूप से, ये URL आपके Shopify डोमेन के साथ बनाए जाते हैं। रीराइट फ़ंक्शन के साथ, आप उन खास URL को अपने सार्वजनिक WordPress डोमेन से ऐक्सेस कर सकते हैं।
चरण:
- Shopify प्लगइन से, सेटिंग्स पर जाएं.
- एडवांस टैब में, पक्का करें कि Shopify लिंक रीराइट सेक्शन में दोनों चेक बॉक्स एक्टिवेट हैं.
- पर्मालिंक पर जाएं.
- इस नए नियम को लागू करने के लिए सेव करें पर क्लिक करें.
- अपने Shopify एडमिन पर जाएं और फिर उस प्रोडक्ट या संग्रहण के विवरण पेज पर जाएं जिसके लिए आप WordPress लिंक बनाना चाहते हैं।
- सर्च इंजन लिस्टिंग कार्ड में, एक URL दिखाया जाता है जो ग्राहकों को सीधे आपके प्रोडक्ट या संग्रहण से लिंक करता है। उदाहरण के लिए:
https://johns-apparel.myshopify.com › products › huskee-reusable-cup. - अपनी WordPress साइट URL के आखिर में
products/huskee-reusable-cupजोड़ें। उदाहरण के लिए:https://johns-apparel-wordpress.com/products/huskee-reusable-cup.
अपने प्रोडक्ट कार्ड के व्यवहार को कस्टमाइज़ करें
Shopify स्टोरफ़्रंट कॉम्पोनेंट के साथ, दो तरह के प्रोडक्ट विवरण कार्ड होते हैं:
- क्विक व्यू: प्रोडक्ट कार्ड पर होवर करने पर, ग्राहक के पास
क्विक शॉपका विकल्प होता है। क्लिक करने पर, प्रोडक्ट का विवरण बैकग्राउंड में मौजूदा सामग्री के ऊपर पॉपअप या मॉडल स्टाइल में दिखाई देता है। - विस्तृत प्रोडक्ट पेज: जब कोई ग्राहक प्रोडक्ट कार्ड पर क्लिक करता है, जैसे कि इमेज या प्रोडक्ट के नाम पर, तो प्रोडक्ट का विवरण एक खास URL के साथ फ़ुल पेज व्यू में दिखाई देता है।
आप इस सेटिंग को केवल क्विक व्यू, केवल विस्तृत प्रोडक्ट पेज या दोनों को दिखाने के लिए बदल सकते हैं।
चरण:
- WordPress में Shopify प्लगइन से, सेटिंग्स पर जाएं.
- एडवांस टैब से, प्रोडक्ट व्यू सेक्शन पर जाएं.
- वह विकल्प चुनें जो आपके स्टोर के लिए सबसे अच्छा हो.
- सेव करें पर क्लिक करें.