مولد وسوم الميتا — Open Graph وبطاقات X

مولد وسوم الميتا للبحث ومشاركة الروابط على الشبكات الاجتماعية مع معاينات تقريبية

تعمل في متصفحك · لا يُرفع أي شيء

توجد قيم مثال جاهزة. استبدلها ببيانات صفحتك.

العنوان (title وog:title)

الوصف (meta description وog:description)

رابط الصفحة (canonical وog:url)

استخدم العنوان الكامل الذي يبدأ بـ https:// (أو http://).

رابط الصورة (og:image)

العنوان الكامل للصورة التي تظهر عند مشاركة الرابط. تحمّل المعاينة الصورة مباشرة من هذا العنوان.

وصف الصورة (og:image:alt)

اسم الموقع (og:site_name)

نوع الصفحة (og:type)

اللغة (og:locale)

نوع بطاقة X (تويتر)

حساب X (twitter:site، اختياري)

مع @ أو بدونها. اتركه فارغًا لتخطي الوسم.

تضمين وسمي charset وviewport

الوسوم المُنشأة

من دون صورة لن تظهر أي صورة في معاينات KakaoTalk وFacebook.
تم اختيار بطاقة الصورة الكبيرة لكن لا توجد صورة.

<title>عداد الحروف — عدّ الكلمات والحروف</title>
<meta name="description" content="الصق نصك لتعرف فورًا عدد الحروف مع المسافات وبدونها وعدد الكلمات والبايتات.">
<link rel="canonical" href="https://www.example.com/ar/character-counter/">

<meta property="og:type" content="website">
<meta property="og:title" content="عداد الحروف — عدّ الكلمات والحروف">
<meta property="og:description" content="الصق نصك لتعرف فورًا عدد الحروف مع المسافات وبدونها وعدد الكلمات والبايتات.">
<meta property="og:url" content="https://www.example.com/ar/character-counter/">
<meta property="og:site_name" content="موقع المثال">
<meta property="og:locale" content="ar_AR">

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="عداد الحروف — عدّ الكلمات والحروف">
<meta name="twitter:description" content="الصق نصك لتعرف فورًا عدد الحروف مع المسافات وبدونها وعدد الكلمات والبايتات.">

الصقها داخل <head> في ملف HTML.

المعاينات (تقريبية)

معاينة رابط في KakaoTalk

لا توجد صورة

عداد الحروف — عدّ الكلمات والحروف

الصق نصك لتعرف فورًا عدد الحروف مع المسافات وبدونها وعدد الكلمات والبايتات.

example.com

نتيجة بحث Google

موقع المثال

https://www.example.com/ar/character-counter/

عداد الحروف — عدّ الكلمات والحروف

الصق نصك لتعرف فورًا عدد الحروف مع المسافات وبدونها وعدد الكلمات والبايتات.

هذه معاينات تقريبية للتطبيقات الحقيقية، لذلك قد تختلف الأطوال ومواضع القطع. افحص عرض العنوان والوصف في Google بأداة معاينة نتائج البحث (SERP). وقد يحتفظ KakaoTalk بمعاينة الرابط الذي رآه من قبل لفترة، فقد تظهر معاينة قديمة بعد تغيير الوسوم.

تتبع أسماء الوسوم بروتوكول Open Graph (ogp.me) وبطاقات X (تويتر). تقرأ تطبيقات KakaoTalk وFacebook وLinkedIn وSlack الوسوم og:title وog:description وog:image وog:url، ويقرأ X الوسم twitter:card ويمكنه الرجوع إلى وسوم og: للباقي. تُهرَّب علامات الاقتباس و< و> و& في نصك لتناسب HTML. لا يُخزَّن ولا يُرسل أي شيء تكتبه.

ما هذه الأداة؟

يكتب مولد وسوم الميتا هذا وسوم head التي تتحكم في شكل الصفحة في نتائج البحث وعند مشاركة رابطها. تبني تطبيقات المراسلة والشبكات الاجتماعية بطاقات الروابط من وسوم Open Graph، ويضيف X وسوم البطاقات الخاصة به. املأ نموذجًا قصيرًا واحصل على HTML تلصقه مباشرة في head صفحتك، مع معالجة علامات الاقتباس عنك، ومعاينات تقريبية لبطاقة رابط في KakaoTalk ونتيجة في Google.

طريقة الاستخدام

أدخل العنوان والوصف ورابط الصفحة. توجد قيم مثال جاهزة للبدء.
أضف الرابط الكامل لصورة المشاركة ووصفًا قصيرًا لها. ومن دون صورة يذكّرك تحذير بأن بطاقات المشاركة ستظهر بلا صورة.
اختر اسم الموقع ونوع الصفحة واللغة ونوع بطاقة X. وحساب X اختياري.
أصلح أي شيء مُدرج تحت الوسوم المُنشأة، مثل الروابط النسبية أو العنوان الفارغ.
انسخ الوسوم إلى head صفحتك.
راجع المعاينات التقريبية لتكوين فكرة عامة عن النتيجة.

كيف تعمل؟

تتبع أسماء الوسوم بروتوكول Open Graph (ogp.me): og:type وog:title وog:description وog:url وog:site_name وog:locale وog:image وog:image:alt، إضافة إلى وسوم بطاقات X: twitter:card وtwitter:site وtwitter:title وtwitter:description وtwitter:image.
يُستخدم رابط الصفحة لكل من رابط canonical ووسم og:url.
تُهرَّب علامات الاقتباس و< و> و& ككيانات HTML، وتُدمج الأسطر الجديدة والمسافات المتكررة في مسافة واحدة، ولا تُنتج الحقول الفارغة أي وسم.
لا يُقبل حساب X إلا إذا كان من 1 إلى 15 حرفًا لاتينيًا أو رقمًا أو شرطة سفلية.
المعاينات تقريبية، فالتطبيقات الحقيقية تستخدم خطوطها وقواعد القطع الخاصة بها.

أمثلة

المدخل	الوسم المُنشأ
العنوان: عداد الحروف	`<title>عداد الحروف</title>` وog:title وtwitter:title
وصف فيه “علامات اقتباس”	`content="وصف فيه "علامات اقتباس""`
حساب X: toolsnack	`<meta name="twitter:site" content="@toolsnack">`
الصورة /og.png	تحذير: استخدم عنوانًا كاملًا يبدأ بـ https://

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

ما الوسوم التي تستخدمها معاينات الروابط؟

تقرأ تطبيقات مثل Facebook وLinkedIn وSlack وKakaoTalk الوسوم og:title وog:description وog:image وog:url. أما X فيقرأ twitter:card أولًا ويمكنه الرجوع إلى وسوم og: للعنوان والوصف والصورة.

لماذا لا تظهر صورتي في المعاينة؟

يجب أن يكون og:image عنوانًا كاملًا يبدأ بـ https://. فالمسارات النسبية مثل /og.png تتجاهلها معظم برامج الزحف، ويجب أن تكون الصورة متاحة للعموم.

غيّرت الوسوم لكن المعاينة القديمة ما زالت تظهر.

قد تحتفظ بعض التطبيقات بمعاينة الرابط الذي رأته من قبل لفترة من الوقت. تتحدث المعاينة مع الوقت، ويمكن عبر أدوات المطورين في هذه المنصات أن تطلب منها قراءة الصفحة من جديد.

كم يجب أن يكون طول العنوان والوصف؟

تقتطع Google المقتطفات بحسب العرض لا بحسب عدد الحروف. استخدم أداة معاينة نتائج البحث (SERP) لترى بالضبط أين سيُقطع عنوانك ووصفك.

هل تُخزَّن مدخلاتي؟

لا. تُبنى الوسوم والمعاينات داخل متصفحك. وإذا أدخلت رابط صورة فإن متصفحك يحمّل تلك الصورة مباشرة لعرض المعاينة.