كيفية إنشاء موقع WooCommerce يدعمه Elementor

لا يكفي أن تكون منصة WordPress نفسها هي أشهر أنظمة إدارة المحتوى (CMS) في العالم. لدينا أيضًا أشهر منشئ الصفحات ومنصات التجارة الإلكترونية في Elementor و WooCommerce أيضًا. على هذا النحو ، من المنطقي استخدام الثلاثة لإنشاء متجر على الإنترنت ذو مظهر ممتاز وعالي الأداء.

إذا قمنا بتقسيمها ، فإن WordPress مثالي لتنظيم منشوراتك وصفحاتك ومنتجاتك. تقدم WooCommerce تكاملاً محكمًا مع النظام الأساسي بسبب مطوريها (Automattic). علاوة على ذلك ، يوفر Elementor إمكانية إنشاء صفحات السحب والإفلات بطريقة فعالة وسهلة الاستخدام. إنه حل كامل بدون رمز لبناء متجرك.

في هذه المقالة ، سنلقي نظرة على كيفية إنشاء متجر باستخدام Elementor و WooCommerce. طوال الوقت ، سننظر في كيفية توافق كلاهما لتزويدك بأكبر قدر من المرونة لموقعك.

لماذا يعمل WordPress و Elementor و WooCommerce معًا بشكل جيد

يجدر إلقاء نظرة فاحصة على كيفية دمج WordPress و Elementor و WooCommerce لمساعدتك في إنشاء أفضل المتاجر عبر الإنترنت.

بالنسبة للمبتدئين ، يعد WordPress أكثر أنظمة إدارة المحتوى استخدامًا في السوق. بالطبع ، هذا لا يكفي لتبرير مثل هذا الموقف المهيمن بين المستخدمين. في الواقع ، لقد ألقينا نظرة على هذا في منشور سابق ، لذلك نشجعك على قراءة هذا المنشور أكثر. باختصار ، إنها منصة آمنة ومستقرة وقابلة للتطوير يمكنك البناء عليها.

بالحديث عن ذلك ، لديك أيضًا WooCommerce. نظرًا لأن Automattic يطور المكون الإضافي ، فإنه يتمتع بتكامل رائع مع WordPress الأساسي ، لكن هذا ليس كل شيء.

إنها أيضًا أكثر منصات التجارة الإلكترونية شيوعًا. ضمن نظام WordPress البيئي ، لديها حوالي 20 في المائة من المشاركة ، وهو ما يترجم إلى حوالي ثمانية في المائة من جميع مواقع الويب. بالمقارنة ، Shopify لديها حوالي خمسة أو ستة في المائة من حصة السوق. مرة أخرى ، أرقام الاستخدام ليست كل شيء.

تأخذ WooCommerce عملية إنشاء متجر على الإنترنت وتبسط العملية. يمكنك أن تكون جاهزًا للعمل في غضون دقائق ، ولديك منصة تجارة إلكترونية قوية وقوية وقابلة للتمديد جاهزة للتشغيل.

لربطها معًا ، لديك Elementor. كما أن لديها حصة سوقية كبيرة في مجالها وقاعدة مستخدمين ضخمة.

إنه منشئ صفحات السحب والإفلات بنهج فريد لمساعدتك في إنشاء موقع الويب الخاص بك بالكامل من البداية. يعد هذا حلًا مغريًا للاستخدام ، نظرًا لوجود الكثير من الميزات والوظائف القوية التي لا تمتلكها الأدوات الأخرى. الأكثر صلة هنا هو WooCommerce Builder المخصص.

باختصار ، يعد Elementor مكونًا إضافيًا به الكثير من بوصات الأعمدة على مدونة WPKube ، ويجب عليك الاطلاع على أرشيفاتنا لمعرفة ما يمكنه فعله.

ما يحتاجه موقع WooCommerce من أداة إنشاء الصفحات

الوجبات الجاهزة الضمنية من القسم الأخير هي أن Elementor يمكن أن يوفر المزيج الصحيح من الميزات والوظائف التي يحتاجها WooCommerce لنقل موقعك إلى المستوى التالي. رغم ذلك ، من المهم التركيز على سبب ذلك وما يقدمه.

بشكل عام ، يحتاج موقع WooCommerce إلى ما يلي من مُنشئ الصفحات:

• تكامل محكم ، بحيث لا توجد تعارضات بين منشئ الصفحات و WooCommerce.
• الكثير من خيارات التخصيص للمساعدة في إبراز منتجاتك وصفحات متجرك.
• طريقة لتحرير العناصر الفردية التي تشكل صفحة منتج نموذجية.
• وظائف إضافية للمساعدة في "رفع مستوى" متجرك.

يجب عليك (بالطبع) ملاحظة احتياجاتك الفردية أيضًا. على سبيل المثال ، قد تجد النماذج والنوافذ المنبثقة مهمة لمتجرك واستراتيجية البيع. الخبر السار هو أن Elementor أكثر من قادر على تلبية احتياجاتك.

على سبيل المثال ، يحتوي على Popup Builder رائعًا يعمل على تحسين المبيعات والعروض محدودة الوقت والقسائم وغير ذلك الكثير:

يمكنك إنشائها كما تفعل مع قوالب الصفحات الأخرى ، ويمكنك تطبيقها في لمح البصر. علاوة على ذلك ، يمكنك تخصيصها بأي طريقة تختارها تقريبًا. إنه مثالي إذا كان لديك حملة معينة للترويج على موقعك.

كيفية اختيار سمة WooCommerce مناسبة

لن نخوض في الكثير من التفاصيل هنا ، لأننا نغطي هذا في برنامجنا التعليمي ، ونجمع أيضًا بعض السمات في مقال مخصص.

الاعتبار الرئيسي الذي تحتاجه في هذه الحالة هو موضوع متوافق مع Elementor و WooCommerce. حتى نظرة سريعة على مواقع الأسواق المتميزة ستظهر لك أن الكثير من السمات تعلن عن ذلك ، لذا فإن اختياراتك واسعة النطاق.

ومع ذلك ، هناك بعض السمات البارزة التي يمكننا ذكرها:

• واجهة المحل. من المحتمل أن يكون لديه أقل توافق مع Elementor من الآن فصاعدًا ، لأن Block Editor هو تقنية أصلية. ما يزال،
• مرحبًا. هذا هو موضوع البدء الفارغ Elementor ، وهو مثالي لتطوير موقع WooCommerce من البداية. بالطبع ، إذا كان لديك وقت أقل ، فقد يكون من الحكمة اختيار سمة أخرى أكثر اكتمالاً.
• توليد الضغط. هذا هو موضوع رئيسي مع بنية تحتية مرنة. هذا يعني بغض النظر عما إذا كنت تستخدم Block Editor أو Elementor أو أي شيء آخر ، فإن متجرك سيبدو رائعًا.

نحن نشجعك على العثور على المظهر الصحيح قبل البحث في إنشاء موقعك. تذكر أن أفضل النتائج ستكون مع شيء متوافق مع Elementor و WooCommerce.

كيفية إنشاء موقع WooCommerce يدعمه Elementor في 3 خطوات

خلال بقية هذه المقالة ، سوف نوضح لك كيفية استخدام Elementor و WooCommerce معًا لإنشاء موقع للتجارة الإلكترونية. هناك ثلاث خطوات يجب ملاحظتها:

• قم بتثبيت وإعداد WooCommerce.
• قم بإنشاء خطوط منتجات WooCommerce الخاصة بك ، واستخدم Elementor لبناء صفحات المنتج.
• صمم صفحة متجر مخصصة ، مرة أخرى باستخدام Elementor.

رغم ذلك ، في هذا البرنامج التعليمي ، سنفترض أنك قمت بالفعل بتثبيت Elementor Pro وتفعيله. إنه شيء نأخذك إليه في مقالتنا حول إنشاء مسار WordPress. سيساعدك هذا المنشور عندما تواجه مشكلة.

1. تثبيت WooCommerce وإعداده

هناك جانبان يجب مراعاتهما عند إعداد تثبيت WooCommerce: المكون الإضافي نفسه وإعدادات متجرك. في الواقع ، يستغرق تثبيت المكون الإضافي نفس العملية مثل أي مكون إضافي من WordPress.

بالنسبة لإعداد WooCommerce نفسه ، بينما يمكنك أن تكون مستعدًا للذهاب في غضون دقيقتين ، فإنه من المفيد أن تستغرق بعض الوقت لتصفح معالج الإعداد.

عندما يتعلق الأمر بهذه النقطة من الإعداد ، فقد قمنا بتغطيتك. في الواقع ، لدينا منشور تعليمي كامل لـ WooCommerce يتطرق إلى التفاصيل خطوة بخطوة حول كيفية البدء باستخدام WooCommerce وإنشاء منتجك الأول. إنه منشور جيد أن يتم فتحه في علامة تبويب احتياطية أثناء تشغيل هذا المنشور. ستكون المعلومات الموجودة بداخله ذات قيمة لمجموعة الخطوات التالية.

2. قم بإنشاء منتجات WooCommerce الخاصة بك

بمجرد الانتهاء من تثبيت WooCommerce وتأرجحه ، يجب أن تفكر في إنشاء منتجات في النهاية الخلفية. مرة أخرى ، يغطي برنامج WooCommerce التعليمي كيفية القيام بذلك بالتفصيل ، ولكن فيما يلي ملاحظات Cliff:

• توجه إلى المنتجات> إضافة علامة تبويب جديدة داخل WordPress.
• املأ اسم المنتج ووصفه المختصر.
• استخدم مربعات WooCommerce meta لتعبئة بيانات منتجك ، مثل السعر.
• أضف صورة.
• انشر منتجك.

رغم ذلك ، هنا هو المكان الذي يُظهر فيه Elementor أول خطوة قوية له - WooCommerce Builder. هذه طريقة لاستخدام مُنشئ الصفحات لإنشاء تصميم صفحات منتجك.

للبدء ، انقر فوق القوالب> إضافة جديد داخل WordPress:

من هنا ، حدد منتج واحد من القائمة المنسدلة " نوع النموذج" ، وأدخل اسمًا اختياريًا:

سيؤدي هذا إلى فتح مكتبة النماذج لإظهار كل قالب تم إنشاؤه مسبقًا داخل:

بمجرد رؤية التصميم الذي يعجبك ، انقر فوق الزر " إدراج " وسيقوم Elementor باستيراد الكتلة:

هذه طريقة سريعة لإنشاء صفحة منتج مخصصة. يمكنك أن تأخذ هذه البداية الرائعة وتضيف المزيد أيضًا. يتضمن Elementor عددًا من عناصر واجهة المستخدم المخصصة لمساعدتك في إنشاء صفحات خاصة بـ WooCommerce:

بمجرد حصولك على تخطيط الصفحة الذي يعجبك ، انقر فوق الزر "نشر" الأخضر في أسفل الشاشة:

سيظهر هذا نافذة منبثقة لمساعدتك في إعداد شرط معين لعرض القالب:

عندما تكون جاهزًا ، انقر فوق حفظ وإغلاق . من هنا ، يمكنك إضافة المزيد من المنتجات إلى متجرك ، أو العمل على المزيد من القوالب ، أو البدء في العمل على صفحة متجر مخصصة.

3. تصميم صفحة التسوق المخصصة الخاصة بك باستخدام Elementor و WooCommerce

تجربة مستخدم سهلة الاستخدام (UX) لـ WooCommerce هي كيفية إنشاء معظم الصفحات الضرورية التي تحتاجها لمتجرك. تعتبر صفحة المتجر ذات المستوى الأعلى هي الأهم ، حيث إنها المظلة الأمامية التي تزين الباب.

إذا كنت تستخدم WordPress و WooCommerce مع موضوع خاص بـ WooCommerce مثل Storefront ، فإن منفذ الاتصال الرئيسي لتخصيص صفحة المتجر يكون من خلال Customizer. رغم ذلك ، ينصب تركيزنا على Elementor. طريقة القيام بذلك باستخدام منشئ الصفحة هي استخدام صفحة أرشيف المنتجات .

يتيح لك هذا تخصيص كيفية عرض المنتجات على موقعك ، ولكنه لا يتعامل مع بقية الصفحة. في بعض الحالات ، قد يكون من الصعب إدارة مجموعتين من التخصيصات والإعدادات ، ولكن في تجربتنا لم تكن هذه مشكلة حتى الآن.

كما هو الحال مع المنتجات الفردية ، ستحتاج إلى التوجه إلى القوالب> إضافة جديد داخل WordPress ، ثم اختيار أرشيف المنتجات من القائمة المنسدلة:

مرة أخرى ، يمكنك اختيار قالب ، أو تحرير صفحة من البداية ، أو الجمع بين الاثنين لإنشاء شيء فريد. أيضًا كما في السابق ، يمكنك استخدام أي من عناصر واجهة المستخدم الخاصة بـ WooCommerce لمساعدتك في تصميم صفحة ترضيك.

بمجرد النقر فوق الزر نشر مرة أخرى والوصول إلى مربع حوار إعدادات النشر ، يمكنك استدعاء السحر. في شكله الأساسي ، يمكنك تضمين القالب الجديد في Shop Page :

رغم ذلك ، هذا ليس كل شيء. يمكنك إضافة المزيد من شروط التضمين لاستخدام القالب في عدد من الأماكن عبر موقعك. يعد هذا أمرًا رائعًا للاستمرارية ، ومنح الزائرين سببًا لزيارة متجرك.

ملاحظة سريعة حول صفحات WooCommerce الأخرى المُنشأة

قبل أن نختتم ، نريد أن نذكر صفحات WooCommerce الأخرى التي تم إنشاؤها. النبأ السيئ هو أنهم لا يقعون تحت أنظار إليمينتور. بمعنى آخر ، لا يمكنك تحرير صفحات مثل صفحات Checkout أو Thank You بدون إضافة WooCommerce.

هذا أمر مخيب للآمال ، لكنه مفهوم. ومع ذلك ، لا يزال بإمكانك استخدام Elementor لتطوير العناصر المحيطة ، ثم إسقاط وظيفة الصفحة المحددة باستخدام الرموز القصيرة. رغم أنها ليست مثالية.

إذا كان تحرير هذه الصفحات بالكامل أمرًا مهمًا بالنسبة لك ، فستحتاج إلى إلقاء نظرة على محرر Checkout Field Editor (49 دولارًا في السنة) ، وملحق Custom Thank You Pages (أيضًا 49 دولارًا في السنة).

ختاماً

ما الخطأ الذي يمكن أن يحدث عند استخدام ثلاثة من أكثر الأدوات شيوعًا لنشر متجر للتجارة الإلكترونية؟ في هذه الحالة ، ليس هناك الكثير. يقدم كل من WordPress و Elementor و WooCommerce تجربة رائعة. يمكن أن يمنحك الجمع بينهما أقصى درجات إنشاء متجر على الإنترنت وتشغيله.

خلال هذا المنشور ، نظرنا في كيفية استخدام Elementor و WooCommerce معًا لبناء متجر. بمجرد تثبيت كل من المكونات الإضافية وتنشيطها ، فإن مهمتك الأولى هي إنشاء منتجات مع الصفحات المرتبطة بها. من هناك ، تحتاج إلى صفحة متجر مخصصة - وهو شيء يستطيع Elementor التعامل معه. علاوة على ذلك ، يمكن أن تساعد الوظائف الإضافية للمكوِّن الإضافي لباني الصفحات (مثل أداة إنشاء النوافذ المنبثقة والمزيد) في نقل متجرك إلى طبقة الستراتوسفير.

هل تريد إنشاء تركيبة Elementor و WooCommerce لمتجرك التالي ، وإذا كان الأمر كذلك ، فهل ستساعدك هذه المقالة؟ واسمحوا لنا أن نعرف في قسم التعليقات أدناه!