هل أحتاج إلى علامات OG وعلامات Twitter؟

من الناحية التقنية لا — تعود معظم المنصات إلى علامات og إذا كانت علامات twitter مفقودة. لكن تويتر / X لن يعرض الصورة الكبيرة دون تعيين twitter:card إلى summary_large_image، لذا أضفها بالفعل.

ما حجم الصورة الذي يجب استخدامه لـ og:image؟

1200×630px هو التوصية القياسية. يتطلب سلاك على الأقل 600px عرضًا لعرض أي صورة. أقل من 200×200px وغالبًا ما يتجاهلها المنصات بالكامل.

أيقوناتي صحيحة لكن المعاينة لا تزال مُعطلة. ماذا أفعل الآن؟

تُخزن منصات OG بقوة. استخدم مُدقق فيسبوك (developers.facebook.com/tools/debug) أو مُدقق مشاركة لينكدإن لفرض تصفح جديد. بالنسبة لسلاك، أضف معلمة استعلام لتفادي رابط التخزين.

هل يمكنني تعيين علامات OG المختلفة لكل صفحة في تطبيق صفحة واحدة؟

نعم، لكنه يتطلب توليد المحتوى من جانب الخادم أو خدمة توليد مسبق. لا يتم انتقال التغييرات المكتوبة في JavaScript على العناصر المُتَّسِقة من قبل معظم مُستكشفات الويب — فهي تُستَرَّح المحتوى البدائي قبل تشغيل JavaScript.

لا تحب الإعلانات؟ يذهب خالية من الإعلانات اليوم 

علامات Open Graph إيقاف تظهر روابطك بشكل مروع على Slack

تحديث في 15 مايو 2026

قضيت أسابيع في بناء التطبيق. يظهر ملخص الرابط في Slack باسم "غير مُعرف" مع أيقونة مُتضررة. هذا مشكلة Open Graph. إليك كيفية إصلاحها خلال 10 دقائق.

علامات Open Graph: توقف عن تظهر روابطك بشكل سيء في سلوك 1

إعلان · حذف؟

قضيت ثلاث أسابيع في بناء التطبيق. يظهر ملخص الرابط في سلوك بـ "غير مُسمى" وصورة للشعار الموجود في الأسفل. هذا مشكلة في Open Graph، وتستغرق حوالي 10 دقائق لحلها.

ما هي علامات Open Graph؟

Open Graph (og:) هو بروتوكول أُطلق في عام 2010 من قبل فيسبوك، ويستخدمه الآن كل منصة رئيسية لبناء ملخصات الروابط. عندما يُوسع سلوك، تويتر، لينكدإن أو أي مُرسل رسائل، فإنها تُستخرج الصفحة، وتبحث عن <meta> علامات بـ og: الذي يُستخدم لبناء البطاقة.

لا توجد علامات → يُفترض. غالبًا ما تكون الافتراضات خاطئة.

العلامات التي تهم حقًا

العلامة	مطلوب؟	ما تفعله
`og:title`	نعم	العنوان المُعرض في بطاقة المُلخص
`og:description`	نعم	النص المُلخص / المُلخص (احتفظ بسعة أقل من 200 حرف)
`og:image`	نعم	الصورة المُعرضة في المُلخص. يجب أن تكون عنوانًا مطلقًا.
`og:url`	نعم	الرابط المُعياري للصفحة
`og:type`	مُوصى به	استخدم `website` لأغلب الصفحات، `article` للمقالات
`twitter:card`	مُوصى به	يتحكم في حجم بطاقة تويتر / إكس. استخدم `summary_large_image`.
`twitter:title`	خياري	يُستخدم كمُستبدل `og:title` على معظم المُستخدمين
`twitter:description`	خياري	يُستخدم كمُستبدل `og:description`
`twitter:image`	خياري	يُستخدم كمُستبدل `og:image`

التي تُسبب أسوأ مشكلة هي og:image. يجب أن يكون عنوانًا مطلقًا (بدون مسارات مُستقلة)، مثاليًا بحجم 1200×630 بكسل، وسعة أقل من 8 ميغابايت. سيتجاهل سلوك صور لا تُلبي متطلباته الخاصة بالحجم. اجعل الصورة على الأقل 600 بكسل عرضًا، وإلا فلن تظهر الصورة.

مجموعة كاملة من علامات OG

أضفها إلى <head> من صفحةك. استبدل القيم المُستخدمة كمُستبد:

<!-- Primary Open Graph tags -->
<meta property="og:title" content="Your Page Title Here" />
<meta property="og:description" content="A clear, specific description under 200 characters. No fluff." />
<meta property="og:image" content="https://yourdomain.com/images/og-image.png" />
<meta property="og:url" content="https://yourdomain.com/your-page" />
<meta property="og:type" content="website" />

<!-- Twitter/X card (falls back to og: tags if omitted) -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="Your Page Title Here" />
<meta name="twitter:description" content="A clear, specific description under 200 characters." />
<meta name="twitter:image" content="https://yourdomain.com/images/og-image.png" />

للمقالات أو المقالات، تغيّر og:type ل article وأضف مُؤلفك وموعد النشر:

<meta property="og:type" content="article" />
<meta property="article:author" content="https://yourdomain.com/about" />
<meta property="article:published_time" content="2026-04-25T00:00:00Z" />

كيفية التحقق من علاماتك دون نشرها

الطريقة السريعة: ضع رابطك في IO Tools Open Graph Checker. يُستخرج الصفحة، ويُحلل العلامات، ويعرض لك ما سيراه سلوك (أو أي منصة أخرى) — بما في ذلك مُلخص للعرض المُتوقع. لا حاجة للتسجيل، ولا حاجة لتنزيل توسعة.

إذا كنت ترغب في التحقق من رابط محلي أو بيئة تجريبية غير متاحة علائياً، فلن يتمكن المُدقق من الوصول إليها. في هذه الحالة، افتح المصدر على الصفحة وتحقق يدويًا من وجود العلامات في <head>. بعد النشر، أعد تشغيل المُدقق لتأكيد أن النسخة الحية تتطابق.

مُدقق مخصص للمنصات (عند الحاجة لتعطيل التخزين المؤقت):

فيسبوك/ميتا: developers.facebook.com/tools/debug — أيضًا يُمسح تخزين فيسبوك للعلامات الخاصة بك
لينكدإن: linkedin.com/post-inspector — مفيد عند تجديد المُلخص بعد التحديث
تويتر/إكس: cards-dev.twitter.com/validator — أبطأ في التحديث لكنه مفيد لتأكيد تنسيق البطاقة

سلوك يخزن بقوة. إذا قمت بتعديل العلامات وظهرت الصورة القديمة، يمكنك إجبار إعادة التحميل عن طريق إضافة سلسلة استعلام (مثلاً: ?v=2) إلى الرابط قبل مشاركته — ليس مثاليًا للروابط الإنتاجية، لكنه مقبول للتحقق من الميزات.

إنشاء العلامات

إذا كنت ترغب في إنشاء مجموعة كاملة من العلامات التفاعلية بدلًا من كتابتها يدويًا، فإن IO Tools HTML Meta Tag Generator تغطي علامات OG، بطاقات تويتر، وعلامات معيارية في نفس الوقت. نسخ الناتج إلى <head>.

أخطاء شائعة يجب تجنبها

روابط الصور المُستقلة. /images/og.png لا تعمل. تُستخرج علامات OG من خادم خارجي لا يملك سياقًا للرابط الأساسي. يجب دائمًا استخدام المسار الكامل. https:// المسار.
استخدام نفس الصورة لكل شيء. مثلاً، استخدام صورة بحجم 300×300 كصورة OG سيظهر تقنيًا كصورة صغيرة وغريبة. اصنع صورة بحجم 1200×630 لكل صفحة رئيسية.
إهمال og:url. بدونها، يستخدم بعض المنصات الرابط الذي استخرجته، بينما تُصنع بعضها بذاتها. يجب تعيينها بشكل صريح.
إهمال إلغاء التخزين المؤقت. تُخزن معظم المنصات علامات OG لمدة 24 إلى 72 ساعة. إذا قمت بتعديل العلامات على صفحة حية، استخدم المدققين المذكورين أعلاه لإجبار التحميل الجديد.
الخلط بين property و name الخصائص. تستخدم علامات OG property=. تستخدم علامات تويتر name=. الخلط بينهما يُسبب بعض المُحللين إهمال العلامة بالكامل.

علامات Open Graph هي واحدة من تلك الأمور التي تستغرق 5 دقائق لإضافتها وتصبح مُحرجة عند غيابها. قم بإصلاحها مرة واحدة، وتحقق باستخدام مدقق Open Graph، ثم انتقل.