تخصيص المظهر: الأنماط الجاهزة، الألوان، الخطوط، CSS مخصص

خيارات التصميم لكل عرض، الأنماط على مستوى المتجر، وأصناف CSS التي يمكنك استهدافها.

5 دقيقة قراءة

لكل عرض (الخطوة 3 في المعالج)

التخطيط: بطاقات متدرجة، أفقي، جدول بسيط. «يُشترى معاً غالباً» يستخدم دائماً التخطيط الجانبي.
تسميتا «الأكثر طلباً» و«أفضل قيمة» على الشرائح المختارة.
السعر الأصلي (المشطوب) مفعّل أو موقوف.
وراثة ألوان القالب (موصى به) أو لون مميز؛ استدارة الزوايا من 0 إلى 20 بكسل.
عنوان الودجت وموضعه (أسفل السعر أو فوق زر الشراء؛ يمكنك دائماً سحب الكتلة في المحرر).

على مستوى المتجر (الإعدادات › عام › متقدم)

الأنماط الجاهزة: مطابقة القالب، بسيط، ناعم، جريء. تغيّر الحدود والشارات والتظليل معاً.
تجاوز اللون المميز وتجاوز عائلة الخط.
اتجاه النص: تلقائي (يتبع لغة المتجر)، من اليسار إلى اليمين، من اليمين إلى اليسار.
CSS مخصص حتى 5,000 حرف، يُحقن في صفحات المنتجات وفي السلة بجانب الودجت.

محرر القالب (إعدادات الكتلة)

تجاوز التخطيط، الحجم (مدمج / مريح)، الهوامش وصندوق CSS مخصص ثانٍ لكل نسخة من الكتلة.

أصناف CSS

كل شيء يبدأ بـ .bf-: .bf-widget، .bf-title، .bf-tier، .bf-tier.is-selected، .bf-badge، .bf-add (الزر)، .bf-fbt-item، .bf-urgency، .bf-cart-bar، .bf-cart-track، .bf-card-badge. الأحجام بوحدة em، فتغيير font-size على .bf-widget يغيّر حجم الودجت كله.

مشاكل شائعة

لون الزر أو شكله لا يطابق قالبي.

يقرأ الودجت لون الزر الرئيسي ولون نصه واستدارة زواياه وحدوده وخطه من قوالب عائلتي Dawn وHorizon (Dawn وSense وCraft وHorizon وTinker وRitual وقوالب Shopify الأخرى) وقوالب Impact/Prestige وImpulse/Motion. قالب خارجي لا يكشف أياً من تلك المتغيرات يحصل على زر شبه أسود: حدد لوناً مميزاً في الإعدادات › الودجت أو في العرض، ويتحول النص إلى الأسود أو الأبيض تلقائياً.

الودجت يبدو صغيراً جداً أو ضخماً.

يحدد القالب حجم خط أساسي مختلفاً. استخدم إعداد الحجم في الكتلة (مدمج/مريح) أو CSS مخصص: .bf-widget { font-size: 15px; }.