إنتقل إلى المحتوى الرئيسي

ميزات اختيار الصورة

حقول اختيار الصورة تتيح لعملائك الاختيار من مجموعة صور — مثالية لخيارات مثل تسريحات الشعر، ألوان البشرة، الإكسسوارات، وأنماط الملابس. كل خيار يظهر كصورة في الودجت، مما يمنح العميل تجربة بصرية واضحة.

متى تستخدم اختيار الصورة​

السيناريومثال من كوراسا
خيارات بصرية متعددةتسريحة الشعر — ١٠+ تسريحات مختلفة
أشكال وأنماطشكل النظارة — عدة أشكال مختلفة
إكسسواراتالإكسسوارات — خواتم، أقراط، قلادات
ألوان البشرةلون البشرة — فاتح، قمحي، داكن
خلفياتخلفية الصورة — عدة خلفيات مختلفة

إنشاء خيارات الصورة​

إضافة خيار جديد​

  1. في المفتش (بعد تحديد حقل اختيار صورة)، اذهب إلى قسم الخيارات
  2. اضغط على "+ إضافة خيار"
  3. اكتب اسم الخيار (مثلاً: شعر طويل)
  4. ارفع صورة الخيار — ستظهر هذه الصورة في الودجت لتمثل هذا الخيار
  5. كرر العملية لكل خيار

📸 Screenshot Needed

Dashboard Section: استوديو المنتجات > المفتش > قسم الخيارات > إضافة خيار UI State: قسم الخيارات في المفتش مع ٣ خيارات مضافة مسبقًا. زر "+ إضافة خيار" في الأسفل. خيار جديد قيد الإضافة مع حقل الاسم ومربع رفع الصورة. What to Capture: قسم الخيارات مع إظهار عملية إضافة خيار جديد. RTL Note: المفتش RTL. أسماء الخيارات عربية. Size: 400×500px

ترتيب الخيارات​

  1. اسحب أي خيار باستخدام مقبض السحب (⋮⋮) على يمينه
  2. أو استخدم أزرار السهم لأعلى/لأسفل

الترتيب الذي تضبطه هنا هو ما سيراه العميل في الودجت.

حذف خيار​

  1. اضغط على أيقونة الحذف (🗑) بجانب الخيار
  2. أكد الحذف

⚠️ تنبيه: حذف خيار قد يؤثر على قواعد الظهور والأهداف الديناميكية المرتبطة به.

رفع وإدارة الصور​

رفع صورة لخيار​

  1. اضغط على مربع الصورة في الخيار
  2. سيظهر منتقى الأصول (Asset Picker) — متصفح مكتبة الصور
  3. اختر "رفع جديد" لرفع صورة من جهازك
  4. أو اختر صورة موجودة من المكتبة

📸 Screenshot Needed

Dashboard Section: استوديو المنتجات > منتقى الأصول (Asset Picker) UI State: نافذة منتقى الأصول مع علامتي تبويب: "المكتبة" و"رفع جديد". تبويب المكتبة يعرض صورًا مرفوعة مسبقًا. شريط بحث في الأعلى. What to Capture: منتقى الأصول كامل مع الصور المصغرة وخيار الرفع. RTL Note: النافذة RTL. Size: 600×500px

نصائح للصور​

  • الحجم الموصى به: ٢٠٠×٢٠٠ بكسل للصور المصغرة
  • التنسيق: PNG أو JPG أو WebP
  • الخلفية الشفافة: يفضل PNG للصور التي تحتاج دمجًا مع خلفيات مختلفة
  • التناسق: استخدم صورًا بنفس الأبعاد والنمط لجميع الخيارات في الحقل الواحد

أوضاع العرض (Display Modes)​

كيف تظهر خيارات الصورة للعميل في الودجت:

الوضعالشكلمناسب لـ
صور مصغرة (Thumbnails)شبكة من الصور المصغرة٣-١٠ خيارات — الأكثر استخدامًا
أزرار (Buttons)أزرار نصيةخيارات قليلة (٢-٤) بنصوص واضحة
قائمة منسدلة (Dropdown)قائمة منسدلة٥+ خيارات لتوفير المساحة

📸 Screenshot Needed

Dashboard Section: استوديو المنتجات > المفتش > وضع العرض > قائمة منسدلة UI State: قائمة منسدلة لاختيار وضع العرض: "صور مصغرة"، "أزرار"، "قائمة منسدلة". "صور مصغرة" محدد. What to Capture: قائمة أوضاع العرض. RTL Note: RTL. Size: 400×100px

وضع الصور المصغرة (الافتراضي)​

  • الخيارات تظهر في شبكة — صفان أو ثلاثة
  • كل خيار: صورة + اسم أسفلها
  • الخيار المحدد يظهر بإطار ملون

وضع الأزرار​

  • الخيارات تظهر كأزرار نصية أفقية
  • مناسبة للخيارات القليلة (٢-٤)
  • لا تظهر الصور — الأسماء فقط

وضع القائمة المنسدلة​

  • جميع الخيارات في قائمة منسدلة
  • توفير للمساحة — مثالية للجوال
  • لا تظهر الصور في القائمة نفسها

تعيين خيار افتراضي​

  1. في قسم الخيارات، حدد الخيار الذي تريده افتراضيًا
  2. فعّل مفتاح "افتراضي" (Default)
  3. سيظهر وسام "افتراضي" على الخيار

عندما يفتح العميل صفحة المنتج، سيكون هذا الخيار محددًا مسبقًا.

📸 Screenshot Needed

Dashboard Section: استوديو المنتجات > المفتش > خيار افتراضي UI State: أحد الخيارات في القائمة يظهر مع وسام "افتراضي" أزرق/بنفسجي. مفتاح "افتراضي" في وضع التشغيل. What to Capture: الخيار الافتراضي مع الوسام في قائمة الخيارات. RTL Note: RTL. Size: 400×150px

مجموعات الصور (Image Sets)​

مجموعات الصور تتيح لك تنظيم صور الخيارات في مجموعات قابلة لإعادة الاستخدام.

  • إنشاء مجموعة: احفظ خيارات الحقل كمجموعة صور
  • استخدام مجموعة: رابط المجموعة بحقل آخر — أي تحديث للمجموعة ينعكس على جميع الحقول المرتبطة
  • فصل المجموعة: حول الرابط إلى نسخة مستقلة

للمزيد: مكتبات الأصول القابلة لإعادة الاستخدام

ميزات متقدمة​

⚠️ قريبًا — الميزات التالية قيد التطوير

الميزةالوصفالحالة
تدرج رمادي (Grayscale)عرض الصور بتدرج رمادي حتى يختارها العميلقريبًا
فلاتر (Filters)تطبيق فلاتر بصرية على الصورقريبًا
بيانات القص (Crop Metadata)تحديد منطقة القص لكل صورةقريبًا
نسبة الأبعاد (Aspect Ratio)توحيد نسبة أبعاد جميع الصورقريبًا
خرائط الأصول (Asset Maps)صور مختلفة لنفس الخيار في طبقات مختلفةقريبًا

أمثلة من كوراسا​

مثال: حقل "تسريحة الشعر"​

  • النوع: اختيار صورة
  • التسمية: تسريحة الشعر
  • وضع العرض: صور مصغرة
  • عدد الخيارات: ١٢ تسريحة (شعر طويل، قصير، مموج...)
  • مطلوب: نعم
  • افتراضي: أول تسريحة في القائمة

مثال: حقل "لون البشرة"​

  • النوع: اختيار صورة
  • التسمية: لون البشرة
  • وضع العرض: أزرار
  • عدد الخيارات: ٣ (فاتح، قمحي، داكن)
  • مطلوب: نعم
  • افتراضي: قمحي

مقالات ذات صلة​

آخر تحديث: 2026-05-17

آخر تحديث في