كيفية عرض فئات المنتجات والعلامات في WooCommerce

نشرت: 2022-04-18

هل تريد معرفة كيفية عرض فئات المنتجات في WooCommerce؟

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

ستوضح لك هذه المقالة كيفية عرض فئات المنتجات والعلامات في WooCommerce.

كيفية إضافة فئات وعلامات إلى WooCommerce

من السهل إضافة الفئات والعلامات في WooCommerce. يمكنك إضافة فئات وعلامات جديدة عند إنشاء قوائم المنتجات أو من لوحة معلومات WooCommerce.

إضافة فئة منتج WooCommerce

اتبع هذه الخطوات لإضافة فئات المنتجات أو الفئات الفرعية في WooCommerce:

أولاً ، انتقل إلى المنتجات »الفئات من منطقة إدارة WordPress الخاصة بك. من هناك ، أدخل معلومات فئة المنتج الخاص بك.

Add woocommerce product category

يمكنك تضمين:

  • اسم
  • سبيكة
  • القسم الرئيسي
  • وصف
  • نوع العرض (المنتجات / الفئات الفرعية / كلاهما)
  • ظفري

انقر فوق الزر إضافة فئة جديدة لإضافة قائمة الفئة إلى قائمتك.

إضافة علامات منتج WooCommerce

يمكنك اتباع هذه الخطوات لإضافة علامات المنتج في WooCommerce:

أولاً ، انتقل إلى المنتجات »علامات من منطقة إدارة WordPress الخاصة بك. في الصفحة التالية ، يمكنك إدخال معلومات العلامة التالية:

  • اسم
  • سبيكة
  • وصف
Add woocommerce product tags

انقر فوق الزر إضافة علامة جديدة لإضافة العلامة إلى قائمتك.

كيفية عرض فئات المنتجات في WooCommerce

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

جدول المحتويات
  1. كيفية إضافة فئات وعلامات إلى WooCommerce
    • إضافة فئة منتج WooCommerce
    • إضافة علامات منتج WooCommerce
  2. كيفية عرض فئات المنتجات في WooCommerce
    • إظهار فئات المنتجات على الصفحة الرئيسية
    • اعرض فئات المنتجات على صفحة المتجر باستخدام SeedProd
    • عرض الفئات على صفحة المتجر باستخدام WooCommerce
    • إظهار فئات WooCommerce الفرعية في صفحة المتجر
    • اعرض فئات منتجات WooCommerce في الشريط الجانبي
    • عرض فئات المنتجات في القائمة

إظهار فئات المنتجات على الصفحة الرئيسية

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

الخيارات الحالية هي:

  • استخدم سمة WordPress المتوافقة مع WooCommerce والتي تتضمن أقسام الصفحة الرئيسية لـ WooCommerce.
  • قم بتحرير نسقك وأضف الرمز المختصر لفئات منتجات WooCommerce.

يتضمن كلا الخيارين الكثير من العمل ، لذلك نوصي باستخدام منشئ مواقع الويب مثل SeedProd لتخصيص متجر WooCommerce الخاص بك.

SeedProd WordPress website builder

SeedProd هو أفضل منشئ مواقع ويب لبرنامج WordPress. يتيح لك إنشاء مواقع ويب WooCommerce كاملة وصفحات مقصودة وموضوعات WordPress مخصصة بدون رمز.

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

اتبع هذه الخطوات لاستخدام SeedProd لإضافة فئات المنتجات إلى صفحتك الرئيسية.

الخطوة 1. تثبيت وتنشيط SeedProd

للبدء ، قم بتنزيل المكون الإضافي SeedProd وتثبيته وتنشيطه على موقع WordPress الخاص بك. يمكنك اتباع هذا الدليل حول تثبيت مكون WordPress الإضافي إذا كنت بحاجة إلى مساعدة.

ملاحظة: ستحتاج إلى خطة SeedProd Elite للوصول إلى ميزات WooCommerce.

بعد ذلك ، انتقل إلى SeedProd »الإعدادات ، وأدخل مفتاح الترخيص الخاص بك ، وانقر فوق مفتاح التحقق . سيؤدي القيام بذلك إلى إلغاء قفل ميزات خطتك التي اخترتها.

enter your license key

يمكنك العثور على مفتاح الترخيص الخاص بك في منطقة حساب SeedProd ضمن علامة التبويب "التنزيلات".

Find your SeedProd license key

الخطوة 2. قم بإنشاء سمة WooCommerce مخصصة

الخطوة التالية هي إنشاء سمة مخصصة لموقع WooCommerce الخاص بك. سيسمح لك ذلك بتخصيص كل جزء من موقع الويب الخاص بك باستخدام محرر SeedProd المرئي القوي.

للقيام بذلك ، انتقل إلى SeedProd »Theme Builder وانقر فوق الزر Themes .

add a theme template

سترى مكتبة من سمات WordPress الاحترافية على هذه الشاشة. إنها طريقة ممتازة لإنشاء مواقع ويب مذهلة دون تعيين مطور ، ولن تحتاج إلى البدء من نقطة الصفر.

ما عليك سوى تحريك مؤشر الماوس فوق المظهر الذي تريده والنقر فوق رمز علامة الاختيار.

choose a woocommerce theme

سيقوم SeedProd تلقائيًا بإنشاء جميع القوالب المختلفة لموضوعك وإدراجها في لوحة معلومات Theme Builder. من هناك ، يمكنك تخصيص كل قالب في المحرر المرئي.

woocommerce theme templates

الخطوة 3. تخصيص صفحة WooCommerce الرئيسية الخاصة بك

لعرض الفئات على صفحة WooCommerce الرئيسية الخاصة بك ، ستحتاج إلى تحرير قالب الصفحة الرئيسية. ابحث عن القالب في قائمتك وانقر على رابط "تحرير التصميم" لفتحه في مُنشئ صفحات SeedProd.

edit woocommerce homepage design

يعد تخصيص صفحتك الرئيسية باستخدام SeedProd أمرًا سهلاً للغاية. توجد كتل وأقسام على اليسار ومعاينة مباشرة على اليمين.

Customize WooCommerce homepage

تعد إضافة كتلة محتوى إلى صفحتك أمرًا بسيطًا مثل السحب والإفلات. يمكنك بعد ذلك النقر فوق أي عنصر لتحرير محتوياته وإعدادات التصميم.

هناك طريقتان لعرض فئات المنتجات على صفحتك الرئيسية باستخدام SeedProd:

  1. عرض المنتجات حسب الفئة
  2. أضف أداة WooCommerce Product Category

لاستخدام الحل الأول ، ابحث عن مجموعة Products Grid في قسم كتل WooCommerce. ثم اسحب الكتلة إلى قسم أو صف في صفحتك الرئيسية.

SeedProd products grid block

انقر فوق شبكة المنتج لفتح لوحة الإعدادات على الجانب الأيسر. في تلك اللوحة ، حدد "استعلام مخصص" من القائمة المنسدلة النوع وقم بتمكين التبديل "تحديد حسب الفئة".

how to display product category in woocommerce

يمكنك اختيار منتجات الفئة التي تريد عرضها في الشبكة. يمكنك تحديد فئات متعددة من خلال الضغط باستمرار على زر التحول.

الآن سيتم عرض المنتجات من الفئات التي اخترتها فقط على صفحتك الرئيسية.

يمكنك اتباع خطوات مماثلة لإخراج المنتجات حسب العلامة فقط. ما عليك سوى تبديل خيار "Select by Tag" واختيار العلامات المراد تضمينها من الخيارات.

WooCommerce display product tags

يمكنك أيضًا استخدام أدوات WooCommerce الأصلية في المحرر المرئي لـ SeedPod ، بما في ذلك أداة فئات المنتجات.

للقيام بذلك ، انتقل إلى قسم حظر الأدوات وابحث عن أداة "فئات المنتجات". بعد ذلك ، اسحبه إلى مكانه في تصميم صفحتك الرئيسية.

WooCommerce product categories widget

يسمح لك النقر فوق الأداة بما يلي:

  • اختر عنوان القطعة
  • ترتيب الفئات بالاسم
  • إظهار كقائمة منسدلة
  • إظهار أهمية المنتج
  • عرض التسلسل الهرمي
  • و اكثر
Product categories widget settings

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

الخطوة 4. قم بتخصيص باقي متجر WooCommerce الخاص بك

يمكنك الآن الانتقال إلى تحرير القوالب الأخرى لموضوع WooCommerce الخاص بك.

فيما يلي بعض الإرشادات للمساعدة:

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

يمكنك أيضًا قراءة بقية هذه المقالة لمعرفة كيفية عرض فئات المنتجات في الشريط الجانبي وقائمة التنقل.

الخطوة 5. انشر موضوع WooCommerce الخاص بك

عندما تكون سعيدًا بكيفية ظهور السمة الخاصة بك ، انتقل إلى SeedProd »مُنشئ السمات ، وفي الزاوية العلوية اليمنى ، قم بتحويل Enable SeedProd Theme إلى وضع" تشغيل ".

Enable seedprod theme

يمكنك الآن معاينة صفحتك الرئيسية لترى كيف تبدو.

how to display product category in woocommerce homepage

اعرض فئات المنتجات على صفحة المتجر باستخدام SeedProd

بالإضافة إلى صفحتك الرئيسية ، يمكنك استخدام SeedProd لعرض الفئات على صفحة متجر WooCommerce الخاصة بك.

للقيام بذلك ، انتقل إلى SeedProd »Theme Builder وانقر فوق تحرير التصميم في قالب" Shop Page ".

edit woocommerce shop page

سيتم فتح الصفحة الآن في المحرر المرئي ، حيث يمكنك تخصيص تصميم صفحة متجرك. اتبع الخطوات في الطريقة السابقة لعرض منتجاتك حسب الفئة.

display woocommerce product category on shop page

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

display product grid by category on woocommerce shop page

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

ما عليك سوى إضافة عمود جديد إلى صفحة متجرك والسحب فوق أداة "فئات المنتجات".

Product category widget woocommerce shop page

فيما يلي مثال لكيفية ظهور ذلك في الوقت الفعلي:

Display woocommerce product categories on shop page

عرض الفئات على صفحة المتجر باستخدام WooCommerce

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

توجه إلى المظهر »تخصيص ، ثم انقر فوق WooCommerce وفئات المنتجات.

تحت عنوان "عرض صفحة التسوق" ، حدد إظهار الفئات.

Show categories shop page woocommerce

إظهار فئات WooCommerce الفرعية في صفحة المتجر

يمكنك أيضًا استخدام الإعدادات الافتراضية لـ WooCommerce لعرض الفئات الفرعية على صفحة المتجر.

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

Show subcategories shop page woocommerce

تذكر النقر فوق الزر " نشر " لحفظ التغييرات.

اعرض فئات منتجات WooCommerce في الشريط الجانبي

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

لتخصيص شريط جانبي باستخدام SeedProd وعرض فئات المنتجات الخاصة بك ، انتقل إلى SeedProd »Theme Builder وافتح قالب الشريط الجانبي.

edit sidebar template

يمكنك السحب فوق كتلة Product Grid وتخصيص خيارات عرض الاستعلام لإظهار المنتجات من فئة أو علامة واحدة.

Show WooCommerce Product Categories in the Sidebar

استخدمنا كتلتين من شبكة المنتجات لعرض فئتين مختلفتين في الشريط الجانبي للمدونة في هذا المثال.

Show WooCommerce Product Categories in the Sidebar

عرض فئات المنتجات في القائمة

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

WordPress menu screen options

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

بعد ذلك ، افتح علامة التبويب "فئات المنتج" ، وحدد جميع الفئات التي ترغب في إضافتها إلى قائمتك وانقر فوق الزر " إضافة إلى القائمة ".

Add product categories to WooCommerce navigation menu

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

Re-order woocommerce menu items

تذكر أن تحفظ قائمتك قبل الانتقال.

يمكنك الآن زيارة الصفحة الرئيسية لموقع الويب الخاص بك ومشاهدة فئات المنتجات في قائمة التنقل الخاصة بـ WooCommerce.

Display product categories in woocommerce menu

ها أنت ذا!

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

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

شكرا للقراءة. يرجى متابعتنا على YouTube و Twitter و Facebook لمزيد من المحتوى المفيد لتنمية أعمالك.