ما هي صورة OpenGraph

صور OpenGraph هي صور تستخدم لعلامات OpenGraph، والتي يتم عرضها في معاينات تويتر وفيسبوك وOpen Graph.

يمكن أن تكون صور OpenGraph ثابتة أو ديناميكية. يعتمد ذلك على ما إذا كانت يتم إنشاؤها باستخدام مولد OpenGraph أو أدوات أخرى.

الصور التي يتم إنشاؤها باستخدام مولد OpenGraph عادة ما تكون ثابتة لأنها يتم إنشاؤها بناءً على البيانات الوصفية التي تقدمها، والتي عادة ما تكون ثابتة. على سبيل المثال، إذا قدمت بيانات وصفية لمنشور مدونة، فسيقوم مولد OpenGraph بإنشاء صورة OpenGraph ثابتة بناءً على تلك البيانات الوصفية.

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

إنشاء صور OpenGraph باستخدام الأدوات

كود HTML لـ OpenGraph

<meta property="og:url" content="https://example.com/article">
<meta property="og:title" content="عنوان المقال الخاص بي">
<meta property="og:description" content="هذا هو وصف المقال الخاص بي">
<meta property="og:type" content="article">
<meta property="og:image" content="https://example.com/og-image.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:type" content="image/png">
<meta property="og:image:alt" content="OpenGraph">

باستخدام كود HTML هذا، ستعرض الصفحة الصورة https://example.com/og-image.png في OpenGraph.

تأثيرات المعاينة

بعد إنشاء صورة OG، توفر العديد من المواقع أدوات معاينة وتصحيح عبر الإنترنت لمساعدتك في تشخيص المشكلات. فيما يلي بعض الأدوات الشائعة:

الموقعالرابط
فيسبوكhttps://developers.facebook.com/tools/debug/
لينكد إنhttps://www.linkedin.com/post-inspector/
ديسكوردhttps://discord.com/developers/embeds