إنشاء واجهة جديدة لقائمة المنتجات (Products List Widget) فى متجر ماجنتو 2

آخر تعديل يناير 27, 2021
الاصدار :
أنت هنا فى :

يسمح ماجنتو 2 بإنشاء قائمة جديدة من المنتجات باستخدام واجهة مستخدم مخصصة (Widget) . تُعتبر قائمة المنتجات الجديدة مثال للمحتوى المتغير (Dynamic) ، و تتكون من بيانات حية و التى يتم سحبها من كتالوج المنتجات الخاص بك . تحتوى قائمة المنتجات فى الوضع الإفتراضى على أول ثمانية منتجات من المنتجات المضافة حديثاً . وبالرغم من ذلك يسمح لك ماجنتو 2 بإعداد القائمة لتحتوى على المنتجات فقط ضمن تاريخ محدد . من خلال منصة ماجنتو 2 سنشرح فى هذا الموضوع كيفية إنشاء قائمة منتجات جديدة باستخدام Widget على متجر ماجنتو 2 . 

إنشاء واجهة جديدة لقائمة المنتجات (Products List Widget) فى متجر ماجنتو 2

واجهة مستخدم جديدة لقائمة المنتج

الخطوة 1 – تعيين نطاق التاريخ لكل منتج (Date Range)

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

1 – من قائمة لوحة التحكم لماجنتو 2 انتقل إلى Catalog > Products .

2 – ابحث عن كل منتج تريد عرضه ، و افتحه فى وضع التعديل (Edit mode) ثم قم بالتالى : 

  • فى حقل Set Product as New From : اضغط على التقويم () ثم قم بتحديد التاريخ الأول الذى تريد ظهور المنتج فيه . 
  • و فى حقل To : اضغط على التقويم () لأختيار التاريج الأخير الذى تريد ظهور المنتج فيه . 
إنشاء واجهة جديدة لقائمة المنتجات (Products List Widget) فى متجر ماجنتو 2

تعيين نطاق التاريخ لكل منتج

3 – اضغط على Save عند الأنتهاء للحفظ . 

4 – عندما تظهر رسالة فى أعلى الصفحة تطلب منك تحديث ذاكرة التخزين Refresh the Cache  ، اضغط على اللينك أو الرابط الموجود فيها و اتبع التعليمات لتحديث الذاكرة واستكمال الخطوات . 

بعد قيامك بهذه الإعدادات ستظهر قائمة المنتجات فى الصفحة الرئيسية (Home Page) خلال التاريخ الذى حددته .

الخطوة 2 – إنشاء واجهة مستخدم جديدة (Widget)

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

1 – من قائمة لوحة التحكم لماجنتو 2 ، انتقل إلى Content > Elements > Widgets

2 – اضغط على Add Widget فى أعلى يمين الصفحة . 

3 – من قسم الإعدادات Settings اكمل الحقول التالية : 

  • Type : اختر نوع واجهة المستخدم ، فى هذه الحالة اختر Catalog New Products List . 
  • Design Theme : اختر نفس تصميم الخلفية المستخدمة فى المتجر . 

4 – اضغط على زر Continue لاستكمال الخطوات .

إنشاء واجهة جديدة لقائمة المنتجات (Products List Widget) فى متجر ماجنتو 2

إعدادات واجهة لمستخدم

5 – من خلال قسم Storefront Properties ، اكمل الحقول التالية  : 

    Widget Title : ادخل عنوان الوصف لنوع واجهة المستخدم . يكون هذا العنوان مرئى لمشرف المتجر فقط .


    Assign to store views : اختر واجهة المتجر الذى تريد تعيين واجهة المستخدم هذه  لها . يمكنك اختيار       جميع الواجهات أو اختيارواجهات محددة .


   Sort Order : ادخل الرقم الذى يحدد ترتيب ظهور هذه العناصر مع العناصر الاخرى فى نفس الجزء من الصفحة      (0 = الاول ، 1 = الثانى ، 2 = الثالث ، و هكذا) . 


إنشاء واجهة جديدة لقائمة المنتجات (Products List Widget) فى متجر ماجنتو 2

خصائص الواجهة الامامية للمتجر

الخطوة 3 – اختيار الموقع (The Location) 

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

1 – من قسم Layout Updates ، اضغط على Add Layout Update ، ثم اتبع التالى :

  • Display On : اختر نوع الصفحة حيث ستظهر الويدجت ، اختر Specified Page
  • Page : اختر الصفحة الذى تريد إضافة واجهة المستخدم الخاصة بقائمة المنتجات فيها ، اختر CMS Home Page لإظهارها فى الصفحة الرئيسية . 
  • فى قائمة Block Refrence :  اختر المساحة فى تخطيط الصفحة حيث سيتم وضع واجهة المستخدم فيها ، اختر فى هذه الحالة Main Content Area
  • Template : اختر أحد القوالب التالية لتحديد شكل او قالب قائمة المنتجات : 
    • New Product List Template لعرض قائمة المنتجات على هيئة قائمة . 
    • New Product Grid Template لعرض قائمة المنتجات على هيئة شبكة أو Grid . 

إنشاء واجهة جديدة لقائمة المنتجات (Products List Widget) فى متجر ماجنتو 2

2 – اضغط من أعلى الصفحة على  Save & Continue Edit .

الخطوة 4 – تكوين قائمة المنتجات 

1 – انتقل من القائمة الجانبية على يسار الصفحة إلى قسم Widget Options .

2 – Display Type : اختر احد الخيارات التالية لتحديد نوع إظهار المنتجات : 

      All Products : وضع المنتجات فى القائمة بالتسلسل بدءً من المنتجات المضافة حديثا .


     New Products : وضع المنتجات فى القائمة التى تم تعريفها و تحديدها كمنتجات جديدة ، ويتم تحديد ذلك من       خلال نطاق التاريخ المحدد فى حقل Set Products As New From / To . و فى حالة انتهاء النطاق التاريخى         دون تحديد أى منتجات جديدة ،  ستكون القائمة حينئذ فارغة .

3 – Display Page Control : لتوفير عناصر التحكم فى التنقل للقوائم ذات الصفحات المتعددة ، اختر Yes من هذا الحقل . ثم من خلال الحقل Number of products per Page ادخل عدد المنتجات الذى تريد عرضها فى كل صفحة . 

4 – Number of Products to Display : ادخل عدد المنتجات الجديدة الذى تريد تضمينها فى القائمة . العدد الافتراضى هو 10 . 

5 – Cache Lifetime : اختر عدد المرات الذى تريد تحديث قائمة المنتجات الجديدة فيها . الوقت الإفتراضى داخل نظام ماجنتو 2 حيث يتم تعيين ذاكرة التخزين المؤقت على 86400 ثانية أو 24 ساعة . 

 

إنشاء واجهة جديدة لقائمة المنتجات (Products List Widget) فى متجر ماجنتو 2

خيارات واجهة المستخدم

6 – اضغط على Save لحفظ الإعدادات السابقة داخل نظام ماجنتو 2 . 

7 – فى أعلى الصفحة عندما تظهر رسالة تطلب منك تحديث ذاكرة التخزين المؤقتة (Refresh the Cache) ، اضغط على الرابط فى هذه الرسالة ثم اتبع الإرشادات . 

الخطوة 5 – تحقق من الخطوات السابقة

 1 – انتقل من قائمة لوحة التحكم لماجنتو 2 إلى Content > Elements > Pages . 

2 – ابحث شبكة الصفحات عن الصفحة التى ستظهر فيها قائمة المنتجات الجديدة التى أنشأتها ، ثم من عمود           Actions اضغط على Preview لمعاينة أو مراجعة الخطوات الذى قمت بها . 

Tags:
Was this article helpful?
Dislike 0
السابق :
التالى :