Skip to main content
⚠️ إشعار مهم مثال التخصيص في هذا المستند يعمل فقط مع الإصدار V1.0 من وحدات سلة Upcart. إذا قمت مؤخرًا بترقية سلتك إلى الإصدار 2، فلن يعمل كود هذه التخصيصات. ستحتاج إلى استخدام المحددات الجديدة المتوفرة للإصدار 2 في دليل الترحيل. يرجى مراجعة وثائق التخصيص الأخرى للاطلاع على حلول V2.0.

نظرة عامة

يمنحك Upcart تحكمًا كاملًا لتعديل مظهر السلة وسلوكها باستخدام HTML المخصص وCSS المخصص وJavaScript. تتيح لك هذه الأدوات إضافة ميزات جديدة، أو تنسيق سلتك لتتوافق مع علامتك التجارية، أو إدخال منطق لتحسين طريقة عمل سلتك. يغطي هذا الدليل أساسيات كل منها ويوضح كيفية البدء. يتضمن كل قسم مثالًا مرئيًا سريعًا لمساعدتك على فهم كيف تبدو التغييرات عمليًا.
قبل أن تبدأ، تأكد من مراجعة سياسة التخصيص في Upcart حتى تعرف ما يدعمه فريقنا وما لا يدعمه.

إضافة محتوى باستخدام HTML

يُستخدم HTML لإضافة محتوى ثابت مثل النصوص أو البانرات أو الأزرار إلى سلتك. يمكنك الاختيار من بين مواقع HTML متعددة في محرر Custom HTML (مثل فوق زر الدفع، أو أسفل السلة، أو بين العناصر). حالات الاستخدام الشائعة:
  • إضافة رسائل مخصصة
  • إدراج إخلاءات مسؤولية قانونية أو روابط سياسات
  • إبراز مواعيد الشحن النهائية أو معلومات التسليم
مثال:
محرر Custom HTML في Upcart يضيف رسالة شكر فوق زر الدفع

إضافة منطق باستخدام JavaScript

يتحكم JavaScript في سلوك السلة ومنطقها. يمكنك استخدامه لإظهار العناصر أو إخفائها، أو تطبيق التنسيق بشكل مشروط، أو الاستجابة لتغييرات السلة في الوقت الفعلي. ستغلّف كودك بوسم <script> وتضعه في Custom HTML > Scripts (Before Load) أو Above Announcements، حسب وقت تنفيذه المطلوب. مثال: تحديد السلة بعرض إضافي واحد في كل مرة:
ملاحظة حول الإصدارات القديمة: لا تزال دوال الاستدعاء window.upcartOnItemRemoved وwindow.upcartOnAddUpsell وwindow.upcartOnCartLoaded تعمل ولكنها مهملة وتسجل تحذيرات في وحدة التحكم. استخدم upcartSubscribeItemRemoved وupcartSubscribeUpsellsAddedToCart وupcartSubscribeCartLoaded لجميع السكربتات الجديدة.
محرر Scripts Before Load في Custom HTML بـ Upcart مع JavaScript يخفي وحدة العروض الإضافية
🔧 ملاحظة للمطورين:
يوفر Upcart وثائق كاملة لواجهة برمجة التطبيقات العامة تسرد جميع الدوال والمتغيرات وأنماط أفضل الممارسات المتاحة للتخصيصات المتقدمة. نوصي بمراجعتها عند بناء سكربتات أو تكاملات أكثر تعقيدًا.

تنسيق سلتك باستخدام CSS

يتحكم CSS في شكل ومظهر العناصر في سلتك. استخدمه لضبط المسافات أو الألوان أو أحجام الخطوط أو إخفاء العناصر غير المرغوب فيها. Custom CSS هي إحدى علامات التبويب ضمن Settings (خلف More settings إذا تجاوز صف علامات التبويب حدود العرض). حالات الاستخدام الشائعة:
  • تغيير ألوان عناوين المنتجات أو الأزرار
  • ضبط حجم الخط أو المحاذاة
  • إضافة مسافات بين الأقسام
مثال: تغيير لون عنوان العرض الإضافي في V1.0:
محرر Custom CSS في Upcart ينسق لون عنوان العرض الإضافي مع تأكيد حفظ التغييرات

موارد إضافية

هل تسعى إلى تحسين مهاراتك في HTML أو CSS أو JavaScript؟ اطلع على هذه الأدوات المجانية:

دعم التخصيصات

لا يستطيع فريق دعم Upcart المساعدة في تنفيذ الكود المخصص. لإجراء تغييرات أكثر تقدمًا، نوصي بالاستعانة بـ خبير Shopify.