المحتوى عن 'أبعاد الصور'.



مزيد من الخيارات

  • ابحث بالكلمات المفتاحية

    أضف وسومًا وافصل بينها بفواصل ","
  • ابحث باسم الكاتب

نوع المُحتوى


التصنيفات

  • التخطيط وسير العمل
  • التمويل
  • فريق العمل
  • دراسة حالات
  • نصائح وإرشادات
  • التعامل مع العملاء
  • التعهيد الخارجي
  • التجارة الإلكترونية
  • الإدارة والقيادة
  • مقالات ريادة أعمال عامة

التصنيفات

  • PHP
    • Laravel
    • ووردبريس
  • جافاسكريبت
    • Node.js
    • jQuery
    • AngularJS
    • Cordova
  • HTML
    • HTML5
  • CSS
  • SQL
  • سي شارب #C
    • منصة Xamarin
  • بايثون
    • Flask
    • Django
  • لغة روبي
    • Sass
    • إطار عمل Bootstrap
    • إطار العمل Ruby on Rails
  • لغة Go
  • لغة جافا
  • لغة Kotlin
  • برمجة أندرويد
  • لغة Swift
  • لغة R
  • لغة TypeScript
  • ASP.NET
    • ASP.NET Core
  • سير العمل
    • Git
  • صناعة الألعاب
    • Unity3D
  • مقالات برمجة عامة

التصنيفات

  • تجربة المستخدم
  • الرسوميات
    • إنكسكيب
    • أدوبي إليستريتور
    • كوريل درو
  • التصميم الجرافيكي
    • أدوبي فوتوشوب
    • أدوبي إن ديزاين
    • جيمب
  • التصميم ثلاثي الأبعاد
    • 3Ds Max
    • Blender
  • نصائح وإرشادات
  • مقالات تصميم عامة

التصنيفات

  • خواديم
    • الويب HTTP
    • قواعد البيانات
    • البريد الإلكتروني
    • DNS
    • Samba
  • الحوسبة السّحابية
    • Docker
  • إدارة الإعدادات والنّشر
    • Chef
    • Puppet
    • Ansible
  • لينكس
  • FreeBSD
  • حماية
    • الجدران النارية
    • VPN
    • SSH
  • مقالات DevOps عامة

التصنيفات

  • التسويق بالأداء
    • أدوات تحليل الزوار
  • تهيئة محركات البحث SEO
  • الشبكات الاجتماعية
  • التسويق بالبريد الالكتروني
  • التسويق الضمني
  • التسويق بالرسائل النصية القصيرة
  • استسراع النمو
  • المبيعات
  • تجارب ونصائح

التصنيفات

  • إدارة مالية
  • الإنتاجية
  • تجارب
  • مشاريع جانبية
  • التعامل مع العملاء
  • الحفاظ على الصحة
  • التسويق الذاتي
  • مقالات عمل حر عامة

التصنيفات

  • الإنتاجية وسير العمل
    • مايكروسوفت أوفيس
    • ليبر أوفيس
    • جوجل درايف
    • شيربوينت
    • Evernote
    • Trello
  • تطبيقات الويب
    • ووردبريس
    • ماجنتو
  • أندرويد
  • iOS
  • macOS
  • ويندوز

التصنيفات

  • شهادات سيسكو
    • CCNA
  • شهادات مايكروسوفت
  • شهادات Amazon Web Services
  • شهادات ريدهات
    • RHCSA
  • شهادات CompTIA
  • مقالات عامة

أسئلة وأجوبة

  • الأقسام
    • أسئلة ريادة الأعمال
    • أسئلة العمل الحر
    • أسئلة التسويق والمبيعات
    • أسئلة البرمجة
    • أسئلة التصميم
    • أسئلة DevOps
    • أسئلة البرامج والتطبيقات
    • أسئلة الشهادات المتخصصة

التصنيفات

  • ريادة الأعمال
  • العمل الحر
  • التسويق والمبيعات
  • البرمجة
  • التصميم
  • DevOps

تمّ العثور على 1 نتيجة

  1. من الأمور التي يجب أن تعرفها حول أبعاد الصور في WooCommerce هي أنّ CSS الافتراضي لـ WooCommerce والعديد من القوالب تحدّد أبعاد صور المنتجات لضمان اتساق التخطيط عبر الأجهزة المختلفة. تؤثر الأبعاد التي تحددها في صفحة إعدادات المنتجات في WooCommerce (راجع درس ضبط إعدادات المنتجات) على حجم الصور الذي يستخدمه القالب عند عرض صور المنتج. حيث لا تغيّر القوالب الحجم الذي تُعرض به الصور، وذلك يمكن أن يؤدي إلى تشويه الصورة وتمويهها عندما تكون إعداداتك غير كافية (أي صغيرة جدًا بالنسبة للحجم الذي يستخدمه القالب لعرض الصور). ألقِ نظرة على المخطط أدناه لمزيد من التوضيح: معالجة تشوه الصور سنقوم بمعالجة مشكلة تشوّه افتراضية كوسيلة للتوضيح. قبل أن تبدأ، تأكد من أن تكون أحجام الصور التي ترفعها كبيرة كفاية. يمكنك استخدام حجم 800 × 800 فما فوق، فهو يصلح لأغلب القوالب. أنواع الصور تستخدم المصطلحات الثلاثة التالية لتصنيف الصور على WooCommerce: Single Product Image: وهي صورة المنتج ذات الحجم الأكبر والتي تُعرض على صفحة تفاصيل المنتج. Catalog Images: وهي الصور ذات الحجم المتوسط التي تُستخدم في قوائم المنتجات المختلفة. مثل الفئات categories، المنتجات ذات الصلة related products، منتجات الارتقاء بالصفقة up-sells، منتجات البيع المتقاطع cross-sells، إلخ. Product Thumbnails: وهي الصور ذات الحجم الأصغر التي تستخدم في معارض المنتج مثل صفحة تفاصيل المنتج (تحت الصورة المميزة للمنتج) ، في السلة، وعلى الودجات. يمكنك تحديد أبعاد هذه الصور بالذهاب إلى: WooCommerce > Settings > Products > Display تعرف على حجم عرض الصور على قالبك يحدد القالب الذي اخترته الحجم الذي تُعرض به الصور عليه، لذلك يجب أن تعرف الأبعاد التي يستخدمها القالب لعرض الصور. صورة الكتالوج Catalog Image حدد المكان الذي يعرض فيه القالب صور الكتالوج بأكبر حجم. في أغلب الحالات يكون هذا المكان هو الصفحة الرئيسية للمتجر؛ لكن قد يختلف المكان في بعض القوالب. على سبيل المثال تُعرض صور الكتالوج بأكبر حجمها في منطقة قائمة المنتجات ذات الصلة related products في قالب Twenty Eleven. ولتحديد الحجم الذي يستخدمه القالب لعرض صور الكتالوج، انقر بزر الفأرة الأيمن على الصورة واختر Inspect إذا كنت تستخدم متصفح Chrome. يمكنك القيام بذلك أيضًا على متصفح Firefox. ستجد أبعاد الصورة ضمن المعلومات التي ستظهر في قسم Element. قم بتسجيل الأبعاد لكي تستخدمها لاحقا. في قالب Storefront الموضح أعلاه (وهو قالب WooCommerce الافتراضي)، أكبر صورة كتالوج تُعرض بحجم 213 × 213 بكسل. الصورة المميزة للمنتج Single Product Image كرر نفس الخطوات أعلاه على صورة المنتج المميزة؛ وهي الصورة الكبيرة التي تُعرض على صفحة تفاصيل المنتج. في قالب Storefront، أكبر صورة منتج تعرض بحجم 298 × 298 بكسل. الصور المصغرة للمنتج Product Thumbnail وهي على الأرجح الصور الأصغر في معرض صور المنتج. كرر نفس الخطوات المذكورة سابقًا لمعرفة أبعادها. في قالب Storefront تُعرض هذه الصور بحجم 43× 43 بكسل. إدخال الأبعاد وتجديد الصور الآن بعد أن أصبحت جميع أبعاد الصور التي تُستخدم في قالبك معلومة، بإمكانك إدخال الأبعاد الجديدة لتتأكد من أن الصور التي ستقوم بإضافتها لاحقًا ستكون بهذا الحجم أو أكبر. اذهب إلى: WooCommerce > Settings > Products > Display وتأكّد من أنّ الحد الأقصى للصور المذكورة مساو للأبعاد التي يعرضها قالبك لهذه الصور، أو أكبر منها. بعد ذلك قم بحفظ التغييرات بالنقر على Save Changes. بذلك عندما تقوم برفع صور جديدة للمنتج ستكون بهذه الأبعاد المحددة في الإعدادات، وستظهر بدون تشوه. ملاحظة: عند تغيير أبعاد الصور في الإعدادات وحفظ التغييرات لا يتم تحديث جميع صور المنتجات التي تم رفعها سابقًا. إذ يحتاج ووردبريس إلى تجديد الصور لتحديث الصور القديمة. بإمكانك استخدام ملحق Regenerate Thumbnails الذي يتيح لك إمكانية تجديد الصور القديمة بعد تغيير أبعادها في الإعدادات. دعم شاشة Retina تحتوي شاشات HiDPI ضعف عدد البكسلات الذي تحتويه الشاشة الاعتيادية. ولعرض الصور بشكل مثالي على شاشات Retina، قم بتعيين إبعاد الصور بضعف الحجم الذي يعرضه القالب الذي تستخدمه. فإذا كان القالب يعرض الصورة بحجم 80 × 80، قم باستخدام الأبعاد 160 × 160. لكن يجب أن تأخذ في الاعتبار أنّ ذلك يؤثر على الأداء، لأن الصور كبيرة الحجم تستغرق وقتًا أطول للتحميل. لذلك فإنّ استخدام ضعف الحجم راجع إلى تفضيلك الشخصي، ويجب أن تقوم بإجراء تحليل لزيارات متجرك قبل اتخاذ القرار. ترجمة -وبتصرّف- للدرس Using appropriate image dimensions to avoid distortion / pixellation.