Skip to main content
تتيح لك وحدة التصميم تخصيص مظهر سلتك، بما في ذلك التخطيط وألوان العلامة التجارية وأنماط الأزرار.

عام

وراثة الخطوط من القالب

يتيح هذا الإعداد لـ Upcart استخدام الخطوط المحددة في إعدادات قالب Shopify الخاص بك. لعرض خياراتك الحالية للخطوط، افتح محرر قوالب Shopify وانتقل إلى قسم Typography.

🚧 معاينة السلة 🚧

لن تظهر الخطوط الموروثة من قالبك في نافذة معاينة Upcart، ولكنها ستُعرض بشكل صحيح في واجهة متجرك المباشرة.

إظهار الأسعار المشطوبة

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

تفعيل سطر المجموع الفرعي

يضيف سطر مجموع فرعي إلى السلة. يؤدي تفعيله أيضًا إلى إظهار حقل Subtotal text color ضمن Colors، بحيث يمكن تنسيق المجموع الفرعي بشكل منفصل عن باقي نصوص السلة. مع إيقاف هذا الإعداد، يكون حقل اللون هذا مخفيًا.

عرض السلة

يتحكم في مدى اتساع الدرج، ويتم ضبطه بشكل منفصل لكل شاشة عرض:
  • سطح المكتب - Default أو Wide
  • الجوال - Full (من حافة إلى حافة) أو Nearly full (فجوة صغيرة عند الحافة)

الألوان

لون الخلفية

يحدد لون الخلفية الرئيسي للسلة، باستثناء التذييل وبطاقات العروض الإضافية (upsell).

لون تمييز السلة

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

لون نص السلة

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

لون نص التوفير

يحدد لون نص التوفير المعروض أسفل سعر المنتج. عنصر سلة مع تمييز نص مبلغ التوفير باللون الأرجواني

لون نص المجموع الفرعي

يحدد لون سطر المجموع الفرعي. يظهر هذا الحقل فقط عند تفعيل Enable subtotal line ضمن General.

🚧 معاينة السلة 🚧

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

إعدادات الأزرار

يوفر Upcart خيارات متقدمة لتنسيق الأزرار، بما في ذلك تخصيص خاص لزر الدفع. ويشمل ذلك طرقًا لتعديلات CSS ودمج أدوات العلامة التجارية في Shopify.

نصف قطر الزوايا

يضبط استدارة زوايا الأزرار، من 0 بكسل إلى 40 بكسل. تمنح القيمة 0 زوايا حادة مربعة؛ و40 هي أقصى استدارة يصل إليها شريط التمرير. تنطبق القيمة على زر الدفع وزر العرض الإضافي وزر الخصم وزر الترقية معًا.
يتوقف شريط التمرير عند 40 بكسل. للحصول على زر بشكل حبة الدواء بالكامل، تحتاج إلى CSS مخصص — راجع تخصيص CSS المتقدم أدناه.
شريط تمرير نصف قطر الزوايا مضبوط على 16 بكسل لاستدارة زر الدفع

لون الزر

يحدد لون الخلفية لجميع الأزرار في السلة، بما في ذلك:
  • زر الدفع
  • زر “Add to Cart” للعرض الإضافي
  • زر “Apply” للخصم
  • زر ترقية الاشتراك. يمكنك تخصيص ألوان هذه الأزرار عبر Cart Editor. لمزيد من التخصيصات المتقدمة مثل تعديلات CSS، راجع قسم التخصيص المتقدم.

لون نص الزر

يحدد لون النص المستخدم في جميع أزرار السلة.

لون نص الزر عند التمرير

يتحكم في لون نص الزر عندما يمرّر العميل مؤشر الفأرة فوقه. على سبيل المثال، إذا تم ضبطه على الأخضر، سيتحول النص إلى الأخضر عند التمرير.

إظهار زر متابعة التسوق

يضيف زر Continue shopping إلى السلة، ما يتيح للعملاء إغلاق الدرج والعودة إلى التصفح دون استخدام أيقونة الإغلاق.

تخصيص CSS متقدم لأزرار الدفع

لإجراء تغييرات تصميم كبيرة، يمكنك استخدام كود CSS مخصص لتعديل زر الدفع:
  1. في Cart Editor، افتح Settings واختر علامة التبويب Custom CSS.
  2. استخدم محدد CSS المناسب، مثل .checkout. أمثلة على مقتطفات CSS: لإنشاء زر بشكل حبة الدواء:
    لإضافة حد أسود:
    استبدل .checkout بفئة CSS الفعلية لزرك. تشمل التنسيقات الإضافية تأثيرات التمرير أو الحشو (padding) أو ألوان النص أو الخطوط.

دمج علامة Shopify التجارية لتخصيص الأزرار

إذا كنت تستخدم Shopify، يمكنك تحديث تصميم زر الدفع عبر لوحة إدارة Shopify:
  1. سجّل الدخول إلى لوحة إدارة Shopify الخاصة بك.
  2. انتقل إلى Settings > Checkout > Customize.
  3. استخدم خيارات العلامة التجارية لتعديل الخط أو الاستدارة أو اللون للحصول على تصميم متناسق.
معاينة درج سلة Upcart مع زر إضافة عرض إضافي وزر دفع