عندما تنسخ رابط موضوع من منتداك وترسله على واتساب، ماذا يظهر للطرف الآخر؟ في أغلب منتديات vBulletin القديمة تظهر سلسلة أحرف زرقاء لا تعني شيئًا. لا عنوان، لا صورة، لا وصف. والنتيجة أن الرابط يُتجاهل.
في هذا الموضوع أشرح إضافة صغيرة كتبتها لحل هذه المشكلة، مع ميزة ثانية تحسّن تجربة تصفح الصور داخل المواضيع.
برمجة وتطوير: WebCraker
ما الذي تفعله الإضافة
كل هذا بدون تعديل أي قالب وبدون رفع أي ملف. ملف واحد تستورده من لوحة التحكم وينتهي الأمر.
على صفحة الموضوع يُضاف استعلام واحد خفيف لجلب نص أول مشاركة، مفهرس بالمفتاح الأساسي.
واتساب وفيسبوك وتيليجرام وتويتر لا تقرأ صفحتك كما يقرأها الزائر. ترسل طلبًا سريعًا، تقرأ جزءًا من الـ
vBulletin 3.8 صدر قبل أن ينتشر هذا المعيار، فلا يضيف هذه الوسوم إطلاقًا. وبما أنها غير موجودة، تعرض التطبيقات الرابط الخام ولا شيء غيره.
ملاحظة مهمة: وسم
هذه النقطة هي الأهم في الإضافة. صورة واحدة خاطئة في
الإضافة تفحص أول مشاركة في الموضوع، تجمع كل وسوم الصور فيها، ثم تفضّل الرابط الذي ينتهي بامتداد صورة حقيقي. إن لم تجد، تقبل روابط مراكز الرفع التي تقدّم الصور مثل مراكز رفع الصور التي تضيف صورا بدون رابط مباشر للصورة. وإن خلا الموضوع من الصور كليًا، تنتقل إلى المرفقات، وأخيرًا إلى صورة افتراضية تحددها أنت من لوحة تحكم الهاك.
في المنتديات القديمة، الضغط على صورة داخل موضوع ينقلك إلى صفحة الصورة المجردة، وتفقد مكانك في القراءة وتحتاج زر الرجوع.
العارض يفتح الصور فوق الصفحة مباشرة:
للتحديث لاحقًا، نفس الخطوات مع ضبط Allow Overwrite على Yes.
شرط واحد: نظام الإضافات يجب أن يكون مفعّلًا. تجده في Settings > Options > Plugin/Hook System.
للصورة الافتراضية، المقاس الموصى به 1200×630 بحجم أقل من 300 كيلوبايت. واتساب يتجاهل الصور الأكبر من ذلك ويعرض معاينة بلا صورة.
الطريقة الشائعة في شروحات vBulletin هي فتح قالب
الحل هنا مختلف. المتغير
النتيجة: الوسوم تظهر داخل الـ
المشكلة التي تحلها الإضافة تبدو تجميلية، لكنها ليست كذلك. كل رابط يُرسل على واتساب بلا معاينة هو زائر محتمل لم يضغط. وفي منتدى نشط، هذه أرقام حقيقية.
الإضافة مجانية، والنقاش مفتوح هنا لأي سؤال أو اقتراح.
في هذا الموضوع أشرح إضافة صغيرة كتبتها لحل هذه المشكلة، مع ميزة ثانية تحسّن تجربة تصفح الصور داخل المواضيع.
برمجة وتطوير: WebCraker
التوافق
- vBulletin 3.8.x بكل إصداراته
- PHP 5.4 وحتى 8.x
- يعمل مع أي ستايل بدون تعديل
- يدعم مرفقات المنتدى ومراكز الرفع الخارجية
- لا يضيف أي استعلام على الصفحة الرئيسية أو صفحات الأقسام
ما الذي تفعله الإضافة
- وسوم Open Graph تلقائية للمواضيع والأقسام والصفحة الرئيسية، مع استخراج أول صورة في الموضوع واستخدامها في المعاينة.
- عارض صور مدمج يفتح الصورة فوق الصفحة مع تعتيم للخلفية، بدل نقل الزائر إلى صفحة أخرى.
كل هذا بدون تعديل أي قالب وبدون رفع أي ملف. ملف واحد تستورده من لوحة التحكم وينتهي الأمر.
على صفحة الموضوع يُضاف استعلام واحد خفيف لجلب نص أول مشاركة، مفهرس بالمفتاح الأساسي.
لماذا تختفي المعاينة أصلًا
واتساب وفيسبوك وتيليجرام وتويتر لا تقرأ صفحتك كما يقرأها الزائر. ترسل طلبًا سريعًا، تقرأ جزءًا من الـ
<head> فقط، وتبحث عن وسوم محددة:
HTML:
<meta property="og:title" content="عنوان الموضوع" />
<meta property="og:description" content="مقتطف من أول مشاركة" />
<meta property="og:image" content="https://example.com/image.jpg" />
<meta property="og:url" content="https://example.com/showthread.php?t=123" />vBulletin 3.8 صدر قبل أن ينتشر هذا المعيار، فلا يضيف هذه الوسوم إطلاقًا. وبما أنها غير موجودة، تعرض التطبيقات الرابط الخام ولا شيء غيره.
ملاحظة مهمة: وسم
<title> العادي لا يكفي. معظم تطبيقات المحادثة تعتمد على og:title تحديدًا، وتتجاهل العنوان التقليدي أو تستخدمه كخيار أخير.كيف تُختار صورة المعاينة
هذه النقطة هي الأهم في الإضافة. صورة واحدة خاطئة في
og:image تعني معاينة فارغة، فالترتيب مدروس:الإضافة تفحص أول مشاركة في الموضوع، تجمع كل وسوم الصور فيها، ثم تفضّل الرابط الذي ينتهي بامتداد صورة حقيقي. إن لم تجد، تقبل روابط مراكز الرفع التي تقدّم الصور مثل مراكز رفع الصور التي تضيف صورا بدون رابط مباشر للصورة. وإن خلا الموضوع من الصور كليًا، تنتقل إلى المرفقات، وأخيرًا إلى صورة افتراضية تحددها أنت من لوحة تحكم الهاك.
عارض الصور
في المنتديات القديمة، الضغط على صورة داخل موضوع ينقلك إلى صفحة الصورة المجردة، وتفقد مكانك في القراءة وتحتاج زر الرجوع.
العارض يفتح الصور فوق الصفحة مباشرة:
- تعتيم للخلفية بنسبة قابلة للتعديل
- أسهم تنقل وعدّاد تلقائي عندما يحتوي الموضوع على أكثر من صورة
- الإغلاق بزر مخصص، أو بالضغط خارج الصورة
- التنقل بأسهم لوحة المفاتيح، معكوسة لتناسب اتجاه القراءة العربي
- الضغط مع مفتاح Ctrl يفتح الصورة في تبويب جديد كالمعتاد
التركيب
- من لوحة التحكم: Plugins & Products ثم Manage Products
- اضغط Add/Import Product
- ارفع ملف الإضافة واضغط Import
للتحديث لاحقًا، نفس الخطوات مع ضبط Allow Overwrite على Yes.
شرط واحد: نظام الإضافات يجب أن يكون مفعّلًا. تجده في Settings > Options > Plugin/Hook System.
الإعدادات
| الخيار | الوظيفة |
|---|---|
| تفعيل وسوم Open Graph | مفتاح عام لتشغيل الوسوم أو إيقافها |
| الصورة الافتراضية | رابط الصورة المستخدمة عند خلو الموضوع من أي صورة |
| تفعيل عارض الصور | مفتاح عام للعارض |
| نسبة تعتيم الخلفية | من 10 إلى 100، والافتراضي 72 |
للصورة الافتراضية، المقاس الموصى به 1200×630 بحجم أقل من 300 كيلوبايت. واتساب يتجاهل الصور الأكبر من ذلك ويعرض معاينة بلا صورة.
لماذا بدون تعديل قوالب
الطريقة الشائعة في شروحات vBulletin هي فتح قالب
headinclude ولصق الوسوم فيه. تعمل، لكن لها ثلاث مشاكل: تضيع مع أي ترقية، وتحتاج تكرارها في كل ستايل، وتُنسى عند تركيب ستايل جديد.الحل هنا مختلف. المتغير
$headinclude يبقى موجودًا في الذاكرة عند تنفيذ الـ hook، وقالب SHOWTHREAD يُعرض بعده:
PHP:
// داخل hook باسم showthread_complete
$headinclude .= $meta_tags;النتيجة: الوسوم تظهر داخل الـ
<head> تمامًا كما لو كانت في القالب، لكنها تعمل مع كل الستايلات.حل المشاكل الشائعة
الكاش عنيد جدًا وقد يستمر أيامًا. جرّب برابط موضوع لم ترسله من قبل.
لتفريغ الكاش، استخدم أداة فيسبوك للمطورين (واتساب يستخدم نفس الـ scraper):
ضع الرابط واضغط Scrape Again.
لتفريغ الكاش، استخدم أداة فيسبوك للمطورين (واتساب يستخدم نفس الـ scraper):
كود:
https://developers.facebook.com/tools/debug/غالبًا أحد سببين:
حجم الصورة: أكبر من 300 كيلوبايت تقريبًا. الحل إنشاء نسخة مصغرة واستخدامها.
حجم الصورة: أكبر من 300 كيلوبايت تقريبًا. الحل إنشاء نسخة مصغرة واستخدامها.
العارض يعمل على الصور التي يكون رابطها هو الصورة نفسها. إن كانت الصورة في المشاركة غير محاطة برابط أصلًا، فلا يوجد ما يُربط به.
الحل يكون بتوحيد صيغة الصور في قاعدة البيانات، وهو موضوع منفصل.
الحل يكون بتوحيد صيغة الصور في قاعدة البيانات، وهو موضوع منفصل.
خلاصة
المشكلة التي تحلها الإضافة تبدو تجميلية، لكنها ليست كذلك. كل رابط يُرسل على واتساب بلا معاينة هو زائر محتمل لم يضغط. وفي منتدى نشط، هذه أرقام حقيقية.
الإضافة مجانية، والنقاش مفتوح هنا لأي سؤال أو اقتراح.
![Elementor Pro | WordPress Websites Builder [Premium]](/forums/data/resource_icons/0/21.jpg?1672686748){kind=icon}
