حجم صورة المنتج في ووكومرس الذي تخطئ فيه معظم المتاجر (2026)

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

ثم يتساءلون لماذا تبدو صور المنتجات ضبابية في بعض الصفحات، ولماذا Core Web Vitals ، أو لماذا يغادر المتسوقون عبر الهاتف المحمول قبل تحميل المنتج.

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

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

يغطي هذا الدليل الأبعاد الدقيقة التي تعمل في عام 2026، وكيف يتعامل WooCommerce فعليًا مع أحجام الصور، وما يجب تحميله، وكيفية تنسيق الصور، والأدوات التي تعمل على تحسين الصور تلقائيًا حتى تتمكن من التركيز على البيع.

باختصار: حجم صورة المنتج في ووكومرس

• أفضل حجم لصورة المنتج في WooCommerce لمعظم المتاجر هو 800 × 800 بكسل لصفحات المنتجات الفردية و 600 × 600 بكسل لشبكات الكتالوج.

• قم بتحميل الصور المصدرية بحجم 1200 × 1200 بكسل كحد أدنى حتى يتمكن WooCommerce من إنشاء جميع الأحجام دون فقدان الجودة.

• يقوم WooCommerce تلقائيًا بإنشاء ثلاثة أحجام للصور: صورة المنتج الفردية، وصورة مصغرة للكتالوج، وصورة مصغرة للمعرض.

• استخدم تنسيق WebP في عام 2026. فهو أصغر بنسبة 25-35% من JPEG بنفس الجودة المرئية ويحظى بدعم 97% من المتصفحات.

• استخدم دائمًا برنامج ShortPixel لضغط الصور وإعادة إنشاء الصور المصغرة بعد تغيير إعدادات الحجم.

• تؤدي أحجام الصور غير الصحيحة إلى صور ضبابية، وأوقات تحميل بطيئة، وفشل في مؤشرات الأداء الرئيسية للويب، وخسارة في المبيعات.

كيف يتعامل ووكومرس مع أحجام الصور؟

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

فيما يلي الغرض من كل منها والوضع الافتراضي لها:

حجم الصورة	الأبعاد الافتراضية	أين يُستخدم
صورة المنتج الفردي (woocommerce_single)	عرض 600 بكسل، بدون قص	الصورة الرئيسية في صفحات المنتجات الفردية
صورة مصغرة للكتالوج (woocommerce_thumbnail)	عرض 300 بكسل، مربع مقصوص	شبكة صفحة المتجر، صفحات الفئات، نتائج البحث
صورة مصغرة للمعرض (woocommerce_gallery_thumbnail)	100 × 100 بكسل، صورة مربعة مقصوصة	صور صغيرة أسفل صورة المنتج الرئيسية لتسهيل تصفح المعرض

الأمر الأساسي الذي يجب فهمه هنا هو أن هذه الإعدادات الافتراضية متحفظة. تبدو صورة مصغرة بحجم 300 بكسل مقبولة على شاشة سطح المكتب، لكنها تبدو ضبابية بشكل ملحوظ على شاشات ريتينا الحديثة. أما صورة المنتج الواحد بحجم 600 بكسل فلا تتيح مجالًا لوظيفة التكبير عالية الجودة. لذا، تحتاج معظم المتاجر إلى تعديل هذه الإعدادات منذ البداية.

أحجام صور المنتجات الموصى بها لـ WooCommerce لعام 2026

باختصار: حمّل الصور الأصلية بحجم 1200 × 1200 بكسل أو أكبر. اضبط عرض صورة المنتج الفردية على 800 بكسل، وعرض الصورة المصغرة للكتالوج على 600 بكسل.

فيما يلي إعداد الحجم الموصى به الذي يوازن بين الجودة المرئية وسرعة تحميل الصفحة وأداء التحويل لمعظم المتاجر:

نوع الصورة	المقاس الموصى به	ملحوظات
تحميل المصدر (الأصلي)	الحد الأدنى 1200 × 1200 بكسل	يمنح WooCommerce دقة كافية لإنشاء جميع الأحجام دون فقدان الجودة
صورة صفحة المنتج الفردية	800 × 800 بكسل	حاد، جاهز للتكبير، يعمل مع جميع السمات الحديثة
صورة مصغرة للكتالوج	600 × 600 بكسل	شبكات نظيفة على أجهزة سطح المكتب والهواتف المحمولة، آمنة لشاشات ريتينا
صورة مصغرة للمعرض	150 × 150 بكسل	مرئي وواضح لتصفح المعرض

يُعدّ الشكل المربع الأنسب لمعظم المتاجر الإلكترونية، لأنّ تصميمات WooCommerce الشبكية مبنية على بطاقات منتجات متناسقة. يُضفي هذا التناسق (نسبة 1:1) في جميع صفحات متجرك الإلكتروني مظهرًا احترافيًا ومتكاملًا، مما يُعزز ثقة العملاء.

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

أحجام صور ووكومرس حسب نوع المنتج

الأحجام الموصى بها أعلاه مناسبة للمتاجر العامة. مع ذلك، تختلف متطلبات الصور بشكل كبير حسب المنتج الذي تبيعه. إليك تفصيل عملي حسب فئة المنتج.

• الملابس: توفر الصور التي يتراوح عرضها بين 800 و1000 بكسل تفاصيل كافية لإظهار نسيج القماش والخياطة والمقاس دون إنشاء ملفات كبيرة الحجم بلا داعٍ. حافظ على نسبة عرض إلى ارتفاع ثابتة في جميع صور الملابس للحفاظ على تناسق الشبكة.

• المجوهرات: الصور المقربة عالية الدقة ضرورية. تتطلب براعة صناعة الأحجار الكريمة والنقوش والأعمال المعدنية الدقيقة دقة عالية. استخدم صورًا يتراوح عرضها بين 1000 و1500 بكسل، وتأكد من أن تصميم موقعك يدعم خاصية التكبير حتى يتمكن العملاء من فحص التفاصيل.

• الإلكترونيات: تُعدّ التفاصيل التقنية بالغة الأهمية لمنتجات مثل أجهزة الكمبيوتر المحمولة والهواتف الذكية والكاميرات. يحتاج العملاء إلى قراءة الملصقات، ورؤية المنافذ، وفحص المكونات. استخدم صورًا بعرض يصل إلى 1200-1400 بكسل للحفاظ على وضوح الصورة على جميع أنواع الشاشات.

• الأثاث والديكور المنزلي: تعتمد هذه المنتجات على صور تُظهر نمط الحياة، وتُبرز الحجم والملمس والموقع في الغرفة. الصور التي تتراوح دقتها بين 1200 و1600 بكسل مناسبة. تُعدّ نسب العرض الرأسية والأفقية شائعة في هذه الفئة، لذا يُنصح بمراعاة تصميم ديكور منزلك بدلاً من فرض قصّ مربع.

• المنتجات الرقمية والبرامج: الصور الأصغر حجماً مناسبة هنا. لقطات الشاشة الواضحة والنماذج الأولية بدقة 800 × 800 بكسل كافية تماماً.

كيفية تغيير أحجام الصور في ووكومرس؟

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

الخطوة 1: انتقل إلى المظهر ⟶ تخصيص في لوحة تحكم ووردبريس الخاصة بك.

الخطوة الثانية: انتقل إلى WooCommerce ثم إلى صور المنتج.

الخطوة الثالثة: اضبط قص الصورة المصغرة وأبعادها. ستظهر لك معاينة على اليمين يتم تحديثها أثناء إجراء التغييرات. انقر على "نشر" لحفظ التغييرات.

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

الخطوة الرابعة: ثبّت إضافة "إعادة إنشاء الصور المصغرة" وشغّلها على مكتبة الوسائط الكاملة. ستعيد هذه الإضافة معالجة جميع الصور الموجودة إلى الأبعاد الجديدة. بالنسبة للمكتبات الكبيرة، تعمل هذه الإضافة في الخلفية وقد تستغرق بضع ساعات، ولكنها لا تتطلب أي تدخل منك.

ما هو تنسيق الصور الذي يجب استخدامه في عام 2026؟

باختصار: استخدم تنسيق WebP كتنسيق الصور الأساسي لديك. فهو يوفر نفس الجودة البصرية لتنسيق JPEG مع أحجام ملفات أصغر بنسبة 25-35%، ويحظى بدعم 97% من متصفحات الإنترنت العالمية اعتبارًا من عام 2026.

شهد النقاش حول تنسيقات الصور تحولاً جذرياً خلال العامين الماضيين. إليكم وضع كل تنسيق اليوم.

• WebP الخيار الأمثل لمعظم صور منتجات WooCommerce في عام 2026. يدعمه جميع المتصفحات الرئيسية، وهو مناسب للصور الفوتوغرافية، وصور المنتجات المقطوعة، والصور الشفافة.

تُنتج صيغة WebP بجودة تتراوح بين 80 و85 ملفات لا يمكن تمييزها بصريًا عن صيغة JPEG بجودة تتراوح بين 90 و95، ولكن بأحجام أصغر بكثير. إذا لم تكن تستخدم صيغة WebP في متجرك الإلكتروني، فهذا هو أهم تغيير يمكنك إجراؤه على الصور هذا العام.

• تنسيق JPEG مقبولاً لتصوير المنتجات إذا لم يتم إعداد تحويل WebP بعد، ولكنه لم يعد الخيار الأمثل. فتنسيق JPEG لا يدعم الشفافية، كما أن حجمه أكبر بكثير من حجم WebP عند نفس الجودة.

• صيغة PNG فقط عند الحاجة الفعلية للشفافية، مثل صور المنتجات على خلفيات ملونة أو الصور التي تحتوي على نصوص. ملفات PNG أكبر حجمًا بكثير من ملفات WebP وJPEG المستخدمة في الصور الفوتوغرافية. لذا، تجنب استخدام PNG لصور المنتجات العادية.

• AVIF الجيل التالي من تنسيقات WebP، ويُنتج ملفات أصغر حجمًا. يتزايد دعم المتصفحات له، ولكنه ليس شائعًا بما يكفي للاستخدام الأساسي في متاجر WooCommerce العامة. من الجدير بمتابعته، ولكنه ليس الخيار الافتراضي الموصى به لمعظم المتاجر حتى الآن.

أسهل طريقة لتحويل مكتبة الوسائط الخاصة بك في WooCommerce بالكامل إلى WebP دون إعادة تصدير كل صورة يدويًا هي استخدام ShortPixel.

يقوم البرنامج بضغط الصور على خوادمهم (دون التأثير على موارد الاستضافة الخاصة بك)، ويحولها تلقائيًا إلى صيغتي WebP وAVIF، ويقدم التنسيق المناسب لكل متصفح. يُعد وضع الضغط اللامع الخيار الأمثل لتصوير المنتجات، حيث يقلل حجم الملف بنسبة 40-60% دون أي فقدان ملحوظ في الجودة.

لماذا يؤثر حجم الصورة على ترتيب موقعك في نتائج بحث جوجل؟

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

مؤشرات الأداء الرئيسية للويب وأكبر لوحة محتوى

تستخدم جوجل هذه المقاييس لقياس تجربة تحميل الصفحة. ويُعدّ مقياس "أكبر محتوى مرئي" ، الذي يقيس سرعة تحميل المحتوى المرئي الرئيسي، هو في الغالب صورة المنتج الرئيسية في صفحة منتج WooCommerce .

تتسبب صورة رئيسية غير مُحسّنة بحجم 3 ميجابايت في فشل LCP بشكل مؤكد، مما يؤدي مباشرةً إلى انخفاض ترتيب موقعك في نتائج البحث. لذا، يُعدّ اختيار صور منتجاتك المناسبة من أهم الخطوات العملية لتحسين سرعة موقع WooCommerce وأدائه في محركات البحث.

البحث عن الصور والبيانات المنظمة

في عام 2026، تزداد أهمية أدوات البحث المرئي، بما في ذلك Google Lens والبحث المدعوم بالذكاء الاصطناعي، في مجال اكتشاف المنتجات في التجارة الإلكترونية. وتزداد احتمالية ظهور بعلامات

معظم إضافات تحسين محركات البحث ، بما في ذلك AIOSEO و Rank Math ، تتولى هذه المهمة تلقائيًا، ولكنها تحتاج إلى الإشارة إلى أعلى دقة للصورة (800 بكسل أو أكبر) بدلاً من الصورة المصغرة. تحقق من ذلك في إعدادات البيانات المنظمة بعد تغيير أبعاد الصورة.

أداء الهاتف المحمول

يتخلى 53% من مستخدمي الهواتف المحمولة عن الصفحات التي تستغرق أكثر من ثلاث ثوانٍ للتحميل. وتُعدّ صورة المنتج عادةً العنصر الأثقل في صفحة المنتج على الهاتف المحمول. وتُشكّل أحجام الصور المُحسّنة ، وتنسيق WebP، والتحميل التدريجي، مزيجًا أساسيًا للحفاظ على أداء قوي على الهواتف المحمولة.

للحصول على نظرة شاملة حول كيفية ملاءمة أداء الصور للصورة الأوسع لتحسين مواقع التجارة الإلكترونية ، يغطي دليلنا الكامل كل طبقة من الصور إلى عملية الدفع.

مشاكل الصور الشائعة في ووكومرس وكيفية حلها

فيما يلي بعض المشاكل الشائعة، وإليك كيفية حلها:

• صور المنتجات غير الواضحة: غالبًا ما يكون السبب هو تحميل صور أصغر من أبعاد WooCommerce المُحددة. إذا قمتَ بتعيين أبعاد صور المنتج الواحد إلى 800 بكسل، ولكنك حمّلتَ ملفات المصدر بحجم 400 بكسل، فسيقوم WooCommerce بتمديد الصورة، مما يؤدي إلى انخفاض جودتها. لذا، احرص دائمًا على تحميل صور المصدر بحجم 1200 بكسل على الأقل. بعد تصحيح صور المصدر، شغّل إضافة "إعادة إنشاء الصور المصغرة".

• عدم اتساق تصميم شبكة المنتجات: ينتج هذا عن تحميل صور بنسب أبعاد مختلفة في جميع منتجاتك. يؤدي مزج الصور العمودية والأفقية والمربعة إلى إنشاء شبكة منتجات غير متناسقة، ما يُظهرها بمظهر غير احترافي ويُضعف ثقة العملاء. لذا، يُنصح بتوحيد جميع صور المنتجات لتكون بنفس نسبة الأبعاد قبل التحميل، وتفعيل خاصية القصّ المُحكم في WooCommerce لضمان الاتساق.

• تبدو الصور جيدة على أجهزة الكمبيوتر المكتبية، لكنها غير واضحة على الهواتف المحمولة: عادةً ما تكون هذه مشكلة في شاشات ريتينا. تستخدم الهواتف الحديثة شاشات عالية الكثافة تتطلب صورًا بحجم ضعف أبعاد البكسل في CSS لتظهر بوضوح. لذا، اضبط حجم الصورة المصغرة في كتالوجك على 600 بكسل بدلاً من 300 بكسل لضمان وضوح الصورة على شاشات ريتينا في الأجهزة المحمولة.

• بطء تحميل صفحات صور المنتجات: تُعدّ الملفات الكبيرة غير المضغوطة السبب الأكثر شيوعًا لبطء متاجر WooCommerce. ثبّت إضافة ShortPixel، وشغّل عملية تحسين شاملة لمكتبة الوسائط، وفعّل خاصية عرض صور WebP. بالنسبة للمتاجر ذات الكتالوجات الكبيرة، يُحقق هذا التغيير وحده عادةً أكبر تحسين للأداء مقارنةً بأي عملية تحسين أخرى.

• عدم تحديث الصور بعد تغيير إعدادات الحجم: لقد قمت بتغيير الأبعاد في أداة التخصيص، ولكن الصور لا تزال تُعرض بأحجامها القديمة. هذا يعني أنه لم يتم إعادة إنشاء الصور المصغرة. شغّل إضافة "إعادة إنشاء الصور المصغرة" لإعادة معالجة جميع الصور الموجودة بالأبعاد الجديدة.

مجموعة الأدوات المناسبة لتحسين صور ووكومرس

لستَ بحاجةٍ إلى إدارة أحجام الصور وضغطها يدويًا. إضافات تحسين الصور المناسبة في ووردبريس تتولى كل شيء تلقائيًا من لحظة تحميل الصورة.

• ShortPixel ضغط الصور وتحويلها إلى صيغة WebP. استخدم وضع Glossy لتصوير المنتجات. يقوم بضغط الصور من جانب الخادم، ويدعم التحسين الشامل للمكتبات الموجودة، ويُقدّم صيغة WebP تلقائيًا للمتصفحات المدعومة. بالنسبة لمتاجر WooCommerce، ShortPixel أفضل توازن بين الجودة والتكلفة والأتمتة.

• إضافة "إعادة إنشاء الصور المصغرة" هي إضافة مجانية ستحتاجها عند تغيير أبعاد الصور في ووكومرس. ثبّتها، وشغّلها بعد كل تغيير في الحجم، وستتولى هي الباقي في الخلفية. إنها إضافة بسيطة تؤدي وظيفتها بكفاءة عالية.

• MonsterInsights متجرك بـ Google Analytics 4 ويمنحك رؤية واضحة لصفحات المنتجات التي لديها أعلى معدلات ارتداد ، مما قد يشير إلى مشاكل في أداء الصور على صفحات معينة.

خاتمة

إن ضبط أحجام صور منتجات WooCommerce ليس بالأمر المعقد، ولكنه يتطلب قرارات متعمدة بدلاً من الاعتماد على الإعدادات الافتراضية.

• قم بتحميل الصور الأصلية بدقة 1200 × 1200 بكسل أو أكبر.

• اضبط صورة المنتج الفردية على 800 بكسل وصورة الكتالوج المصغرة على 600 بكسل. استخدم تنسيق WebP.

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

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

الخلاصة: إعدادات الصور الافتراضية في ووكومرس تُعدّ نقطة انطلاق جيدة، لكنها غير مُحسّنة لشاشات ريتينا الحديثة، أو لعرض الصور بصيغة WebP، أو لبيانات الأداء الأساسية للويب. لذا، يُنصح بتعديل الأبعاد، والتحوّل إلى صيغة WebP، وضغط الصور باستخدام ShortPixel، كأدنى إعداد يجب أن يتوفر لدى أي متجر ووكومرس في عام 2026.

الأسئلة الشائعة