shopify wishlist

قائمة أمنيات شوبيفاي

مجموعة من الملفات المستخدمة لتنفيذ قائمة أمنيات بسيطة للعملاء على متجر Shopify.

الإصدار: 2.3.0 - متوافق مع المتجر الإلكتروني 2.0

الإصدارات السابقة:

• الإصدار 2.1.0 (المتجر الإلكتروني 1.0)
• v2.0.0
• v1.0.0

تثبيت

للبدء في استخدام Shopify Wishlist ، يجب عليك نسخ بعض الملفات الموجودة في هذا الريبو إلى رمز سمة Shopify الخاص بك.

ملاحظة : يفترض هذا الإعداد أن لديك مقتطفًا لعرض بطاقة المنتج.

الملفات المطلوب نسخها:

ملف الريبو	موقع موضوع Shopify
button-wishlist.liquid	snippets/
icon-heart.liquid	snippets/
wishlist-template.liquid	sections/
product-card-template.liquid	sections/
page.wishlist.json	templates/
product.card.json	templates/
Wishlist.js	assets/

1. ضع مقتطف button-wishlist.liquid داخل مقتطف بطاقة المنتج الموجود لديك، أو في قالب product.liquid
   • {%- render 'button-wishlist', product: product -%}
   • سيسمح هذا للعملاء بإضافة/إزالة العناصر إلى/من قائمة أمنياتهم
2. استبدل المقتطف الموجود في قسم product-card-template.liquid بمقتطف بطاقة المنتج الحالي لديك
   • نفس المقتطف من الخطوة 1
   • قد يستخدم مقتطف بطاقة المنتج الخاص بك اسمًا مختلفًا لمتغير المنتج، تأكد من ذلك مرة أخرى؟
3. أضف اسم فئة عنصر بطاقة المنتج الخاص بك إلى كائن selectors في Wishlist.js
   • مثال: إذا كان اسم فئة بطاقة المنتج الخاص بك هو .product-item ، فسيبدو متغير selectors كما يلي:

      const selectors = {
       button: '[button-wishlist]',
       grid: '[grid-wishlist]',
       productCard: '.product-item', // your classname here
     };
     

4. أنشئ صفحة جديدة في مسؤول Shopify:
   • المسؤول > المتجر الإلكتروني > الصفحات > إضافة صفحة
   • قم بتعيين template الصفحة الجديدة على page.wishlist
   • ستعرض هذه الصفحة عناصر قائمة الرغبات المحفوظة للعميل
5. ضع البرنامج النصي في theme.liquid قبل علامة الإغلاق </head>
   • <script src="{{ 'Wishlist.js' | asset_url }}" defer="defer"></script>

هذا كل شيء! عند عرض متجر Shopify الخاص بك، يجب أن ترى أزرار قائمة الرغبات داخل بطاقات المنتج الخاصة بك (على الأرجح في صفحات المجموعات) أو في قالب المنتج. سيؤدي النقر على زر قائمة الرغبات إلى إضافة/إزالة العنصر من قائمة أمنيات العميل وتشغيل التصميم النشط على الزر. بعد إضافة عناصر قائمة الرغبات، يمكنك عرض قائمة الرغبات الخاصة بك عن طريق الانتقال إلى الصفحة التي تم إنشاؤها في الخطوة 3.

متجر شوبيفاي التجريبي

ملحوظات

• تستخدم قائمة الرغبات هذه Javascript وlocalStorage لحفظ قائمة أمنيات العميل على متصفحه. لن يستمر التخزين المحلي إذا قام المستخدم بمسح مساحة تخزين المتصفح أو التصفح في وضع التصفح المتخفي.
• عندما يقوم العملاء بتصفح المنتجات وإضافتها إلى قائمة الرغبات الخاصة بهم، سيقوم البرنامج النصي تلقائيًا بتعيين أي أزرار في قائمة الرغبات إلى الحالة النشطة إذا كان المنتج المقابل مدرجًا بالفعل في قائمة الرغبات.
• تأتي هذه الملفات بدون تصميم أو بنية بحيث يمكنك تخصيصها حسب الحاجة. يهدف هذا إلى تزويدك بالوظيفة الأساسية لقائمة الرغبات دون زخرفة.
• إذا كنت تعمل في قالب غير منشور، فستحتاج إلى إنشاء قوالب جديدة على القالب المنشور أيضًا. سيسمح لك مشرف Shopify فقط بتعيين صفحة لقالب إذا كان القالب موجودًا في السمة المنشورة.
• إذا كنت تقوم بالترقية إلى إصدار Online Store 2.0، فستتم مطالبتك بحذف قائمة الرغبات القديمة وقوالب بطاقة المنتج .liquid liquid.