वास्तव में सिर्फ गुटेनबर्ग संपादक के साथ अपनी WooCommerce साइट को अनुकूलित करना मुश्किल हो सकता है। बहुत कम फोंट हैं, सीमित संख्या में विजेट हैं, और खेलने के लिए बहुत कम जगह है। यहीं पर एलीमेंटर आता है। आपकी WooCommerce साइट के प्रत्येक बिट को आपके ग्राहकों को खरीदारी का सर्वोत्तम अनुभव दिलाने के लिए अनुकूलित किया जा सकता है। आप पहले से ही जानते हैं कि खरीदारी का अनुभव जितना बेहतर होगा, रूपांतरण उतना ही बेहतर होगा। यह लेख एलिमेंट के साथ WooCommerce का उपयोग कैसे करें . के बारे में है .
TL;DR :यह लेख WooCommerce के साथ एलिमेंट का उपयोग करने के लिए एक शुरुआती मार्गदर्शिका है। इसके अलावा, हम अनुशंसा करते हैं कि आप BlogVault के साथ अपनी वेबसाइट का बैकअप लें। BlogVault के रीयल-टाइम बैकअप WooCommerce साइटों के लिए बनाए गए हैं, इसलिए आप कभी भी एक भी ऑर्डर, लेनदेन, ग्राहक या उत्पाद नहीं खोएंगे।
पहली बार WooCommerce स्टोर स्थापित करना एक कठिन संभावना हो सकती है, लेकिन यह वास्तव में काफी आसान है। वर्डप्रेस और WooCommerce दोनों को केवल डेवलपर्स के बजाय सामग्री निर्माताओं के लिए साइटों को सुलभ बनाने के लिए डिज़ाइन किया गया है।
एलिमेंटर भी शुरुआत में अटपटा लग सकता है, लेकिन इसमें कुछ निश्चित je ne sais quoi देने की काफी संभावनाएं हैं। आपके स्टोर को।
इस लेख में, हम आपको एक WooCommerce साइट की स्थापना, Elementor, और अन्य प्लगइन्स स्थापित करने के बारे में बताएंगे, जिनकी आपको एक महान WooCommerce साइट को प्रबंधित करने की आवश्यकता होगी। हम इन अतिरिक्त प्लगइन्स को भी प्राप्त करने की सलाह देते हैं क्योंकि एक बार जब आपका स्टोर बंद हो जाता है, तो आप पहियों को ग्रीस रखने के लिए एक रखरखाव दल चाहते हैं।
आइए मूल बातें शुरू करें। आप वर्डप्रेस साइट कैसे बनाते हैं? यदि आपने अपनी WooCommerce साइट पहले ही सेट कर ली है, तो आप एलिमेंट को समझने और उसकी खोज करने के बारे में अनुभाग पर जा सकते हैं।
एक WordPress साइट बनाएं
साइट को अनुकूलित करने से पहले उसे बनाने के लिए कुछ मुख्य चरण हैं:एक होस्ट चुनें, एक डोमेन बनाएं, वर्डप्रेस स्थापित करें, और एसएसएल जोड़ें (सुरक्षा सॉकेट परत)। यहां एक लेख है जो एक वर्डप्रेस साइट को खरोंच से स्थापित करने के बारे में बात करता है। लेकिन यहां संक्षिप्त चरण दिए गए हैं:
- एक होस्ट चुनें: होस्ट चुनते समय कुछ बातों पर ध्यान देना चाहिए:आपकी क्या आवश्यकताएं हैं, क्या होस्ट से पर्याप्त समर्थन है, और क्या यह किफायती है? चुनने के लिए बहुत सारे मेजबान हैं, इसलिए हम सलाह देते हैं कि खरीदारी करने के लिए समय निकालें और कुछ ऐसा देखें जो आपकी आवश्यकताओं और बजट के अनुकूल हो। यहां सावधानी का एक शब्द:सबसे कम कीमत वाला विकल्प शायद ही कभी जाने का रास्ता है। यदि आप बस कूदना पसंद करते हैं, तो हम अपनी परीक्षण साइटों को क्लाउडवे पर होस्ट करते हैं। Cloudways पर WooCommerce साइट बनाना अविश्वसनीय रूप से आसान है और WooCommerce स्थापित के साथ आता है। यह शुरू करने के लिए एक अच्छी जगह है, और यदि आप इस तरह से इच्छुक हैं तो होस्टिंग डैशबोर्ड में आपकी साइट के बारे में बहुत अच्छी जानकारी है।
- डोमेन पंजीकृत करें: एक डोमेन आपकी साइट का नाम है। डोमेन चुनने से पहले, सोचें कि आपकी साइट के लक्ष्य क्या हैं। आप क्या बेचने की कोशिश कर रहे हैं? आपके खरीदार कौन हैं? इसे ध्यान में रखते हुए, एक ऐसा डोमेन नाम बनाएं जो पहचानने योग्य और याद रखने में आसान हो।
- वर्डप्रेस इंस्टॉल करें: वर्डप्रेस को स्थापित करने की प्रक्रिया होस्ट से होस्ट में थोड़ी भिन्न होगी। मेज़बान के दस्तावेज़ देखें या मदद के लिए उनके समर्थन तक पहुँचें। Cloudways के साथ, आपको नया एप्लिकेशन बनाते समय WooCommerce चुनना होगा। Hostinger के साथ, आपको WordPress चुनना होगा और यह अपने आप WordPress Install कर लेगा।
- एसएसएल जोड़ें: फिर, यह मेजबानों के बीच भिन्न होता है। कुछ होस्ट अपनी होस्टिंग के साथ मुफ्त में एसएसएल प्रमाणपत्र प्रदान करते हैं, जबकि अन्य के साथ आपको इसके बजाय एक प्रमाणपत्र प्राधिकरण का उपयोग करने की आवश्यकता होगी। Cloudways के साथ, यह सुरक्षा प्रमाणपत्र अपने आप जुड़ जाता है। एक बार आपके पास प्रमाणपत्र हो जाने के बाद, आप इसे रियली सिंपल एसएसएल प्लगइन के साथ बहुत आसानी से सेट कर सकते हैं।
WooCommerce साइट सेट करें
अब जब आपके पास एक मूल वर्डप्रेस साइट है, तो WooCommerce को स्थापित करने और इसे स्थापित करने का समय आ गया है। WooCommerce उत्पादों को सूचीबद्ध करने से लेकर ग्राहकों को प्रबंधित करने और भुगतान की सुविधा तक आपके स्टोर को शक्ति प्रदान करता है।
इस खंड में, हम WooCommerce की स्थापना की मूल बातें और एलिमेंट के साथ पृष्ठों को ट्विक करने से पहले आपको जो चीजें करनी चाहिए, उसके बारे में बात करेंगे। यहां बताया गया है कि आपको क्या करना चाहिए:
- WooCommerce स्थापित करें: यदि आप अपनी WooCommerce साइट बनाने के लिए Cloudways का उपयोग कर रहे हैं, तो आप इस चरण को छोड़ सकते हैं। यदि नहीं, तो प्लग इन पर होवर करें और नया जोड़ें क्लिक करें . WooCommerce प्लगइन खोजें और इंस्टॉल करें . पर क्लिक करें और सक्रिय करें।
- सेटअप विज़ार्ड के साथ WooCommerce सेटअप करें: सेटअप विज़ार्ड के साथ, आप अपनी WooCommerce साइट के बारे में विवरण जोड़ सकते हैं जैसे मूल दुकान विवरण, पसंदीदा भुगतान विकल्प, शिपिंग विवरण, और आपके लिए आवश्यक कोई भी अतिरिक्त ऐड-ऑन। यहां एक लेख है जो अधिक विवरण के साथ मदद कर सकता है। शुरू करने के लिए साइडबार में WooCommerce पर क्लिक करें।
- हैलो थीम स्थापित करें:हैलो थीम एलीमेंटर द्वारा एक बेयर-बोन थीम है और इसे पेज बिल्डर के पूरक के लिए डिज़ाइन किया गया है। आपको यह चरण करने की ज़रूरत नहीं है, लेकिन यह निश्चित रूप से आपके प्रो लाइसेंस से आपके पैसे का मूल्य निकालने में आपकी मदद करता है। आप इसे एलिमेंटर स्थापित किए बिना स्थापित कर सकते हैं। अपने साइडबार और थीम पर प्रकटन पर क्लिक करें। नया जोड़ें क्लिक करें, खोज बार में हैलो खोजें और इंस्टॉल करें . क्लिक करें और सक्रिय करें .
- अपना स्टोर सेट अप करें: उत्पाद, फ़ोटो, विवरण, मूल्य, श्रेणियां, गोपनीयता नीति, धनवापसी नीति इत्यादि जैसी चीज़ें जोड़ें। यह आपको एलीमेंटर के साथ संपादन शुरू करने पर काम करने के लिए एक कैनवास देता है।
अब, आप भुगतान जोड़ने के लिए तैयार हैं।
भुगतान विधियां जोड़ें
पूरी तरह कार्यात्मक स्टोर बनाने के लिए, आपकी चेकलिस्ट पर अगला आइटम भुगतान विधि जोड़ना है। आखिरकार, यदि कोई ग्राहक आपके उत्पादों में से किसी एक को पसंद करता है, तो आप सही भुगतान करना चाहते हैं?
आपके लिए चुनने के लिए भुगतान प्लगइन्स और गेटवे के ढेर सारे हैं। उनमें से प्रत्येक दूसरे से बहुत भिन्न होता है, इसलिए आपको यह पता लगाने के लिए कुछ शोध करने की आवश्यकता होगी कि आपके स्टोर के लिए सबसे अच्छा क्या काम करता है। भुगतान विधि जोड़ने से आपकी साइट पर कार्ट और चेकआउट पृष्ठ भी खुल जाएंगे। ऐसा करने के लिए यहां चरण दिए गए हैं:
- एक भुगतान विधि चुनें: आप कैश-ऑन-डिलीवरी भुगतान विधि चुन सकते हैं या भुगतान गेटवे का उपयोग कर सकते हैं। आपके ग्राहक किस प्रकार भुगतान करना पसंद करते हैं, लेन-देन शुल्क, और आपकी दुकान कहाँ स्थित है, इसके आधार पर भुगतान गेटवे चुनें।
- पेमेंट गेटवे इंस्टॉल करें:अपना पसंदीदा विकल्प चुनने के बाद, आपको प्लगइन इंस्टॉल करना होगा और अपने खाते को WooCommerce में एकीकृत करना होगा। हमारे पास WooCommerce को स्ट्राइप और पेपाल के साथ एकीकृत करने पर लेख हैं, दो लोकप्रिय विकल्प जो भुगतान विकल्पों और भौगोलिक क्षेत्रों की एक विस्तृत संख्या को कवर करते हैं।
- भुगतान विधि का परीक्षण करें: खरीद प्रक्रिया से गुजरें और देखें कि आपके द्वारा उत्पाद खरीदने वाले ग्राहक के लिए कैसा अनुभव होता है। इससे आपको यह भी पता चलता है कि डिफ़ॉल्ट उत्पाद, कार्ट और चेकआउट पृष्ठ कैसा दिखाई देते हैं। आपको प्रक्रिया को दोहराने की अनुमति देने के लिए कई भुगतान प्लगइन्स में एक परीक्षण या सैंडबॉक्स सुविधा होगी।
अपनी WooCommerce साइट पर Elementor इंस्टॉल करें
WooCommerce विजेट्स की अद्भुत सरणी के कारण हम आपको प्रो संस्करण में निवेश करने की सलाह देते हैं जो आपके लिए उपलब्ध हो जाते हैं। उसके लिए ये चरण हैं:
- तत्व स्थापित करें और सक्रिय करें: अपने WordPress डैशबोर्ड पर वापस, प्लगइन्स . क्लिक करें और फिर नया जोड़ें। सर्च बार में एलीमेंटर खोजें। इंस्टॉल करें Click क्लिक करें जब आपको सही प्लगइन मिल जाए और सक्रिय करें . पर क्लिक करें जब आपका हो जाए।
- खाता बनाएं: आपको एक पृष्ठ पर पुनः निर्देशित किया जाएगा जहां आपको एक खाता बनाने और एक योजना चुनने के लिए कहा जाएगा। चुनने के लिए 3 लाइसेंस हैं और एक निःशुल्क संस्करण है। हम आपको बताएंगे कि बाद के खंड में क्या अंतर हैं। एक बार काम पूरा करने के बाद, WP डैशबोर्ड पर वापस जाएं।
एलिमेंटर पेज एडिटर को समझना
एलिमेंट एक डिज़ाइन पावरहाउस है, जो आपको आसान ड्रैग-एंड-ड्रॉप इंटरफ़ेस के साथ अपने स्टोर के लिए कस्टम पेज बनाने में सक्षम बनाता है। विकल्पों की श्रेणी पहली नज़र में हैरान करने वाली हो सकती है, लेकिन चिंता न करें, इसकी आदत डालने के लिए बस थोड़ा सा बदलाव करना पड़ता है। जब तक आपके पास बैकअप है, एलीमेंटर के माध्यम से अपना रास्ता सीखने का सबसे अच्छा तरीका सही होना है।
इसे ध्यान में रखते हुए, यह अनुभाग आपको पृष्ठ संपादक के लेआउट से परिचित कराने में मदद करेगा।
- संपादित करने के लिए एक पृष्ठ खोलें: अपने पार्श्व मेनू पर पृष्ठों पर होवर करें और सभी पृष्ठ . क्लिक करें . किसी भी पृष्ठ पर होवर करें और संपादित करें पर क्लिक करें। पेज एडिटर खुलने के बाद, एलिमेंट के साथ एडिट करें . पर क्लिक करें . यह आपको एलिमेंटर पेज एडिटर तक ले जाएगा।
यह कैसा दिखता है इसकी एक तस्वीर यहां दी गई है:
आपके स्टोर पर कई महत्वपूर्ण पृष्ठ हैं जो सीधे आपके ग्राहक के खरीदारी अनुभव में योगदान करते हैं। यह नोट करना महत्वपूर्ण है कि कुछ पृष्ठों में एक शोर्टकोड होगा जो इस प्रकार दिखता है:
woocommerce_checkout
यह महत्वपूर्ण है। हटाएं नहीं यह तब तक है जब तक आप एलिमेंट प्रो के WooCommerce विजेट का उपयोग नहीं कर रहे हैं। लेकिन, आप इस शोर्ट के पहले या बाद में इमेज या टेक्स्ट डाल सकते हैं।
अब, पृष्ठ को संपादित करने के तरीके के बारे में बात करते हैं।
- अनुभाग जोड़ें: यदि आप अपने पृष्ठ के विभिन्न भागों पर होवर करते हैं, तो आप देखेंगे कि एक नीला बॉक्स दिखाई देता है। यह पृष्ठ के एक भाग को दर्शाता है। किसी अनुभाग के मध्य में 6-बिंदु वाले चिह्न को संपादित करने के लिए उस पर क्लिक करें। डॉटेड लाइन बॉक्स में + पर क्लिक करें। यह एक नया अनुभाग बनाएगा।
- कॉलम चुनें: प्रत्येक खंड को स्तंभों में विभाजित किया गया है। एक अनुभाग पर होवर करें और सामग्री के विभिन्न ब्लॉक एक नीले बॉक्स के साथ हाइलाइट किए जाएंगे। कॉलम में अलग-अलग तत्व होते हैं जिन्हें व्यक्तिगत रूप से अनुकूलित किया जा सकता है। आप अपनी पसंद के कॉलम का लेआउट चुन सकते हैं। अब आप नए तत्वों को खींचने और छोड़ने के लिए तैयार हैं।
- तत्व जोड़ें: बाईं ओर आपको तत्वों की एक लाइब्रेरी दिखाई देगी। वे साइट और WooCommerce जैसी श्रेणियों के अनुसार क्रमबद्ध हैं। किसी तत्व को कॉलम में खींचें और छोड़ें। आप इस तत्व को साइडबार में संपादित कर सकते हैं। कॉलम के ऊपर दाईं ओर दिखाई देने वाले नीले पेन पर क्लिक करें और साइडबार अलग-अलग अनुकूलन प्रकट करने के लिए बदलता है (उस कॉलम में तत्व के आधार पर)। उदाहरण के लिए, यदि आप टेक्स्ट संपादित कर रहे हैं, तो आपको बाईं ओर टेक्स्ट एडिटर दिखाई देगा।
- अपने परिवर्तनों का पूर्वावलोकन करें: आप अपने साइडबार के निचले भाग में आंख बटन पर क्लिक करके अपनी साइट में किए गए परिवर्तनों का पूर्वावलोकन कर सकते हैं।
- साइट को रिस्पॉन्सिव मोड पर जांचें: नीचे उत्तरदायी मोड लोगो पर क्लिक करें और आप पृष्ठ को विभिन्न दृश्यों में देख सकते हैं कि पृष्ठ मोबाइल, डेस्कटॉप और अन्य स्क्रीन आकारों पर कैसा दिखता है।
- अपनी साइट को प्रकाशित/अपडेट करें: एक बार जब आप काम पूरा कर लेते हैं, तो आप नीचे बाईं ओर स्थित बटन पर क्लिक करके या तो ड्राफ्ट सहेज सकते हैं, अपडेट कर सकते हैं या अपने पृष्ठ को प्रकाशित कर सकते हैं।
अब जब आप अपने पेज एडिटर के लेआउट को समझ गए हैं, तो यहां कुछ बुनियादी विजेट्स की व्याख्या दी गई है।
पाठ संपादित करना
- शीर्षक या पाठ संपादक तत्व को खींचें और छोड़ें: एक सेक्शन जोड़ें और कॉलम की संख्या चुनें। फिर, साइडबार से हेडलाइन या टेक्स्ट एडिटर एलिमेंट को ड्रैग और ड्रॉप करें। “यहां टेक्स्ट जोड़ें” पेज में जोड़ दिया जाएगा।
- सही टेक्स्ट भरें: सभी टेक्स्ट का चयन करें और इसे अपनी इच्छित कॉपी से बदलें।
- पाठ अनुकूलित करें: टेक्स्ट का चयन करें और शैली . क्लिक करें साइडबार में। कलर बार से चुनकर रंग बदलें। इसके अतिरिक्त, आप टाइपोग्राफी के आगे पेंसिल पर क्लिक करके फ़ॉन्ट बदल सकते हैं। आप स्ट्रोक के प्रकार को भी बदल सकते हैं और एक छाया जोड़ सकते हैं या टेक्स्ट एडिटर के संरेखण को बदल सकते हैं।
छवियां जोड़ना
- छवि तत्व को खींचें और छोड़ें: यदि आवश्यक हो तो एक अनुभाग जोड़ें और स्तंभों की संख्या का चयन करें। फिर, इमेज एलिमेंट को ड्रैग और ड्रॉप करें।
- छवि जोड़ें: छवि के ऊपरी दाएं कोने में पेंसिल लोगो पर क्लिक करें। साइडबार में, छवि पर होवर करें और छवि चुनें . चुनें . डिफ़ॉल्ट छवि को अपने साथ बदलें।
- छवि संपादित करें: आप आकार या संरेखण बदल सकते हैं, एक कैप्शन जोड़ सकते हैं, या इसे किसी मीडिया फ़ाइल या URL से लिंक कर सकते हैं।
एक बटन जोड़ना
- बटन तत्व को खींचें और छोड़ें: एक बार जब आपके पास एक कॉलम हो, तो एक बटन तत्व को खींचें और छोड़ें।
- कस्टमाइज़ बटन: आप बटन का प्रकार, बटन पर जाने वाले पाठ, संरेखण, रंग या आकार को बदल सकते हैं। एक लिंक या क्रिया जोड़ें।
उन बुनियादी बातों के साथ, यहां एक टिप दी गई है जो एक टन काम को कम कर देगी:
साइट सेटिंग बनाएं
आप एक रंग थीम बना सकते हैं, वैश्विक फ़ॉन्ट सेट कर सकते हैं, और शीर्ष लेख, पाद लेख और बटन जैसी चीज़ों के लिए टेम्पलेट सेट कर सकते हैं। अपने पृष्ठ संपादक के ऊपरी बाएँ कोने पर हैमबर्गर आइकन क्लिक करें और साइट सेटिंग पर क्लिक करें। एक बार जब आप अपनी साइट के लिए एक डिज़ाइन का पता लगा लेते हैं, तो यह सुविधा भविष्य में नए पृष्ठों को एक साथ लाने में आपका बहुत समय बचाएगी।
ये मूल बातें हैं। एक बार जब आप एलीमेंटर के नियंत्रणों से परिचित हो जाते हैं, तो आप इस नई मिली शक्ति को अच्छे उपयोग में ला सकते हैं।
एलिमेंट प्रो के साथ WooCommerce का उपयोग कैसे करें
यदि आप एलिमेंटर प्रो लाइसेंस के साथ WooCommerce साइट पेज बनाने के लिए खुले हैं, तो यह अनुभाग आपको बताएगा कि विशिष्ट पृष्ठों के लिए कौन से विजेट का उपयोग करना है।
एलिमेंटर के साथ WooCommerce उत्पाद पृष्ठ को कैसे संपादित करें
यह वह पृष्ठ है जहां आपका ग्राहक उत्पाद के बारे में अधिक जान सकता है। यहां किसी एकल उत्पाद पृष्ठ को संपादित करने के चरण दिए गए हैं:
- उत्पाद पृष्ठ संपादित करें: आप या तो एलीमेंटर द्वारा मौजूदा टेम्प्लेट संपादित कर सकते हैं या स्क्रैच से एक बना सकते हैं। टेम्पलेट को संपादित करना आसान है यदि आपको पता नहीं है कि विशिष्ट विजेट्स को कहाँ जाना चाहिए। आप केवल मौजूदा विजेट संपादित कर सकते हैं। विजेट के साथ
- कस्टमाइज़ करें: अगर आप बिल्कुल नए सिरे से शुरुआत करना चाहते हैं, तो यहां वे विजेट दिए गए हैं जिन्हें आप जोड़ सकते हैं:
- उत्पाद शीर्षक: यह वह विजेट है जिसमें आपके उत्पाद का शीर्षक शामिल है। इसे साइडबार में संपादित किया जा सकता है।
- उत्पाद छवि: आप साइडबार में छवि का आकार संपादित कर सकते हैं। बस छवि का चयन करें और दाईं ओर सेटिंग का अन्वेषण करें।
- उत्पाद रेटिंग: यह आपके ग्राहकों के लिए बहुत उपयोगी विजेट हो सकता है। यह उन्हें आपके उत्पाद के बारे में अन्य लोगों की छाप देखने का अवसर देता है।
- संक्षिप्त विवरण: यह एक विजेट है जो आपके विवरण को जोड़ता है जैसा आपने उत्पाद विवरण जोड़ते समय शामिल किया था।
- उत्पाद की कीमत: कीमत जोड़ने के लिए इस विजेट को जोड़ें। जब आप अपनी WooCommerce साइट पर उत्पाद जोड़ते हैं तो कीमत एक विशिष्ट उत्पाद में जुड़ जाती है। तो, यहाँ यह पाठ अपने आप भर जाता है।
- कार्ट में जोड़ें:कार्ट में उत्पाद जोड़ने के लिए यह बटन है। आप साइडबार में रंग, टेक्स्ट या आकार बदल सकते हैं।
- वू ब्रेडक्रंब:ब्रेडक्रंब उत्पाद श्रेणियों को दिखाने के लिए एक विशेषता है। उदाहरण के लिए, यदि आप किसी फ़ैशन साइट से पुरुषों के जूते की काली जोड़ी खरीद रहे थे, तो ब्रेडक्रंब होम/पुरुषों के फ़ैशन/जूते/ब्लैक लेदर शूज़ हो सकते हैं।
- उत्पाद संबंधित: यह "संबंधित उत्पाद" अनुभाग है जिसे आप अक्सर ई-कॉमर्स साइटों पर देखते हैं। आप उत्पाद संबंधित विजेट को खींचकर और छोड़ कर इसे जोड़ सकते हैं।
- विजेट अपसेल: यह विजेट आपके उत्पाद पृष्ठ के "आप भी पसंद कर सकते हैं" अनुभाग को शक्ति प्रदान करता है।
इनमें से प्रत्येक विजेट को फोंट, रंग, संरेखण, स्थिति और बहुत कुछ के संदर्भ में अनुकूलित किया जा सकता है।
- परिवर्तनों की समीक्षा करें: प्रतिक्रियाशील मोड पर क्लिक करें और जांचें कि पृष्ठ विभिन्न उपकरणों पर कैसा दिखता है।
- प्रकाशित करें या अपडेट करें: यदि यह सब ठीक है, तो आप पेज को प्रकाशित या अपडेट कर सकते हैं।
आपके उत्पाद पृष्ठों को संपादित करते समय अनुशंसाएं:
- उत्पादों के लिए उच्च-गुणवत्ता वाली छवियां जोड़ें
- उत्कृष्ट उत्पाद विवरण लिखें
- उत्पादों के लिए वर्णनात्मक और सार्थक नाम चुनें
एलिमेंटर के साथ WooCommerce शॉप पेज को कैसे संपादित करें
संग्रह पृष्ठ के रूप में भी जाना जाता है, यह वह जगह है जहां आपका ग्राहक आपके सभी उत्पादों को देख सकता है। इस पेज का लक्ष्य एक ऐसा पेज बनाना है जहां आपके ग्राहक आसानी से वह पा सकें जो वे चाहते हैं।
- टेम्पलेट संपादित करें या एक नया पृष्ठ बनाएं: बाद के खंड में हम एक नया टेम्पलेट बनाने के बारे में बात करेंगे। आप किसी मौजूदा टेम्पलेट का उपयोग भी कर सकते हैं या बिल्कुल नए सिरे से शुरू कर सकते हैं। यदि आप बिल्कुल नए सिरे से बनाना चाहते हैं, तो पृष्ठों पर होवर करें और नया जोड़ें click क्लिक करें . फिर, आप निम्नलिखित विजेट जोड़ सकते हैं:
- अनुकूलित करने के लिए विजेट जोड़ें: हमने उन विजेट्स को सूचीबद्ध किया है जिन्हें हम अनुशंसा करते हैं कि आप खरीदारी के शानदार अनुभव के लिए जोड़ें:
- उत्पाद श्रेणियाँ: यह आपके ग्राहक को श्रेणियों के माध्यम से उत्पादों को फ़िल्टर करने में मदद करेगा।
- मेनू कार्ट: यह आपके मेनू में एक कार्ट लोगो जोड़ता है जहां आपका ग्राहक देख सकता है कि उन्होंने अपने कार्ट में क्या जोड़ा है।
- उत्पाद: यह आपके द्वारा अपने स्टोर में जोड़े गए सभी उत्पादों को प्रदर्शित करेगा।
- उत्पाद संग्रहित करें: यह ग्राहकों को डिफ़ॉल्ट, लोकप्रियता, नवीनतम या कीमत के आधार पर छाँटने का अवसर देता है।
- कार्ट में कस्टम जोड़ें: आप कार्ट में जोड़ें बटन को कस्टमाइज़ कर सकते हैं। टेक्स्ट, रंग या आकार बदलें।
- WooCommerce ब्रेडक्रंब:यह सभी श्रेणियों को दिखाता है और संग्रह में एक विशेष उत्पाद कहां फिट बैठता है। यह होमपेज से उस पेज तक जाने का रास्ता है, जिस पर आपका ग्राहक वर्तमान में है।
- शीर्षक विज्ञापन विवरण संग्रहित करें: आप एक शीर्षक और विवरण जोड़ सकते हैं और साइडबार में सेटिंग बदलकर इसे संपादित कर सकते हैं।
- पृष्ठ की समीक्षा करें: आप जो चाहते हैं उसे संपादित करने के बाद, समीक्षा करें कि पृष्ठ विभिन्न उपकरणों पर कैसा दिखता है। एक बार जब आप खुश हो जाएं, तो प्रकाशित करें click क्लिक करें .
एलिमेंटर के साथ WooCommerce कार्ट पेज को कैसे संपादित करें
महत्वपूर्ण चेकआउट पृष्ठ के बाद दूसरा, एक अच्छी तरह से डिज़ाइन किया गया कार्ट पेज आपकी बिक्री को बना या बिगाड़ सकता है। इस पृष्ठ को डिज़ाइन करते समय, हम यह पता लगाने के लिए बहुत अधिक शोध करने की सलाह देते हैं कि भुगतान से पहले आपके ग्राहकों को उनके चयन की समीक्षा करते समय क्या देखना चाहिए। लोकप्रिय ई-कॉमर्स साइटों की जाँच करें और जैसे-जैसे आप आगे बढ़ते हैं, डिज़ाइन में बदलाव करें।
कार्ट पेज को पूरी तरह से अनुकूलित करने के लिए आप एलिमेंटर कार्ट विजेट का उपयोग कर सकते हैं। ऐसा करने के लिए यहां चरण दिए गए हैं:
- मौजूदा कार्ट पेज संपादित करें: आप पृष्ठों पर होवर करके और सभी पृष्ठ . क्लिक करके किसी मौजूदा पृष्ठ को संपादित कर सकते हैं . फिर, संपादित करें click क्लिक करें जब आप कार्ट पेज पर होवर करते हैं। फिर, एलिमेंट के साथ संपादित करें पर क्लिक करें।
- संक्षिप्त कोड को विजेट से बदलें: शोर्ट कोड का एक टुकड़ा है जो एक पृष्ठ पर एक सुविधा जोड़ता है। कार्ट विजेट के साथ, आपको इसकी आवश्यकता नहीं है, इसलिए संक्षिप्त कोड हटाएं और इसे साइडबार से विजेट से बदलें।
- पेज को पसंद के मुताबिक बनाएं: साइडबार की जाँच करें और सेटिंग्स का अन्वेषण करें। आप निम्न चीज़ें आज़मा सकते हैं:
- सामान्य: प्रत्येक अनुभाग में स्तंभों की संख्या चुनें और कुछ स्तंभों को साइडबार में टॉगल करके चिपचिपा बनाएं।
- आदेश सारांश: यदि आप चाहें तो कार्ट अपडेट करें बटन बदलें।
- कुल: आप चेकआउट के लिए आगे बढ़ें सहित कार्ट कुल अनुभाग के लिए लेबल, संरेखण और बहुत कुछ अनुकूलित कर सकते हैं बटन।
- अतिरिक्त विकल्प: आपको कार्ट को स्वचालित रूप से अपडेट करने की क्षमता को टॉगल करने देता है।
<मजबूत>
यदि आप शैली . क्लिक करते हैं साइडबार में, यहां वे चीज़ें दी गई हैं जिन्हें आप कस्टमाइज़ कर सकते हैं:
- अनुभाग: विभिन्न अनुभागों की शैली को नियंत्रित करें - जैसे ड्रॉप शैडो या पृष्ठभूमि रंग जोड़ना।
- टाइपोग्राफी: आपकी वेबसाइट के सौंदर्यशास्त्र से मेल खाने के लिए सभी टेक्स्ट को बदला जा सकता है।
- बटन: रंग, टेक्स्ट, आकार और बहुत कुछ बदलें।
- आदेश सारांश: कस्टमाइज़ करें कि ऑर्डर सारांश कैसा दिखता है।
- कुल: कार्ट कुल अनुभाग संपादित करें।
- चेकआउट बटन: आप चेकआउट बटन के रंग, आकार, टेक्स्ट और संरेखण को अनुकूलित कर सकते हैं। <मजबूत>
- मोबाइल दृश्य में समीक्षा करें: एक बार जब आप कर लें, तो मोबाइल दृश्य में पृष्ठ की समीक्षा करें। अगर आप चीजों के दिखने के तरीके से खुश हैं, तो प्रकाशित करें . क्लिक करें .
एलिमेंटर के साथ WooCommerce चेकआउट पेज को कैसे संपादित करें
ठीक है, यह आपकी ईकॉमर्स साइट का सबसे महत्वपूर्ण पृष्ठ है। यह अंतिम पृष्ठ है जिसे आपका ग्राहक देखता है, और जहां वे खरीदने का निर्णय लेते हैं। चेकआउट पृष्ठों की ड्रॉप-ऑफ दरें उच्चतम हैं, और इसलिए आपको यह सुनिश्चित करने की आवश्यकता है कि यह यथासंभव घर्षण-रहित हो।
एलीमेंटर प्रो में एक चेकआउट विजेट है जो चेकआउट पेज को संपादित करना बहुत आसान बनाता है। यह कार्ट और मेरा खाता विजेट के साथ काम करता है, जिससे आप मौजूदा चेकआउट पृष्ठ को संपादित कर सकते हैं। विजेट के साथ, आप अपने चेकआउट पृष्ठ में डिज़ाइन परिवर्तन कर सकते हैं जैसे टेक्स्ट रंग, संरेखण, अनुभाग, और बहुत कुछ।
- एलिमेंटर संपादक के साथ चेकआउट पृष्ठ खोलें: पृष्ठों . पर होवर करें और सभी पृष्ठ . क्लिक करें . चेकआउट पृष्ठ . पर होवर करें और संपादित करें पर क्लिक करें। सबसे ऊपर, एलिमेंट के साथ संपादित करें पर क्लिक करें . एक सेकंड रुकें और इससे एलिमेंट एडिटर में पेज खुल जाएगा।
- चेकआउट शोर्टकोड को चेकआउट विजेट से बदलें: शोर्टकोड WooCommerce का आपके पेज पर Checkout फ़ील्ड्स को शामिल करने का तरीका है। यह इस तरह दिखता है:
woocommerce_checkout
इसके बजाय, बाईं ओर लाइब्रेरी से चेकआउट विजेट जोड़ें। यह आपको एक पूर्वावलोकन देगा कि चेकआउट पृष्ठ कैसा दिखता है।
नोट:चूंकि, आप चेकआउट पृष्ठ पर संपादन कर रहे हैं, इसलिए अपनी कार्ट में कुछ उत्पाद जोड़ें और चेकआउट करने के लिए बटन पर क्लिक करें। यह आपको दिखाएगा कि बेहतर अनुभव के लिए इसमें उत्पादों के साथ पृष्ठ कैसा दिखता है।
- पेज को पसंद के मुताबिक बनाएं: आप साइडबार में एलीमेंटर चेकआउट विजेट की कई सेटिंग्स एक्सप्लोर कर सकते हैं। यहां कुछ सेटिंग दी गई हैं जिन्हें आप बदल सकते हैं:
- सामान्य: आप एक या दो कॉलम लेआउट चुन सकते हैं, एक कॉलम को चिपचिपा बना सकते हैं, और एक ऑफसेट जोड़ सकते हैं ताकि हेडर कॉलम को बाधित न करे।
- बिलिंग या शिपिंग फ़ॉर्म बदलना: आप इनमें से प्रत्येक प्रपत्र, प्रत्येक प्लेसहोल्डर और प्रत्येक फ़ील्ड के लिए शीर्षलेख संपादित कर सकते हैं।
- अतिरिक्त जानकारी: यह वह खंड है जहां आपके ग्राहक आदेश के बारे में निर्देश या जानकारी जोड़ सकते हैं।
- कूपन सेटिंग: अपने कूपन के संरेखण और टाइपोग्राफी को अनुकूलित करें।
- भुगतान: आप भुगतान बटन के सभी पहलुओं को अनुकूलित कर सकते हैं; उदाहरण के लिए संरेखण और रंग।
आप शैली . क्लिक करके और चीजें संपादित कर सकते हैं :
- खरीदारी बटन: आप खरीद बटन के लिए रंग, टेक्स्ट, रिक्ति आदि बदल सकते हैं। यह वह बटन है जिस पर आपके ग्राहक अपनी कार्ट का भुगतान करने के लिए आगे बढ़ने के लिए क्लिक करेंगे।
- आदेश सारांश: आप ऑर्डर किए गए उत्पादों की सूची की टाइपोग्राफी और स्पेसिंग चुन सकते हैं।
- टाइपोग्राफी: आप प्रपत्रों को छोड़कर सभी टेक्स्ट को कस्टमाइज़ कर सकते हैं।
- फ़ॉर्म: अपने रूपों की टाइपोग्राफी और रंग को अनुकूलित करें। पंक्तियों गैप . का प्रयोग करें रिक्ति बढ़ाने के लिए सेटिंग्स।
- मोबाइल दृश्य में पृष्ठ की समीक्षा करें: सुनिश्चित करें कि मोबाइल दृश्य में भी साइट अच्छी दिखे।
अपना चेकआउट पृष्ठ संपादित करते समय अनुशंसाएं:
- पर्याप्त भुगतान विकल्प हैं
- कोई भी अनावश्यक फ़ील्ड हटाएं
- चेकआउट की सारी जानकारी एक पेज पर रखें
एलिमेंटर के साथ टेम्पलेट कैसे बनाएं
एलिमेंटर के साथ, आप अपने ब्रांड के अनुकूल कस्टम टेम्पलेट बना सकते हैं। उदाहरण के लिए, आप शीर्षलेख और पादलेख को अनुकूलित कर सकते हैं, ताकि वे प्रत्येक पृष्ठ पर आपकी साइट की ब्रांडिंग के साथ दिखाई दें। इस खंड में, हम हेडर के लिए एक कस्टम टेम्पलेट तैयार करेंगे। यहां बताया गया है कि आप ऐसा कैसे करते हैं।
- नया टेम्प्लेट बनाएं: ग्लोबल हैडर तत्व वह है जो आप अपनी साइट के प्रत्येक पृष्ठ पर देखते हैं। टेम्प्लेट बनाने के लिए, एलिमेंट . क्लिक करें साइडबार में, फिर थीम निर्माता click क्लिक करें . अब नया टेम्प्लेट जोड़ें click क्लिक करें .
- सही प्रकार का टेम्पलेट चुनें: यदि आप हेडर बना रहे हैं, तो हेडर choose चुनें टेम्पलेट के प्रकार के लिए ड्रॉपडाउन में। इस टेम्पलेट के लिए एक अर्थपूर्ण नाम चुनें ताकि आप इसे बाद में आसानी से पहचान सकें। फिर, टेम्पलेट बनाएं click क्लिक करें
- टेम्पलेट लाइब्रेरी ब्राउज़ करें: अब, आप पुस्तकालय में पूर्वनिर्धारित टेम्पलेट्स में से चुन सकते हैं और सम्मिलित करें . पर क्लिक कर सकते हैं . प्रत्येक टेम्प्लेट पूरी तरह से अनुकूलन योग्य होता है, इसलिए आप जो खोज रहे हैं उसके सबसे नज़दीकी टेम्पलेट चुनें।
- टेम्पलेट संपादित और अनुकूलित करें: अपने सपनों का खाका बनाने के लिए संपादक का उपयोग करें। रंग, चित्र, फ़ॉन्ट आदि के साथ खेलें.
- टेम्पलेट प्रकाशित करें: एक बार जब आप टेम्प्लेट में बदलाव कर रहे हों, तो प्रकाशित करें . पर क्लिक करें साइडबार के निचले भाग में और आपको यह चुनने के लिए प्रेरित किया जाएगा कि आप टेम्पलेट को कहाँ प्रदर्शित करना चाहते हैं। ड्रॉपडाउन से चुनें कि आप क्या चाहते हैं। सहेजें और बंद करें क्लिक करें . आपको वापस संपादक के पास भेज दिया जाएगा लेकिन आपका नया टेम्प्लेट लाइव हो जाएगा।
- समीक्षा करें: एक नज़र डालें Click क्लिक करें नीचे पॉपअप में और यह आपको एक पूर्वावलोकन पृष्ठ पर ले जाएगा। आप जैसे चाहें बदलाव करें।
एलिमेंटर के साथ ईकामर्स पॉप-अप कैसे बनाएं
यदि आप कोई पॉपअप जोड़ना चाहते हैं, तो ये चरण हैं:
- पॉपअप टेम्प्लेट बनाएं :क्लिक करें टेम्पलेट साइडबार में और पॉपअप . क्लिक करें और नया जोड़ें . अपने टेम्पलेट को नाम दें और टेम्पलेट बनाएं पर क्लिक करें .
- पॉपअप बनाएं: आप या तो शुरुआत से एक बना सकते हैं या एलिमेंट टेम्पलेट संपादित कर सकते हैं। आप रंग, टेक्स्ट आदि चुन सकते हैं।
- पॉपअप प्रकाशित करें: यह अनिवार्य रूप से आपके पॉपअप को एक टेम्पलेट के रूप में सहेजता है जिसे आप बाद में लिंक कर सकते हैं। प्रकाशित करें Click क्लिक करें और सहेजें और बंद करें .
- पृष्ठ संपादित करें: पेज Click क्लिक करें साइड बार में और सभी पेज . वह पृष्ठ चुनें जिसमें आप पॉपअप जोड़ना चाहते हैं और संपादित करें click क्लिक करें तत्व के साथ .
- एक बटन जोड़ें: पेज एडिटर खुलने के बाद, साइडबार से बटन विजेट को ड्रैग और ड्रॉप करें। वह टेक्स्ट जोड़ें जो आप चाहते हैं और इसे आप जो भी रंग पसंद करते हैं उसे बनाएं।
- पॉपअप से लिंक करें: साइडबार में, लेआउट के अंतर्गत, लिंक, डायनामिक, क्रियाएँ . चुनें और पॉपअप . फिर पॉपअप खोलें . क्लिक करें और आपके द्वारा बनाए गए पॉपअप का चयन करें।
- समीक्षा करें: बटन की कार्यप्रणाली की समीक्षा करें और अपडेट करें . क्लिक करें जब आप तैयार हों।
एलिमेंटर बनाम एलीमेंटर प्रो:दूसरा स्विच कब करना है?
एलिमेंटर का मुफ्त संस्करण बुनियादी पेज डिजाइन करने के लिए टूल के साथ स्टॉक किया गया है और ब्लॉग के लिए बहुत अच्छा है। WooCommerce साइट डिज़ाइन करते समय, आप एलिमेंटर प्रो के लिए लाइसेंस खरीदना बेहतर समझते हैं। उनके पास बहुत सारे विजेट और तत्व हैं जो विशेष रूप से एक अद्भुत WooCommerce अनुभव के लिए डिज़ाइन किए गए हैं।
यहां कुछ बेहतरीन विजेट्स की सूची दी गई है जिन्हें आपको निश्चित रूप से आजमाना चाहिए:
- उत्पाद श्रेणी: यह आपके ग्राहक को श्रेणियों के आधार पर उत्पादों को छाँटने में मदद करता है। इससे उनके लिए कुछ ढूंढना और खरीदना इतना आसान हो जाता है।
- कार्ट में जोड़ें: अपने ब्रांड के लिए बटन को कस्टमाइज़ करना बहुत आसान है। आप रंग, बॉर्डर, फोंट आदि बदल सकते हैं।
- उत्पाद अपसेल विजेट: क्या आपने कभी Amazon पर संबंधित उत्पाद अनुभाग देखा है? यह वही चीज़ है। आप अपने ग्राहक को अन्य उत्पाद दिखा रहे हैं, जो उनके द्वारा देखे जा रहे वर्तमान उत्पाद के आधार पर उनकी रुचि हो सकती है।
- खाली कार्ट संदेश :ग्राहकों को यह जानने के लिए एक आकर्षक संदेश जोड़ें कि यदि वे चेकआउट करने का प्रयास करते हैं तो उनकी कार्ट खाली है। यह एक अच्छा तरीका है उन्हें अपनी उत्पाद सूची में एक और नज़र के लिए वापस लाने के लिए।
- उत्पाद रेटिंग: सामाजिक प्रमाण एक शक्तिशाली प्रेरक है, और यह आपके उत्पाद और आपकी साइट पर विश्वास बनाता है। आप इस विशिष्ट कारण के लिए पिछले ग्राहकों से समीक्षाओं का अनुरोध करना चाह सकते हैं।
- उत्पाद समीक्षा: यह नए ग्राहकों के लिए आपके उत्पादों की विश्वसनीयता लाता है।
एलिमेंटर के फायदे और नुकसान
एलिमेंटर केवल पेज बिल्डर नहीं है, और कई डेवलपर्स या डिजाइनरों को निश्चित रूप से प्राथमिकता होगी। हम एलिमेंटर को पसंद करते हैं क्योंकि यह सर्वव्यापी और उपयोग में आसान है, लेकिन आपकी ज़रूरतें अलग हो सकती हैं। हमने निम्नलिखित पेशेवरों और विपक्षों की सूची में एक पेज बिल्डर चुनने के मुख्य विचारों को तोड़ दिया है। यदि कोई आवश्यक विशेषता विपक्ष सूची में है, तो आप एक वैकल्पिक पृष्ठ निर्माता की तलाश कर सकते हैं।
पेशेवरों
- उपयोग में आसानी: ड्रैग एंड ड्रॉप कार्यक्षमता सुपर आसान है। आप बिना किसी कोडिंग या किसी अन्य प्लग इन का उपयोग किए अपने पेज को सही मायने में कस्टमाइज़ कर सकते हैं।
- पैसे का मूल्य: प्रो संस्करण के साथ 24 WooCommerce- विशिष्ट तत्व उपलब्ध हैं। वे खरीदारी प्रक्रिया के सभी प्रमुख पहलू हैं, और आपके ग्राहकों के लिए बेहतर अनुभव बनाने के लिए डिज़ाइन किए गए हैं।
- अंतर्निहित उत्तरदायी डिजाइन: गुटेनबर्ग के विपरीत, जहां आपको एक नए टैब पर अपने परिवर्तनों का पूर्वावलोकन करना होता है, एलीमेंटर के साथ जो आप देखते हैं वही आपको मिलता है। आप दृश्य बदल सकते हैं और संपादित करना जारी रख सकते हैं।
विपक्ष
- लागत: जबकि मुफ्त संस्करण एक मूल साइट को अनुकूलित करने में मदद करता है, असली जादू प्रो संस्करण के साथ होता है। तीन योजनाएं हैं जो $ 49 से $ 999 प्रति वर्ष तक हो सकती हैं।
- गड़बड़ अद्यतन और पर्याप्त समर्थन नहीं: उनके पास अतीत में गड़बड़ अपडेट और साइट स्वामियों की मदद करने के लिए बहुत कम समर्थन के मुद्दे थे।
- WooCommerce की समस्याएं: कभी-कभी, Elementor WooCommerce साइट पर काम करना बंद कर देता है। हमारे पास बाद में एक खंड है जहां हम बात करेंगे कि इसे कैसे ठीक किया जाए।
एलिमेंटर WooCommerce के साथ काम नहीं कर रहा है? इसे कैसे ठीक करें
यह विशेष रूप से सामान्य है यदि आप एलीमेंटर स्थापित करने के बाद WooCommerce स्थापित कर रहे हैं। यहाँ कुछ चीज़ें दी गई हैं जिन्हें आप समस्या को ठीक करने का प्रयास कर सकते हैं:
- अपना एलिमेंट, वर्डप्रेस अपडेट करें, और WooCommerce संस्करण :Make sure your plugins and PHP are all up to date. We have an article on updating plugins safely that you might find helpful.
- Enable Switch Editor Loader Method: Click Elementor in the sidebar and click Settings . Then, head over to the Advanced tab and enable Switch Editor Loader Method by clicking the check box.
- Clear your cache: If you have a cache plugin, clear your cache and see if that helps. You can also temporarily disable the caching plugin and this will enable you to bypass any caching issues.
- Check if any other plugins are interfering with Elementor functioning: To do so, deactivate all plugins and check to see if you’re able to load Elementor. If so, reactivate all the plugins and keep deactivating them one by one till it works again. Then you know which plugin is the problem. You can either keep the plugin deactivated or roll it back to an older version.
Recommended plugins for WooCommerce sites
- BlogVault: Safeguard every order, purchase, customer, and transaction on your WooCommerce store with BlogVault’s real-time backups. Completely automated, BlogVault’s real-time backups sync to your store every 5 minutes, and are stored offsite for even greater safety.
- MalCare :This best-in-class WordPress security plugin is all you need to protect your site from hackers and their malware. Easily scan and clean malware in just a few clicks, and prevent malware from entering your site with an advanced firewallProtect your customer details from ever being accessed by hackers with MalCare.
- Google Analytics:The OG analytics tool to analyze your traffic and understand your customers better. We have an article on integrating Google Analytics into your WooCommerce site.
- YITH WooCommerce Order Tracking: This plugin helps manage shipping information easily. It allows your customers to track their purchases.
- YITH Advanced Refund System for WooCommerce: This plugin helps you set up a refund system.
Final thoughts
If you’re ready to invest in a page builder, Elementor can be a great option. But, before you make those changes, backup your site with BlogVault. It’s a great way to protect your site from mishaps and serves as insurance in case something goes terribly wrong.
FAQ
How good is Elementor for a WooCommerce site?
Elementor is excellent for a WooCommerce site because it has so many elements that you can customize, specifically for making your customer’s journey better. With the Pro version of Elementor, you won’t need other plugins to build a high-functioning WooCommerce site.
Is Elementor the best page builder?
Elementor is one of the best page builder plugins, amidst others like SeedProd and WPBakery. It’s easy, highly customizable and totally worth the cost.
What are the best add-Ons for WooCommerce?
Some essential add-ons for WooCommerce sites are BlogVault for backups, MalCare for security, YITH WooCommerce Order Tracking, and YITH Advanced Refund System for WooCommerce.
How do I add Elementor to WooCommerce?
You can install Elementor from your WordPress admin’s plugin directory. Next, activate it and add your license key if you’re using the Pro version. You’re now ready to build the site you want.
Is WooCommerce free with Elementor?
WooCommerce is free. Elementor has both a free and paid version. Though, for WooCommerce, you’re better off buying the paid version of Elementor.
Can I edit WooCommerce with Elementor?
Yes, you can edit a WooCommerce site easily with Elementor. In fact, every inch of your WooCommerce site can be edited with Elementor. Just install, activate, and get customizing.
What is Elementor in WooCommerce?
Elementor is a page builder plugin for WordPress and WooCommerce sites. They offer free and paid versions of the plugin. Once you install it, you have a wide range of elements to drag, drop, and customize.