Skip to content

مولّد وسوم Open Graph وميتا

أنشئ وسوم Open Graph وبطاقات Twitter ووسوم SEO مع معاينة حية على Google وFacebook وX. مجانية 100% وداخل المتصفح، بدون تسجيل — انسخ الكود والصقه.

بدون تتبّع يعمل في المتصفّح مجاني
كل شيء يعمل داخل متصفحك. لا يغادر محتواك ورابط الصورة هذه الصفحة أبدًا — لا رفع ولا تسجيل.
SEO أساسي
Open Graph (Facebook، LinkedIn…)
بطاقة X (Twitter)
متقدّم والأيقونات
الفحوص
    وسوم <head> المولّدة
     
    الاستيراد من <head> موجود (يُحلَّل محليًا، لا يُرفع شيء)
    تحقق بعد النشر: Facebook LinkedIn Google Rich Results
    جرى التحقق من مخرجات الوسوم ومواصفات المنصّات مقابل بروتوكول Open Graph (ogp.me) وGoogle Search Central ووثائق المشاركة الحالية لـFacebook وX وLinkedIn وDiscord. — Go Tools Team · Jul 15, 2026

    ما وسوم ميتا وOpen Graph؟

    وسوم ميتا هي مقتطفات HTML في <head> صفحتك تصف الصفحة للمتصفحات ومحركات البحث والمنصّات الاجتماعية. وسوم SEO الكلاسيكية هي <title> ووصف ميتا ورابط canonical. أما وسوم Open Graph (og:title وog:type وog:image وog:url وما شابهها) فهي بروتوكول، أصله من Facebook، يتحكم في العنوان والوصف والصورة الظاهرة عند مشاركة رابطك — وتقرؤها كل منصّة تقريبًا، بما فيها LinkedIn وSlack وDiscord وWhatsApp وPinterest وTelegram.

    يستخدم Twitter/X وسوم twitter:card الخاصة به لكنه يرجع إلى وسوم Open Graph عند غيابها، فمجموعة جيدة من وسوم OG إضافةً إلى قيمة twitter:card واحدة تغطّي كل شبكة. يكتب هذا المولّد كل هذه الوسوم، ويضيف بيانات JSON-LD المُهيكلة الاختيارية، ويعاين النتيجة حيًا — فلا تضطر أبدًا إلى كتابتها يدويًا أو تخمين شكل المشاركة.

    مواصفات الصور والوسوم حسب المنصّة

    Open Graph (Facebook وLinkedIn)

    يقرأ كلاهما og:title وog:description وog:image وog:url. الصورة الموصى بها 1200×630 (1.91:1). يخزّن Facebook مؤقتًا نحو 30 يومًا وLinkedIn نحو 7 أيام — أعِد الاستخراج عبر أداتَي التصحيح لديهما بعد النشر.

    بطاقة X (Twitter)

    twitter:card مطلوب (summary_large_image أو summary). يرجع X إلى og:* في البقية. تعمل صورة 1200×630 واحدة لكلٍّ من OG وX؛ والصور دون 300×157 تُخفّض البطاقة الكبيرة إلى صغيرة.

    Slack وDiscord

    يقرأ Slack بطاقة Twitter ثم Open Graph ويمكنه عرض حقلين إضافيين عبر twitter:label/data. ويقرأ Discord وسوم Open Graph ويستخدم على نحو فريد theme-color لشريط لون التضمين.

    WhatsApp وTelegram

    يحتاج WhatsApp إلى og:title وog:image مع وضع البيانات الوصفية قرب أعلى HTML؛ ويقرأ Telegram وسوم Open Graph ويصيّر بموثوقية من صور JPEG أو PNG فقط.

    Pinterest Rich Pins

    يقرأ Pinterest وسوم Open Graph أو Schema.org. يحتاج Article Rich Pin إلى og:type=article إضافةً إلى article:published_time وarticle:author — وكلها تُولَّد هنا عند اختيار النوع article.

    مقتطف بحث Google

    تقيس معاينة SERP الحية للحاسوب والجوال عنوانك ووصفك بالبكسل — لا بعدد الأحرف فقط — فترى خطر الاقتطاع قبل Google.

    أمثلة على وسوم ميتا

    الصفحة الرئيسية لموقع ويب

    Title: Acme — Ship faster
    Description: The all-in-one platform for modern teams.
    URL: https://acme.com
    Image: https://acme.com/og/home.png (1200×630)
    <title>Acme — Ship faster</title>
    <meta name="description" content="The all-in-one platform for modern teams.">
    <link rel="canonical" href="https://acme.com">
    
    <meta property="og:title" content="Acme — Ship faster">
    <meta property="og:type" content="website">
    <meta property="og:image" content="https://acme.com/og/home.png">
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="630">
    <meta property="og:url" content="https://acme.com">
    
    <meta name="twitter:card" content="summary_large_image">

    لا تحتاج الصفحة الرئيسية سوى وسوم Open Graph الأربعة المطلوبة إضافةً إلى عنوان ووصف ورابط canonical. ولأن أبعاد الصورة 1200×630، يُملأ العرض والارتفاع تلقائيًا، فتظهر أول مشاركة على Facebook فورًا بدل أن تكون فارغة.

    مقالة مدوّنة (مع article:* + JSON-LD)

    og:type: article
    Title: The Complete Guide to Open Graph Tags
    Author: Ada Lovelace
    Published: 2026-07-15
    <meta property="og:title" content="The Complete Guide to Open Graph Tags">
    <meta property="og:type" content="article">
    <meta property="og:image" content="https://blog.example.com/og/guide.png">
    <meta property="og:url" content="https://blog.example.com/open-graph-guide">
    <meta property="article:published_time" content="2026-07-15T00:00:00Z">
    <meta property="article:author" content="Ada Lovelace">
    
    <meta name="twitter:card" content="summary_large_image">
    
    <script type="application/ld+json">{ "@type": "Article", "headline": "The Complete Guide to Open Graph Tags", "datePublished": "2026-07-15T00:00:00Z" }</script>

    اختيار النوع article يفتح خاصيتَي article:published_time وarticle:author ويولّد بيانات Article JSON-LD مطابقة، فتحصل محركات البحث وPinterest Rich Pins على بيانات مُهيكلة مجانًا.

    ‏Twitter/X يرث Open Graph

    twitter:card: summary_large_image
    Inherit title/description/image from OG: on
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:site" content="@acme">

    يقرأ X وسوم Open Graph لديك عند غياب وسم twitter:* المطابق، لذا تحتاج فقط إلى twitter:card. ولا يُصدر المولّد أبدًا وسم twitter:image فارغًا، وهو ما قد يُعطّل ذلك الرجوع الاحتياطي.

    كيف تضيف وسوم Open Graph إلى موقعك

    1. 1

      أدخل العنوان والوصف والرابط

      اكتب عنوان صفحتك ووصف ميتا ورابط canonical. يُظهر مقياس البكسل ما إذا كانت تتّسع في مقتطف بحث Google.

    2. 2

      أضِف og:image واختر النوع

      الصق رابط صورة 1200×630 واختر website أو article أو product أو profile — فتظهر حقول Open Graph المطابقة وJSON-LD تلقائيًا.

    3. 3

      تحقق من المعاينات الحية

      بدّل بين تبويبات Google وFacebook وX وLinkedIn وSlack وDiscord لترى بالضبط كيف سيبدو رابطك قبل نشره.

    4. 4

      انسخ داخل

      انسخ كتلة الوسوم الكاملة (أو قسمًا واحدًا) والصقها داخل <head> صفحة HTML لديك. تحقّق بعد النشر عبر أداتَي تصحيح Facebook وLinkedIn.

    أخطاء Open Graph الشائعة

    مسار og:image نسبي

    مسار مثل /cover.png يعمل في محررك لكنه فارغ عند المشاركة، لأن الزواحف تحتاج إلى رابط مطلق.

    ✗ خطأ
    <meta property="og:image" content="/cover.png">
    ✓ صحيح
    <meta property="og:image" content="https://example.com/cover.png">

    غياب og:url

    بدون og:url canonical، تنقسم أعداد المشاركات عبر صيَغ URL مختلفة وقد تختار المنصّات العنوان الخطأ.

    ✗ خطأ
    <!-- no og:url -->
    ✓ صحيح
    <meta property="og:url" content="https://example.com/page">

    صورة صغيرة جدًا أو بنسبة خاطئة

    يتجاهل Facebook الصور دون 200×200 ويقصّ أي صورة بعيدة عن 1.91:1.

    ✗ خطأ
    600×600 og:image
    ✓ صحيح
    1200×630 og:image (1.91:1)

    نسيان twitter:card

    حتى مع وسوم Open Graph الكاملة، لا يصيّر X أي بطاقة ما لم يُضبط twitter:card.

    ✗ خطأ
    <!-- OG only, no twitter:card -->
    ✓ صحيح
    <meta name="twitter:card" content="summary_large_image">

    twitter:image فارغ يُعطّل الرجوع الاحتياطي

    twitter:image الفارغ يمنع X من الرجوع إلى og:image — احذف الوسم بدل تركه فارغًا.

    ✗ خطأ
    <meta name="twitter:image" content="">
    ✓ صحيح
    <!-- omit it; X uses og:image -->

    وضع charset متأخرًا جدًا

    يجب أن يظهر إعلان charset ضمن أول 1024 بايت من المستند وإلا جرى تجاهله.

    ✗ خطأ
    <meta charset> after many tags
    ✓ صحيح
    <meta charset="utf-8"> first in <head>

    حالات استخدام شائعة

    إطلاق صفحة هبوط
    ولّد كتلة head الكاملة لصفحة تسويقية جديدة كي تبدو أنيقة لحظة مشاركة أحدهم الرابطَ على X أو LinkedIn أو Slack.
    معاينات المدوّنات والمقالات
    أضِف article:published_time وarticle:author وArticle JSON-LD كي تتأهّل المنشورات لـPinterest Rich Pins وبطاقات اجتماعية غنية.
    إصلاح مشاركة معطّلة
    استورد وسومك الحالية، والتقط og:image المفقودة أو البُعد الخطأ في لوحة الفحوص، وأصلحها، ثم أعِد الاستخراج عبر روابط أداة التصحيح.
    مقتطفات head لأطر العمل
    انسخ مجموعة وسوم نظيفة وصحيحة لإدراجها في موقع ثابت أو قالب CMS أو جزء head مُصيَّر على الخادم.

    كيف يعمل المولّد

    معاينة حية داخل المتصفح
    تُصيَّر كل بطاقة من القيم التي تكتبها، لا بجلب رابطك أبدًا. وهذا يبقي المعاينات فورية وخاصة، وهو الطريقة الصادقة الوحيدة للمعاينة قبل نشر الصفحة.
    مقياس SERP دقيق بالبكسل
    يقتطع Google العناوين والأوصاف حسب عرض البكسل، لا عدد الأحرف. يقيس canvas نصك بالخط نفسه، فيتحوّل المقياس إلى الكهرماني تمامًا حين يُقتطع المقتطف.
    فحص الصور على جانب العميل
    يُحمَّل رابط og:image في كائن Image داخل متصفحك لقراءة عرضه وارتفاعه الحقيقيين، ثم يُقارَن بـ1200×630 ونسبة عرض البطاقة إلى ارتفاعها. وما زالت الصور عبر أصل مختلف (cross-origin) تُبلّغ عن حجمها، فيعمل الفحص دون أي رفع.
    مجموعة وسوم كاملة وحديثة
    SEO أساسي وOpen Graph وTwitter Card وJSON-LD في كتلة واحدة، مع إصدار charset أولًا كي يقع ضمن أول 1024 بايت. والوسوم القديمة مثل meta keywords معطّلة افتراضيًا.

    أفضل ممارسات وسوم ميتا

    استخدم روابط HTTPS مطلقة
    يجب أن يكون og:image وog:url روابط https://… كاملة. المسارات النسبية تعمل محليًا لكنها تظهر فارغة حين يجلب الزاحف الصفحةَ الحية.
    اضبط دائمًا og:image:width وheight
    يتيح إعلان الأبعاد للمنصّات ترتيب البطاقة فورًا، فلا تكون أول مشاركة فارغة أثناء جلبها الصورة على نحو غير متزامن.
    أبقِ canonical وog:url متطابقين
    وجِّه كليهما إلى الرابط canonical الواحد كي لا تنقسم أعداد المشاركات وإشارات البحث عبر صيَغ مختلفة من URL.
    اكتب ضمن ميزانية البكسل
    استهدف عنوانًا نحو 50–60 حرفًا ووصفًا نحو 155 — لكن ثِق بمقياس البكسل، لأن Google يقيس العرض لا عدد الأحرف.
    صيّر الوسوم على الخادم
    زواحف Facebook وLinkedIn وWhatsApp وTelegram وDiscord لا تُشغّل JavaScript، لذا يجب أن تكون وسوم Open Graph في HTML الثابت أو المُصيَّر على الخادم.

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

    ما هو مولّد وسوم ميتا؟
    يبني مولّد وسوم ميتا وسوم HTML التي توضع داخل <head> صفحتك — <title> ووصف ميتا ورابط canonical ووسوم Open Graph لـFacebook وLinkedIn ووسوم Twitter/X Card. تولّد هذه الأداة جميعها دفعةً واحدة، وتُظهر معاينة حية لشكل رابطك على Google وFacebook وX وLinkedIn وSlack وDiscord، وتتيح لك نسخ الكود بنقرة واحدة. كل شيء يعمل داخل متصفحك.
    كيف أضيف وسوم Open Graph إلى موقعي؟
    املأ العنوان والوصف ورابط canonical ورابط og:image، واختر نوع Open Graph، ثم انسخ الوسوم المولّدة والصقها داخل <head> صفحة HTML لديك. ولأن زواحف Facebook وLinkedIn وWhatsApp وTelegram لا تُشغّل JavaScript، يجب أن تكون الوسوم موجودة في HTML المُصيَّر على الخادم أو الثابت، لا مُحقَنة عبر سكربتات تعمل على جانب العميل.
    ما الحجم المناسب لصورة Open Graph؟
    الحجم الموصى به لصورة og:image هو 1200×630 بكسل بنسبة عرض إلى ارتفاع 1.91:1، وهو ما يلبّي أيضًا بطاقة summary_large_image في X. يتجاهل Facebook الصور الأصغر من 200×200 ويعرض مربعًا صغيرًا لأي صورة دون 600×315. أدرِج دائمًا og:image:width وog:image:height كي تظهر أول مشاركة فورًا، وقدِّم الصورة عبر HTTPS من رابط عام غير محظور بواسطة robots.txt.
    هل وسم twitter:card مطلوب؟
    نعم — twitter:card هو الوسم الوحيد من Twitter/X الذي يجب تضمينه، وإلا فلن يعرض X بطاقة حتى مع وجود وسوم Open Graph لديك. اضبطه على summary_large_image لصورة كبيرة أو summary لمصغّرة مربعة صغيرة. أما البقية (العنوان والوصف والصورة) فيرجع فيها X إلى وسوم og:*، لذا تتركها هذه الأداة خارج المخرجات افتراضيًا للحفاظ على نظافة الترميز.
    هل تساعد وسوم ميتا في تحسين محركات البحث؟
    يهمّ وسما <title> وcanonical لتحسين محركات البحث؛ أما وصف ميتا فليس عامل ترتيب مباشرًا لكنه يؤثّر في نسبة النقر عبر تشكيل مقتطف البحث. ولا تؤثّر وسوم Open Graph وTwitter Card في ترتيب Google، لكنها تتحكم في شكل روابطك عند مشاركتها، وهو ما يقود حركة المرور الاجتماعية. وقد يعيد Google كتابة عنوانك في النتائج، لذا اكتب عنوانًا واضحًا فريدًا واجعل الكلمات المهمة في المقدمة.
    هل ترفع هذه الأداة محتواي أو صوري؟
    لا. كل شيء يُولَّد محليًا داخل متصفحك باستخدام JavaScript. لا يغادر عنوانك ووصفك ورابط الصورة الصفحةَ أبدًا — لا خادم ولا رفع ولا حساب. تُحمَّل og:image فقط داخل متصفحك أنت لمعاينتها وقراءة أبعادها.
    هل يمكنني استيراد وسوم ميتا موجودة لديّ؟
    نعم. افتح لوحة الاستيراد، والصق وسوم <meta> الموجودة لديك، فتحلّلها الأداة محليًا بمحلّل HTML الخاص بالمتصفح لتعبئة النموذج — دون أي طلب شبكي ودون رفع أي شيء. إنه البديل الذي يضع الخصوصية أولًا مقارنةً بالأدوات التي تجلب رابطًا حيًا من خادمها.
    لماذا لا تزال المعاينة المحدَّثة تُظهر الصورة القديمة على Facebook أو LinkedIn؟
    تخزّن المنصّات بيانات Open Graph مؤقتًا: Facebook نحو 30 يومًا وLinkedIn نحو 7 أيام. بعد النشر، أعِد استخراج الصفحة عبر Facebook Sharing Debugger أو LinkedIn Post Inspector لتحديث العنوان والوصف والصورة المخزّنة مؤقتًا. وروابط أدوات التصحيح مدرجة أسفل الكود المولّد.

    أدوات ذات صلة

    عرض جميع الأدوات →

    منشئ أوامر cURL وبنّاؤها

    الويب وAPI

    ابنِ أوامر curl في متصفحك — حدد الطريقة والترويسات والمصادقة والجسم، واحصل على أمر جاهز للنسخ فوراً. إعدادات مسبقة لـ Bearer وPOST JSON ورفع الملفات. مجاني وخاص وبلا تسجيل.

    مولّد htpasswdbcrypt وحماية الويب

    الويب وAPI

    أنشئ مدخلات htpasswd بـ bcrypt وApache MD5 (apr1) وSHA-1 والمزيد. احصل على إعداد Apache وnginx وDocker جاهز للصق. 100% في متصفحك — بدون رفع.

    محوّل الأنظمة العددية — ثنائي وست عشري وعشري وثماني

    أدوات التحويل

    حوّل بين الأنظمة الثنائية والست عشرية والعشرية والثمانية وأي أساس من 2 إلى 36 فوراً — أداة مجانية أونلاين تعمل في متصفّحك. جرّبها الآن.

    محوّل Base64 — ترميز وفك ترميز أونلاين

    الترميز والتنسيق

    رمّز وفك ترميز Base64 مجاناً أونلاين — محوّل فوري مع دعم UTF-8 والرموز التعبيرية. خصوصية 100% — يعمل في متصفّحك. جرّبه الآن.

    محوّل Base64 إلى صورة أونلاين

    الترميز والتنسيق

    فك ترميز سلسلة Base64 أو عنوان URI للبيانات إلى صورة داخل متصفّحك. عاين واقرأ الأبعاد ونوع MIME ثم نزّل كـ PNG أو JPG أو GIF أو SVG. بلا رفع.

    مولّد تجزئة bcrypt والتحقق منها

    أدوات الأمن

    ولّد تجزئات كلمات المرور بـ bcrypt وتحقق منها أونلاين — تكلفة قابلة للضبط، بادئات $2b$/$2a$/$2y$. 100% في متصفحك؛ كلمة مرورك لا تُرفع أبداً.