WooCommerce उत्पाद तालिका के साथ एलिमेंटर में उत्पादों की सूची बनाएं

इस पोस्ट में, हम आपको दिखाएंगे कि एक अधिक अनुकूलित वर्डप्रेस साइट बनाने के लिए एलिमेंटर और WC उत्पाद तालिका को कैसे संयोजित किया जाए और साथ ही आपके WooCommerce स्टोर की बिक्री भी बढ़ाई जाए।

वर्डप्रेस एक वेबसाइट बनाने और उसे तेजी से चलाने की प्रक्रिया को सरल बनाता है। WooCommerce एक वर्डप्रेस plugin है जो आपको किसी भी वर्डप्रेस वेबसाइट को पूरी तरह से काम करने वाले ऑनलाइन स्टोर में बदलने की अनुमति देता है। आप एक नकलची साइट बनाने का जोखिम उठाते हैं, हालाँकि, यदि आप उनके डिफ़ॉल्ट विकल्पों और सुविधाओं को जारी रखते हैं, तो यह आपकी व्यावसायिक आवश्यकताओं के लिए उपयुक्त नहीं हो सकता है। अपनी वेबसाइट को तब तक डिज़ाइन और कस्टमाइज़ करने के लिए सर्वोत्तम टूल ढूंढना महत्वपूर्ण है जब तक कि यह वही न हो जो आप चाहते हैं।

कई वर्डप्रेस और WooCommerce plugin उपलब्ध हैं - एलिमेंटर, उदाहरण के लिए amp आपके WooCommerce उत्पाद पृष्ठ को अनुकूलित करने के लिए सबसे सरल उपकरण है। हालाँकि यह इसके सबसे महत्वपूर्ण फायदों में से एक है, लेकिन इसमें कुछ महत्वपूर्ण कमियाँ भी हैं। amp के लिए , जब आप विभिन्न लेखकों के वर्डप्रेस plugin , तो आपको संगतता त्रुटियों और अन्य जटिलताओं का सामना करने का मौका मिलता है; वर्डप्रेस वेबसाइटों के लिए WooCommerce उत्पाद तालिका और एलिमेंटर plugin उपयोग करते समय ऐसा नहीं है plugin उपयोग करते समय आपकी साइट की उपस्थिति और कार्यक्षमता पर आपका अधिक नियंत्रण होगा , और इन्हें और भी उत्कृष्ट परिणाम प्राप्त करने के लिए संयोजन में उपयोग किया जा सकता है।

WooCommerce उत्पाद तालिका और एलिमेंटर फ्रेमवर्क का एक त्वरित अवलोकन

जैसा कि पहले कहा गया है, एक बेहतर वर्डप्रेस साइट बनाने में आपकी सहायता के लिए वर्डप्रेस plugin का एक विशाल चयन उपलब्ध है जो आपकी विशिष्ट आवश्यकताओं के लिए वैयक्तिकृत है। कुछ plugin को बड़े पैमाने पर उपयोग करने के लिए डिज़ाइन किया गया है, जबकि अन्य को एक विशेष पहलू या सुविधा जोड़ने के लिए डिज़ाइन किया गया है।

एलिमेंटर पहले प्रकार के एप्लिकेशन का एक पूर्व amp है:

हमारा पेज बिल्डर plugin आपको वेब पेज बनाने और अपनी वर्डप्रेस वेबसाइट बनाने के लिए एक बिल्कुल नया इंटरफ़ेस प्रदान करता है। आप विजेट, ब्लॉक और लेआउट की एक विस्तृत लाइब्रेरी को चुनकर और अनुकूलित करके अपनी वेबसाइट को एक साथ रखने के तरीके पर काफी हद तक नियंत्रण प्राप्त कर सकते हैं।

जबकि WooCommerce उत्पाद तालिका एक अधिक सामान्य समाधान है, यह अधिक लक्षित भी है:

यह plugin आपको गतिशील, पूरी तरह से अनुकूलन योग्य तालिकाएँ बनाने की अनुमति देता है जो आपके WooCommerce उत्पादों और सेवाओं को सूचीबद्ध करती हैं। हालाँकि, WooCommerce के साथ उनकी बातचीत के कारण, ये टेबल ऑनलाइन खरीदारों के लिए उपयोगकर्ता के अनुकूल और आकर्षक तरीके से वस्तुओं और सेवाओं को प्रदर्शित करने के लिए विशेष रूप से उपयुक्त हैं। पोस्ट टेबल प्रो plugin एलिमेंटर के साथ समान रूप से इंटरैक्ट करता है और केवल WooCommerce उत्पादों के बजाय किसी भी वर्डप्रेस सामग्री प्रकार को एक तालिका में सूचीबद्ध करता है (यदि आप उत्पादों के अलावा कुछ प्रदर्शित करना चाहते हैं - जैसे पोस्ट, पेज या दस्तावेज़), तो इसके बजाय इसका उपयोग किया जा सकता है।

जब एक दूसरे के साथ संयोजन में उपयोग किया जाता है, तो एलिमेंटर और WooCommerce उत्पाद तालिका महत्वपूर्ण रूप से विविध क्षमताएं प्रदान करती हैं। आप उनका उपयोग कुछ अत्यधिक महत्वपूर्ण प्रभाव उत्पन्न करने के लिए कर सकते हैं जो आपके WooCommerce स्टोर के लिए बिक्री की संख्या बढ़ाने में मदद करेंगे।

अब व्यवसाय में उतरने का समय आ गया है। निम्नलिखित अनुभागों में, हम कुछ वास्तविक दुनिया के amp देखेंगे कि आप ऊपर दिखाए गए प्रभावों के समान प्रभाव बनाने के लिए WooCommerce उत्पाद तालिका और एलिमेंटर का उपयोग कैसे कर सकते हैं।

जब इन दो plugin के संयोजन की बात आती है, तो बहुत कुछ नहीं है - और ये केवल कुछ संभावनाएं हैं। थोड़े से परीक्षण और त्रुटि के साथ, आप उसी मौलिक दृष्टिकोण का उपयोग करके विभिन्न पृष्ठों को एक साथ रख सकते हैं जिसे हम प्रदर्शित करेंगे।

सबसे पहले और सबसे महत्वपूर्ण, आप यह सुनिश्चित करना चाहेंगे कि दोनों plugin आपकी साइट पर सही ढंग से इंस्टॉल हों। यह अच्छी बात है कि एलिमेंटर को स्थापित करना और WooCommerce उत्पाद तालिका को कॉन्फ़िगर करना दर्द रहित और सीधा है। इस चरण पर आगे बढ़ने से पहले WooCommerce को भी स्थापित और सक्षम होना चाहिए। तब आप अपने प्रोजेक्ट पर काम करने के लिए तैयार होंगे।

WooCommerce उत्पाद तालिका को टेक्स्ट एडिटर या शोर्टकोड विजेट में शामिल करने के लिए, इन चरणों का पालन करें:

आइए सबसे मौलिक और लाभकारी अनुप्रयोग से शुरुआत करें। वैकल्पिक रूप से, यदि आप बस अपनी एलीमेंटर वेबसाइट पर एक गतिशील उत्पाद तालिका का उपयोग करना चाहते हैं, तो आप इसे एक विजेट में जोड़ सकते हैं और इसे वेबसाइट के सामने के छोर पर प्रदर्शित कर सकते हैं।

सुनिश्चित करें कि जब आप इसे पूरा करने के लिए कोई पेज या पोस्ट खोलें तो आप एलीमेंटर संपादक का उपयोग कर रहे हैं। यदि आपके सामने परिचित वर्डप्रेस इंटरफ़ेस प्रस्तुत किया गया है, तो एलिमेंटर इंटरफ़ेस पर स्विच करने के लिए एलिमेंट के साथ संपादित करें बटन पर क्लिक करें:

यदि आप एलिमेंटर के साथ पहली बार काम कर रहे हैं, तो आइए प्लेटफ़ॉर्म के चारों ओर थोड़ा भ्रमण करें। दाईं ओर एक बड़ा क्षेत्र दिखाई देगा जहां आपकी सामग्री प्रदर्शित की जाएगी, और जैसे ही आप इसे जोड़ेंगे और बदलेंगे तो यह वास्तविक समय में अपडेट हो जाएगा। स्क्रीन के बाईं ओर, 'विजेट्स' की एक सूची है जिसे आप निर्दिष्ट क्षेत्र में खींच सकते हैं और फिर आवश्यकतानुसार पुनर्व्यवस्थित और कॉन्फ़िगर कर सकते हैं:

एक उत्पाद तालिका का उपयोग विभिन्न एलिमेंटर विजेट के साथ किया जा सकता है। हालाँकि, यदि आप किसी पृष्ठ पर केवल एक ही उत्पाद तालिका प्रदर्शित करना चाहते हैं, तो आप पृष्ठ के HTML कोड में एक परिचयात्मक पाठ अनुभाग शामिल करके इसे पूरा कर सकते हैं। टेक्स्ट एडिटर विजेट को उठाएं और इसे निम्नानुसार एक खाली जगह पर ले जाएं:

उसके बाद, आप डिफ़ॉल्ट टेक्स्ट को हटाने के लिए विजेट के अंदर क्लिक कर सकते हैं और इसे अपनी इच्छित सामग्री से बदल सकते हैं। जब उत्पाद तालिका की बात आती है, तो आप इसे इस सरल शॉर्टकोड में चिपकाकर शामिल कर सकते हैं:

[उत्पाद तालिका]

जब आप अपने पृष्ठ में शोर्टकोड डालते हैं, तो तालिका आपके द्वारा निर्दिष्ट स्थान पर दिखाई देगी, जिसे आप सामने के अंत में देखकर सत्यापित कर सकते हैं:

यदि आप केवल कोड के लिए किसी तत्व का उपयोग करना चाहते हैं, तो आप शॉर्टकोड विजेट का उपयोग कर सकते हैं।

जब आप तालिका की स्थिति पूरी कर लें तो पृष्ठ को सहेजना कभी न भूलें, चाहे आप इसे कहीं भी रखने का निर्णय लें। उसके बाद, आप संभवतः तालिका के प्रकट होने और कार्य करने के तरीके में कुछ बदलाव करना चाहेंगे।

अपने वर्डप्रेस डैशबोर्ड पर लौटें और इस कार्य को पूरा करने के लिए WooCommerce > सेटिंग्स टैब पर जाएँ। उत्पाद तालिकाएँ स्क्रीन के शीर्ष पर उत्पाद और फिर उत्पाद तालिकाएँ चुनकर पाई जा सकती हैं:

आपकी WooCommerce उत्पाद तालिका को कॉन्फ़िगर करने के लिए विकल्पों की एक विस्तृत सूची यहीं पाई जा सकती है। तालिका में दिखाई देने वाली जानकारी पर आपका पूरा नियंत्रण होता है, और आप अन्य चीज़ों के अलावा फ़िल्टर और वेरिएबल जोड़कर इसे अनुकूलित कर सकते हैं। विभिन्न विकल्पों पर अधिक जानकारी के लिए plugin के दस्तावेज़ देखें।

आप बिना कुछ और किए एलिमेंटर का उपयोग करके बनाई गई उत्पाद तालिका को संशोधित करने में सक्षम होंगे। एक बार जब आप तालिका को अपने विनिर्देशों के अनुसार अनुकूलित करना समाप्त कर लें, तो बस अपने परिवर्तन सहेजें, और आप जाने के लिए तैयार हैं!

कई उत्पाद तालिकाओं को व्यवस्थित करने के लिए अकॉर्डियन, टैब और टॉगल का उपयोग किया जा सकता है।

यदि आप अपने WooCommerce उत्पादों के साथ एकल तालिका प्रस्तुत करना चाहते हैं तो उपरोक्त समाधान अच्छी तरह से काम करता है। यदि आप कई तालिकाओं का निर्माण करने जा रहे हैं, जिनमें से प्रत्येक में वस्तुओं की एक अलग श्रेणी है, तो यह सबसे अच्छा विकल्प नहीं है।

एलिमेंटर में इसे पूरा करने के कई अलग-अलग तरीके हैं। amp के लिए, अकॉर्डियन विजेट का उपयोग वही प्रभाव उत्पन्न करने के लिए किया जा सकता है जो हमने पिछले केस स्टडी में देखा था। दाएँ हाथ के संपादन क्षेत्र से शुरू करके, अकॉर्डियन विजेट को बाएँ हाथ के संपादन क्षेत्र पर ले जाएँ।

आप धन चिह्न पर क्लिक करके जितने चाहें उतने अलग-अलग टैब बना सकते हैं, और आप प्रत्येक के भीतर शीर्षकों और पाठ को अनुकूलित कर सकते हैं। इसके अतिरिक्त, आप पहले बताए गए समान शॉर्टकोड का उपयोग करके एक या अधिक टैब में उत्पाद तालिका जोड़ सकते हैं।

निःसंदेह, केवल मूल शोर्टकोड जोड़ने से समान उत्पाद तालिकाओं की एक श्रृंखला बन जाएगी, जो संभवतः वह नहीं है जो आप पहले स्थान पर खोज रहे थे। इसके बजाय, आपको सभी उत्पादों के बजाय केवल निर्दिष्ट उत्पादों को प्रदर्शित करने के लिए प्रत्येक शॉर्टकोड को अनुकूलित करने की आवश्यकता होगी - amp के लिए, एक विशिष्ट श्रेणी के आइटम।

आपके द्वारा उपयोग की जाने वाली विधि उन उत्पादों द्वारा निर्धारित की जाएगी जिन्हें आप प्रश्न में प्रत्येक तालिका से शामिल करना और हटाना चाहते हैं। अतिरिक्त जानकारी के लिए, कृपया अपने WooCommerce उत्पाद तालिका शॉर्टकोड को अनुकूलित करने के लिए संपूर्ण मार्गदर्शिका देखें।

यह ध्यान देने योग्य है कि आप कुछ अन्य सहायक एलिमेंटर विजेट्स की सहायता से समान प्रभाव प्राप्त कर सकते हैं; इसमें अन्य घटकों के अलावा टॉगल विजेट और टैब्स विजेट शामिल हैं। WooCommerce उत्पाद तालिकाओं को प्रस्तुत करने के मामले में , एलिमेंटर आपका पसंदीदा उपकरण है।

मुफ़्त ऑनलाइन HTML, CSS और JavaScript आयोजकों की बदौलत अपने ख़राब मार्कअप को साफ़ करें!

यदि आप चाहते हैं कि आपका व्यवसाय प्रतिस्पर्धा से अलग दिखे तो अपनी ई-कॉमर्स वेबसाइट के डिज़ाइन पर गंभीरता से विचार करें। amp के लिए, आप अपने उत्पादों को प्रदर्शित करने का सबसे प्रभावी तरीका निर्धारित करना चाहेंगे, आदर्श रूप से ऐसी शैली में जो उपयोगकर्ता के अनुकूल हो और देखने में आकर्षक भी हो।

सौभाग्य से, एलिमेंटर के साथ WooCommerce उत्पाद तालिका plugin उपयोग करना इसे एक सीधा कार्य बनाता है। आपके उत्पाद तालिका शोर्टकोड का उपयोग आपकी साइट द्वारा पेश की जाने वाली हर चीज़ (या सिर्फ एक चयन) को वास्तव में गतिशील तरीके से प्रदर्शित करने के लिए किया जा सकता है।

हैन्सन एफ.

हाल के पोस्ट

एलीमेंटर के साथ हेडर और फ़ूटर का उपयोग कैसे करें

किसी वेबसाइट के शीर्षलेख और पादलेख आवश्यक तत्व हैं। अधिकांश मामलों में, हेडर नेविगेशन प्रदान करता है…

6 जनवरी 2022

वर्डप्रेस थीम तुलना: एस्ट्रा बनाम ओशनडब्ल्यूपी

बाज़ार में दो सबसे लोकप्रिय वर्डप्रेस थीम एस्ट्रा और ओसियनडब्ल्यूपी हैं। पेशेवर…

2 जनवरी 2022

वर्डप्रेस समाचार थीम तुलना: समाचार पत्र बनाम एस्ट्रा

एक उत्कृष्ट समाचार वेबसाइट बनाने के लिए आपको वेब डिज़ाइनर बनने की आवश्यकता नहीं है। हम…

25 अक्टूबर 2021

समाचार पत्र थीम के साथ समाचार-संबंधित वेबसाइट बनाएं

न्यूज़पेपर थीम tagDiv द्वारा डिज़ाइन की गई सबसे महत्वपूर्ण वर्डप्रेस थीम में से एक है, जो…

18 अक्टूबर 2021

Avada WooCommerce बिल्डर के साथ ईकॉमर्स कैसे बनाएं

जब ऑनलाइन स्टोर स्थापित करने की बात आती है, तो WooCommerce एक पसंदीदा plugin है। यह…

4 अक्टूबर 2021

एलीमेंटर के साथ स्टिकी हेडर और स्क्रॉलिंग प्रभावों का उपयोग कैसे करें

जब कोई व्यक्ति आपकी वेबसाइट पर जाता है तो आम तौर पर वह पहली चीज़ हेडर देखता है,…

21 सितंबर 2021