لا تظهر معاينة رابط واتساب؟ إصلاح وسم og:image
عدم ظهور معاينة رابط واتساب يعود دائمًا تقريبًا إلى أحد خمسة أسباب: الصفحة لا تحتوي على وسم og:image، أو عنوان الصورة غير قابل للوصول العام، أو أن الصورة ذات أبعاد خاطئة فيقوم واتساب بقصّها، أو أن القصّ سليم لكن المعاينة قديمة، أو أن إضافة تحسين محركات البحث في المتجر تطبع وسمًا منافسًا. يغطي هذا الدليل كل سبب، ولماذا لا يمكنك إجبار واتساب على التحديث، وما الذي يجب تغييره في متجر WooCommerce.
الإجابة المختصرة
يبني واتساب معاينة الرابط من وسوم Open Graph الخاصة بالصفحة. إذا كانت og:image مفقودة، أو غير قابلة للوصول، أو غير مهيأة على شكل بطاقة بمقاس 1200×630، تصل المشاركة كرابط مجرد، أو بلاطة رمادية، أو صورة منتج مقتطعة بشكل سيئ. معظم متاجر WooCommerce لا تقوم أبدًا بتعيين og:image لصفحات المنتجات من الأساس — إذ يعتمد إضافة تحسين محركات البحث على الصورة المميزة الثابتة، وعندها تُقتطع جوانب الصورة المربعة أو الطويلة أو يُقصّ أعلاها.
1. لا توجد وسمة og:image في الصفحة
هذا هو السبب الأكثر شيوعًا في المتجر. لا يصدر ووردبريس وووكومرس وسمة og:image لصفحات المنتجات أو الفئات أو المتجر افتراضيًا، والقالب الذي لا يتعامل مع Open Graph سيترك الوسمة محذوفة تمامًا.
الإصلاح: اعرض مصدر الصفحة وتأكد من وجود وسمة og:image، وأنها مطلقة (رابط https://… كامل، وليس مسارًا نسبيًا أبدًا)، وأنها مُقدَّمة من الخادم — وليست مُحقنة عبر جافاسكريبت بعد التحميل. واتساب لا يشغّل جافاسكريبت لديك.
curl -s https://your-store.com/product/example | grep -i 'og:image'
النتيجة الفارغة هي جوابك: واتساب لا يملك صورة لعرضها.
2. عنوان الصورة غير قابل للجلب بشكل عام
يزحف زاحف واتساب إلى الصورة بنفس الطريقة التي يفعلها أي عميل مجهول الهوية. الرابط الذي يتطلب تسجيل دخول، أو على localhost، أو على عنوان IP خام، أو على مسار محظور بواسطة robots.txt سيفشل.
الإصلاح: تأكد من أن الرابط يعيد صورة دون الحاجة إلى بيانات اعتماد.
curl -I https://your-store.com/wp-content/uploads/product.jpg
تحتاج إلى 200 OK وContent-Type بقيمة image/png أو image/jpeg.
فخ robots.txt. تلتزم الزواحف الاجتماعية بـ robots.txt، لذا فإن قاعدة تحظر المسار الذي يستضيف صورك تكسر المعاينة — وتكسرها بطريقة يسهل تشخيصها بشكل خاطئ. بعدها يبلغ مصحح ميتا "تعذرت معالجة الصورة. قد تكون تالفة أو ذات تنسيق غير صالح"، وهو ما يبدو تمامًا كعرض مكسور. curl لا يكرر هذا أبدًا، لأن curl يتجاهل robots.txt. إذا كانت صورك تُقدَّم من مسار تغطيه قاعدة Disallow:، فستفشل المعاينة مهما كان الملف صالحًا. واجهنا هذا بأنفسنا على مسار العرض الخاص بـ FastOG وأصلحناه بتجاوز Allow: بأطول تطابق.
3. واتساب يقصّ صورة منتجك — وتعديل الصورة لن يحل المشكلة
هذا هو العرض الذي يصفه التجار بأنه "صور منتجاتي تُقصّ على واتساب"، وهو العرض الذي يستحق الفهم الصحيح.
تقوم المنصة بقصّ أي صورة تُمرَّر إليها إلى إطار بحجم 1200×630. صورة المنتج المربعة أو الطويلة يُقصّ جانبها أو أعلاها؛ بينما تُمدَّد صورة الشعار. قصّ الصورة المصدرية يدويًا في فوتوشوب هو معركة خاسرة، لأن واتساب يحدد القصّ بناءً على نسبة أبعاد البطاقة، وليس على التكوين الذي اخترته — وصورة المنتج التالية لها شكل مختلف مرة أخرى.
الحل هو تغيير الصورة التي تقدمها، وليس الصورة التي تملكها. أرسل بطاقة مُكوَّنة مسبقًا بأبعاد 1200×630، مع وضع صورة المنتج بداخلها. عندها لن يتبقى للمنصة ما تقصّه.
4. الحجم الصحيح لصورة معاينة رابط واتساب
الحجم القياسي لصورة Open Graph هو 1200×630 بكسل — بنسبة 1.91:1 — وهو الشكل الذي تتوقعه جميع المنصات الرئيسية، بما في ذلك واتساب. إذا قدمت صورة بحجم 1200×630، فستظهر المعاينة كما هو مقصود؛ أما إذا قدمت صورة مربعة بحجم 1000×1000، فسيقوم واتساب بقصها لملء الإطار.
حافظ على حجم الملف أقل من 5 ميجابايت. عادةً ما تتراوح بطاقة نص ومنتج بحجم 1200×630 بين 200 كيلوبايت و500 كيلوبايت بصيغة PNG.
راجع حجم صورة OG: شرح 1200×630 لمعرفة سبب تحول هذه النسبة إلى المعيار.
5. المعاينة قديمة — ولا يمكنك إجبار واتساب على تحديثها
إذا كانت الوسوم وعنوان URL والبنية جميعها صحيحة وما زالت المعاينة خاطئة، فأنت تنظر إلى ذاكرة تخزين مؤقت (cache).
يقوم واتساب بتخزين المعاينة مؤقتًا. وهي محفوظة في تطبيق المستلم، مما يعني أنه لا توجد أي أداة يمكنها أن تطلب من واتساب تحديثها — لا أداة تصحيح، ولا API، ولا نحن. لا يوفر واتساب أي تحديث برمجي من أي نوع، لذلك لا يوجد زر للضغط عليه. أي شخص يدّعي خلاف ذلك يصف سلوك فيسبوك، وليس سلوك واتساب.
ما يمكنك فعله هو التأكد من أن الصورة الصحيحة جاهزة في انتظار المرة القادمة التي يقرأ فيها واتساب الصفحة. لهذا السبب تكون عناوين صور الغلاف في FastOG معتمدة على المحتوى (content-addressed): غيّر عنوان المنتج أو سعره أو صورته فيتغير عنوان URL معها، وبالتالي لا يمكن للقراءة التالية التقاط البطاقة القديمة. ومتى تحدث تلك القراءة فهو أمر يعود إلى واتساب.
منصتان مرتبطتان تتصرفان بنفس الطريقة — لينكد إن وX لا توفران أيضًا أي API للإبطال، وعادةً ما تعيدان القراءة خلال أسبوع تقريبًا. يمكن لأدوات الفحص الخاصة بهما أن تحفّز ذلك إذا كنت مستعجلًا:
| المنصة | الأداة | هل يمكنها إجبار تحديث المعاينة؟ |
|---|---|---|
| واتساب | (لا توجد) | لا — المعاينة مخزنة مؤقتًا في تطبيق المستلم |
| فيسبوك | Sharing Debugger — developers.facebook.com/tools/debug |
نعم — "Scrape Again"، وبشكل برمجي |
| لينكد إن | Post Inspector — linkedin.com/post-inspector |
يحفّز إعادة القراءة |
| X / تويتر | Card Validator — cards-dev.twitter.com/validator |
يحفّز إعادة القراءة |
استخدام أداة تصحيح فيسبوك لمشكلة في واتساب. لا يزال من المفيد لصق عنوان URL في Sharing Debugger حتى وإن كان لا يمكنه تحديث واتساب، لأنه يجلب الصفحة بنفس الطريقة التي سيجلبها بها واتساب ويُبلغ عمّا وجده فعليًا — وسوم مفقودة، صور يتعذر الوصول إليها، تنسيقات غير صحيحة. تعامل معه كأداة تحقق من الوسوم، وليس كحل لذاكرة واتساب المؤقتة.
6. إصلاح ذلك في متجر WooCommerce
في WooCommerce، تستحق سير العمل أن تُذكر بدقة، لأن نمط الفشل عادةً ما يكون إضافة تحسين محركات البحث (SEO plugin)، وليس القالب:
- الوسم غير موجود افتراضيًا. لا يوفر WooCommerce وسم
og:imageلـproductأوproduct_catأو صفحة المتجر. - إضافة تحسين محركات البحث تملأ الفجوة بشكل سيئ. ستقوم Yoast وRank Math وAll in One SEO وSEOPress بطباعة وسم
og:image— ولكن بالنسبة للمنتج، فإنها تلجأ إلى الصورة المميزة الثابتة. وهي صورة مربعة أو عمودية، وهذا بالضبط ما يقصّه WhatsApp لاحقًا. - انتبه للوسوم المكررة. إذا طبعت إضافتان وسم
og:image، فستختار المنصة واحدًا منها، وقد لا يكون هو الذي تتوقعه. اعرض مصدر الصفحة واحسب عدد وسومog:imageالتي تُصدرها الصفحة.
يسلك FastOG لـ WooCommerce مسارًا مختلفًا: فهو يعرض بطاقة 1200×630 من بيانات الكتالوج الحية (العنوان، السعر، شارة التخفيض، التقييم، صور المنتج) عبر خدمة العرض الخاصة به، ثم يسلّم تلك الصورة المصغرة إلى إضافة تحسين محركات البحث التي تستخدمها بالفعل بدلاً من طباعة وسم منافس. وبذلك تحتفظ بوسم og:image واحد في الصفحة، وهو بطاقة مصممة لإطار 1.91:1 بدلاً من صورة منتج خام.
نظرًا لأن الصور المصغرة تُرسم من بيانات الكتالوج الحية، فإن السعر على البطاقة يطابق السعر على الصفحة، ويحصل المنتج المخفَّض على شارة تخفيض. عند حفظ منتج، تطلب الإضافة أيضًا من Facebook إعادة قراءة الصفحة — وFacebook هو المنصة الوحيدة التي تتيح تحديثًا برمجيًا. أما WhatsApp وLinkedIn وX فتتبع جداولها الخاصة، وتوضح الإضافة ذلك بوضوح بدلاً من أن تعد بتحديث لا يمكنها تنفيذه.
- التثبيت: FastOG لـ WooCommerce على WordPress.org
- التفاصيل والأسئلة الشائعة: صفحة تكامل WooCommerce
تحقق مما ستراه واتساب فعليًا
قبل تغيير أي شيء، انظر إلى الصفحة كما يراها الزاحف. الصق أي رابط منتج في شاهد روابطك كما يراها المشترون — فهو يجلب الصفحة، ويقرأ وسوم Open Graph الحالية، ويعرض المعاينة الناتجة كما تظهر في واتساب وX وMessenger، بجانب غلاف FastOG المبني من نفس بيانات المنتج. لا يتطلب التسجيل.
تفضل فحص الوسوم الخام؟ استخدم مولّد وسوم Open Graph Meta لرؤية الترميز، أو راجع المرجع في صورة og:image لا تظهر؟ كيفية إصلاحها.
الأسئلة الشائعة
لماذا يتم اقتصاص صورة منتجي على واتساب؟
يقوم واتساب بقص أي صورة يتم تمريرها إليه ليتناسب مع إطار 1200×630. الصورة المربعة أو العمودية لمنتج تفقد جوانبها أو أعلاها. تقديم بطاقة مكوّنة مسبقًا بمقاس 1200×630 — مع وضع صورة المنتج داخل البطاقة — لا يترك للمنصة شيئًا لاقتصاصه.
هل يمكنني إجبار واتساب على تحديث معاينة الرابط؟
لا. لا يوفر واتساب واجهة برمجة تطبيقات (API) للتحديث أو أداة تصحيح، والمعاينة المخزنة مؤقتًا توجد في تطبيق المستلم. يمكنك فقط التأكد من أن الصورة الصحيحة جاهزة لقراءتها في المرة القادمة. فيسبوك هو الاستثناء ويوفر إعادة فحص برمجية.
لماذا يعرض Facebook Sharing Debugger صورتي، بينما لا يعرض واتساب شيئًا؟
لأنهما مخزنان مؤقتان منفصلان، ووحدة التصحيح تبلغ عن وسوم الصفحة التي يقرأها كلا المنصتين. إذا كانت وحدة التصحيح تعرض صورة صحيحة بينما لا يعرض واتساب شيئًا، فالوسوم سليمة وأنت تنظر إلى مخزن واتساب المؤقت غير المحدّث. إذا كانت وحدة التصحيح لا تعرض شيئًا أيضًا، فالوسم مفقود أو الصورة غير قابلة للوصول — تحقق من السببين 1 و2 بالترتيب.
هل يستخدم واتساب og:image أم twitter:image؟
og:image. قم بتعيين وسوم Open Graph. twitter:image مخصص لـ X.
هل أحتاج إلى إضافة (Plugin)، أم يمكنني إضافة الوسم بنفسي؟
يمكنك إضافة وسم og:image ثابت إلى قالبك بنفسك — إنه يعمل، وهو أفضل بكثير من لا شيء. ما لا يمكنه فعله هو إنتاج بطاقة مميزة لكل منتج دون إنشاء صورة يدويًا لكل منتج، وسيصبح قديمًا في كل مرة يتغير فيها السعر. عند هذه النقطة تصبح الصورة الديناميكية جديرة بالاهتمام.
موقعي ليس على FastOG. هل سيساعد هذا الأمر على أي حال؟
نعم — الأسباب الخمسة هي سلوك المنصات، وليست سلوك FastOG. تحقق منها بالترتيب باستخدام curl، ومصدر الصفحة، ووحدة التصحيح.
ذات صلة
جرّبه مجانًا — لا حاجة للتسجيل
معاينة واختبار صور OG الديناميكية في ثوانٍ.
افتح أداة اختبار OG المجانية