قبل وبعد

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

الإعدادات العامة

تتحكم هذه الخيارات في طريقة عرض المكون بشكل عام وشكل الخط الفاصل بين الصورتين.

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

خيارات المسافات

تتحكم هذه الخيارات في المسافات الداخلية للمكون، لإضافة مسافات خارجية يرجى إضافة عنصر «فاصل» من قائمة المكونات.

اسم الخيار	الوصف
المسافة العلوية - شاشات الكمبيوتر	تحديد مقدار الفراغ أعلى المكون عند التصفح من جهاز الكمبيوتر.
المسافة العلوية - شاشات الجوال	تحديد مقدار الفراغ أعلى المكون عند التصفح من الجوال لضمان مظهر متناسق.
المسافة السفلية - شاشات الكمبيوتر	تحديد مقدار الفراغ أسفل المكون عند التصفح من جهاز الكمبيوتر.
المسافة السفلية - شاشات الجوال	تحديد مقدار الفراغ أسفل المكون عند التصفح من الجوال.

خيارات صورة قبل

تتحكم هذه الإعدادات في الصورة الأولى (التي تمثل الحالة الأصلية أو القديمة).

اسم الخيار	الوصف
صورة قبل	رفع الصورة الأساسية التي تمثل الحالة “قبل” لتظهر على شاشات الكمبيوتر.
صورة قبل في الجوال	رفع صورة بمقاس مختلف للحالة “قبل” لتظهر بشكل مثالي ومناسب لمقاس شاشات الجوال.
عنوان صورة قبل	الكلمة أو النص القصير الذي يظهر فوق الصورة لتوضيحها (مثال: “قبل”).
لون العنوان	لاختيار لون النص الخاص بعنوان صورة “قبل”.
موضع العنوان	لتحديد مكان ظهور الكلمة فوق الصورة (أعلى، في المنتصف، أو أسفل الصورة).

خيارات صورة بعد

تتحكم هذه الإعدادات في الصورة الثانية (التي تمثل النتيجة النهائية أو الجديدة).

اسم الخيار	الوصف
صورة بعد	رفع الصورة التي تمثل النتيجة “بعد” استخدام المنتج أو الخدمة لتظهر على شاشات الكمبيوتر.
صورة بعد في الجوال	رفع صورة بمقاس مختلف للحالة “بعد” لتظهر بشكل مثالي على الجوال.
عنوان صورة بعد	الكلمة أو النص القصير الذي يظهر فوق الصورة لتوضيحها (مثال: “بعد”).
لون العنوان	لاختيار لون النص الخاص بعنوان صورة “بعد”.
موضع العنوان	لتحديد مكان ظهور الكلمة فوق الصورة (أعلى، في المنتصف، أو أسفل الصورة).