شروحات: إظهار صورة وملخص روابط مدونة بلوجر على تويتر Twitter Card

إظهار صورة وملخص روابط مدونة بلوجر على تويتر Twitter Card

مرحبا عزيزي الزائر في موقعنا شروحات Twitter إظهار صورة وملخص روابط مدونة بلوجر على تويتر Twitter Card| دورة بلوجر

حاليًا ، تحظى الشبكة الاجتماعية بشعبية كبيرة لجميع الأشخاص في جميع أنحاء العالم مثل Facebook أو Twitter وما إلى ذلك. 

معظم الأشخاص المسجلون معهم وينشرون كل شيء يرغبون في مشاركته. 

بالأمس القريب كنا قد شرحنا كيف انشاء حساب التويتر على الهاتف أندرويد يعد Twitter أيضًا أحد وسائل التواصل الاجتماعي الشائعة .

التي يمكن للجميع من خلالها قراءة بعض النصوص أو الصور أو الفيديو أو المقالات.

أحد واجهات برمجة التطبيقات الاجتماعية المفضلة لدي هو Open Graph API الذي اعتمده Facebook. إن إضافة علامات META .

سبق لنا أن تطرقنا الى كيفية نشر روابط مواضيع موقعك او مدونتك على التويتر بدون حظر.

› كيفية انشاء حساب تويتر بدون رقم هاتف 

تقديم عام :

قليلة فقط إلى كل صفحة قد سمحت بتصميم روابط لمقالاتي وعرضها بالطريقة التي أردتها ، مما يمنحني بعض التحكم في كيفية عرض المحتوى الخاص بي على Facebook.

 تسمح واجهة برمجة تطبيقات Twitter الجديدة الخاصة بـ Twitter بنفس الفكرة: إضافة علامات META إلى صفحاتك للسماح للرابطات الخاصة بموقعك أن تكون أكثر إفادة عندما تويت. 

يستغرق تطبيق علامات Twitter Card META على موقعك خمس دقائق ، والتقدم بطلب للحصول على موافقة Twitter يستغرق خمس دقائق أخرى.

ومن هذه النقطة إلى الأمام ، يتم تقديم المحتوى الخاص بك بشكل أكثر احترافية. هيا بنا نبدأ!

عندما يختار المستخدمون مشاركة هذه الروابط ، يتم تكليفه بمطور الويب للتأكد من أن صفحات الويب المرتبطة بها قد تم إعدادها بشكل صحيح ، وهو ما سننظر إليه الآن.

يعد Facebook و Twitter ، إلى حد بعيد ، أكثر منصات الوسائط الاجتماعية شيوعًا ، لذلك دعونا نركز على هذين المنصبين.

› كيفية إعداد علامات رؤوس مخصصة للروبوتات في Blogger

1. هل تعرف أن ما هي بطاقة تويتر؟

يقدم معظم الأشخاص تعريفًا لبطاقة Twitter أو علامة Meta Tag الخاصة ببطاقة Twitter هي ميزة أو علامة meta للوسائط الاجتماعية للشبكة الاجتماعية مثل Twitter

 التي سمحت للمدون بأن يصبح كائنًا غنيًا في الرسم البياني الاجتماعي. يعني ذلك أنه عندما يشارك الأشخاص الصور والنصوص من المدون إلى Twitter.

فإنهم سيشاركون مع صورة كبيرة مثل تغريداتهم على Twitter مباشرةً. في هذا المقال ، سأتحدث عن كيفية إضافة بطاقة تويتر على المدون لمشاركتها مع صورة كبيرة.

› شرح إضافة ميتا تاج Open Graph لمدونات البلوجر

2. شرح استخدام Twitter cards لتحسين النشر وزيادة الزوار

سبق أن تطرقنا في حلقة سابقة كيفية إضافة اكواد الميتا تاج Meta Tag Blogger لنشر السليم في مواقع تواصل الاجتماعي بدون حظر يعد كذالك .

سبق ان قمنا بشرح إضافة ميتا تاج Open Graph لمدونات البلوجر للنشر السليم روابط مواضيع بلوجرعلى فيس بوك لا شك .

ان نشر روابط مواضيع موقعك او مدونتك على مواقع التواصل الإجتماعي يقوي الروابط الخارجية نحو موقعك.ويكسبك زوارا جدد يوميا واهتماما من محركات البحث.

ومن بين هذه المواقع الإجتماعية والتي تحتوي على قاعدة جماهرية كبيرة وتشكل مصدرا للزوار المستهذفين موقع تويتر. يكفي.

ان تعلم أن تويتر يحتوي على اكثر من 300 مليون مشترك من مختلف دول العالم، ويمكنك إستهداف قاعدة جماهرية كبيرة للترويج لموقعك بإستخدام احدث الهاشتاقات او الترندات.

 لكن معظم أصحاب مدونات بلوجر يعانون من مشكل عدم ظهور الروابط بشكل سليم على تويتر، حيث لا تظهر الصورة + الشرح + الرابط عكس موقع الفايسبوك

- في عام 2012 ، أدخل Twitter نظامًا يطلق عليه  Twitter Cards .

والذي يسمح لأصحاب المواقع بعرض التغريدات المعززة على مواقعهم على الويب باستخدام بناء جملة يشبه إلى حد بعيد نظام Open Graph API.

 بفضل هذا النظام الجديد ، يمكن لـ Twitter عرض التغريدات الأكثر جمالًا ، بما في ذلك تلك التي تحتوي على وسائط مثل الصور والصوت والفيديو.

› كيف تمكنت من فك حظر Facebook Url

3. كيفية استخدام بطاقات تويت

لنفترض أن زائر مدونتك قد قام بتغريد منشور مدونتك من خلال حساب تويتر الخاص به ، والآن سيتم عرض حساب تويتر الخاص بك 

أيضًا على أنه إسناد إلى جانب عنوان ووصف مدونتك. علاوة على ذلك. فإن أفضل جزء من بطاقة Twitter هو أنها ستقوم بكل هذه الأشياء السحرية تلقائيًا. بالنسبة إلى العرض التوضيحي المباشر .

أقوم بتضمين تغريدة من منشور مدونة مدون تصف الأشياء بشكل أكثر وضوحًا: 

وفقًا لذلك ، يجب أن يضطر مالك المدونة إلى إضافة علامات وصف ميتا Meta Tagعلى تويتر تسمى بطاقات تويتر لعرض العنوان والوصف والوسائط الغنية (الصور) مع حساب تويتر للناشر.

لكن العديد من مالكي المدونات لم يطبقوا أو يضيفوا بطاقات تويتر بشكل خاطئ في مدوناتهم.

هذا العرض يعتمد تماماً على الدرس السابق: إضافة ميتا تاج open graph لمدونات البلوجر للنشر السليم على فيس بوك ، وستعلم قريباً السبب !

› أهم العوامل والأسباب التي تحتم عليك توفرعلى حساب التويتر في الوقت الراهن

4. ماهي بطاقات تويتر Twitter Cards ؟

ببساطة تويتر كارد تتيح نشر محتوى غني rich content بالصور والفيديو وذلك على شكل بطاقة بارزة ترفق أسفل التغريدات ، وهذا حتماً سيؤدي إلى تدفق زوار إلى موقعك .

 ولتفعيل البطاقات يتوجب إضافة أكوادMeta Tag بسيطة لربط موقعك بحسابك في تويتر.

5. كيف يعمل؟ علامات الترميز

بالنسبة لهذه المقالة ، سأقوم بتجميع بطاقة Twitter لصفحة Chow-Bryant الرئيسية. هذا يعني أنني سأستخدم بطاقة الملخص الأساسية. 

كما نوقش أعلاه ، فإن المقتطف المنسق مثل بطاقة Twitter هو مجرد مجموعة من العلامات. تحتوي بطاقة الملخص على العلامات التالية:

- twitter: card - تشير هذه العلامة الوصفية إلى نوع البطاقة.
- twitter:site - اسم الموقع أو حساب تويتر
- twitter:title  - عنوان المقالة أو الصفحة ، يقتصر على 70 حرفًا
- twitter:description  - وصف المقالة أو صفحة الويب ، يقتصر على 200 حرف
- twitter:image - صورة 280 بكسل × 150 بكسل
- twitter: image: alt - وصف بسيط للصفات الأساسية للصورة لتقديم معلومات لضعاف البصر

› طريقة اضافة مواقع التواصل الاجتماعى للمدونة

6. كيفية إنشاء موجز بطاقة تويتر

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

يقدم تويتر أربعة خيارات للاختيار من بينها:

1. بطاقة الملخص الأساسية : Summary  تتضمن العنوان والوصف وإسناد إدارة Twitter وصورة 120 × 120 بكسل.
2. بطاقة التلخيص ذات الصورة المصغرة الكبيرة : Summary Card with Large تشبه بطاقة التلخيص الأساسية

إلا أنها تتميز بصورة كبيرة مستطيلة. ملاحظة: يجب أن تكون الصور الموجودة على هذه البطاقة بعرض 280 بكسل على الأقل و 150 بكسل بارتفاع.

3. بطاقة التطبيق:App بطاقة مشاركة تطبيق جوال. يمكن أن تحتوي هذه البطاقة أيضًا على رابط تنزيل مباشر.
4. بطاقة المشغل: Player  تقوم هذه البطاقة تلقائيًا بتضمين مشغل وسائط للفيديو والصوت والوسائط الأخرى.

› اليك أفضل 6 نصائح تساعدك في زيادة التفاعل على تويتر

7. تنفيذ بطاقات تويتر

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

 يمكن أن يصبح هذا بسرعة مهمة غير عملية لمدونة ، لذلك قمنا ببناء ميزة تنشئ علامات التعريف المناسبة لك.

الخطوة 1: أوصي بضرورة عمل نسخة احتياطية من القالب الحالي

لتجنب فقد النموذج ، قبل البدء في إضافة بطاقة Twitter أو العلامة الوصفية لبطاقة Twitter ، أوصي بضرورة عمل نسخة احتياطية من القالب الحالي.

 أولاً لأنه في حالة حدوث شيء خاطئ ، يمكنك استعادته مرة أخرى من النسخة الاحتياطية.

- الرجاء تسجيل الدخول إلى ملف المدون الخاص بك أولاً

- يرجى النقر على موضوع في يدك اليسرى

- يرجى النقر على زر Backup / Restore في اليد اليمنى 

وانقر فوق Download theme. سيتم تنزيل القالب الخاص بك إلى جهاز الكمبيوتر الخاص بك أو الجهاز.

الخطوة 2: يرجى الانتقال إلى قائمة "السمة" في الجانب الأيسر ثم انقر على "تحرير HTML"

الخطوة 3: سترى مربع HTML ، يرجى النقر فوق Ctrl + F للعثور على كلمة "</head>"

الخطوة 4: تحتاج إلى نسخ الكود أدناه والماضي بين <head> ... .. </head>...

- يرجى ملاحظة ما يلي: الرجاء تعديل  على الملف

الخطوة 5: بعد الانتهاء من التعديل ، يرجى النقر على زر "حفظ السمة".

الخطوة 6: في الخطوة 5 مكتملة. كيفية الإضافة إلى بطاقة twitter أو علامة meta tag الخاصة ببطاقة Twitter على المدون ولكن تأكد من صحة التهيئة أو لا ، يرجى اختبار التهيئة باستخدام عنوان URL آخر.

- تحتاج إلى اختبار التكوين الخاص بك باستخدام عنوان URL هذا للتأكد من أن بطاقة تويتر الخاصة بك تعمل بشكل طبيعي.

- تحتاج إلى الضغط على الرابط أعلاه

- تحتاج إلى نسخ URL مقالك والماضي في مربع URL بطاقة

- تحتاج إلى الضغط على "معاينة البطاقة"

- ثم سترى مقالك مع صورة كبيرة في اليد اليمنى.

الخطوة 7: أوصي بأن تحاول اختبار مشاركة المقالة مع الصور من مدونك إلى حساب Twitter بعد الانتهاء من اختبار عنوان URL أعلاه جاهزًا. 

كما سترى مقالك مع الصور الكبيرة على تويتر. وهذا يعني أن زوار موقعك سيشاهدون الصور الكبيرة كما تشاء.

› إضافة ميتا تاج open graph لمدونات البلوجر لنشر السليم على الفيسبوك

شيء آخر ، إذا كنت تهدف إلى تغيير نوع بطاقة تويتر ، فيمكنك نسخ أو تحرير رمز علامة التعريف ووضعه بين

 <head> ......... </head>...

الخيار 1: بطاقة الملخص الأساسية

<!--TWITTER CARD CODE by www.chrohat.com-->
<b:if cond='data:blog.pageType == "item"'>
   <b:if cond='data:blog.metaDescription'>
      <meta content='summary_large_image' name='twitter:card'/>
      <meta content='معارف التويتر' name='twitter:site'/>
      <meta content='معارف التويتر' name='twitter:creator'/>
      <meta property="og:title" content="اسم حسابك ،" />
      <meta property="og:url" content="https://www.Domin.com/" />
      <meta expr:content='data:blog.pageName' name='twitter:title'/>
      <meta content='Domin.com' name='twitter:domain'/>
      <meta property="og:image" content="URL Image.jpg" />
      <meta expr:content='data:blog.pageName' name='twitter:title'/>
      <meta expr:content='data:blog.metaDescription' name='twitter:description'/>
      <b:if cond='data:blog.postImageThumbnailUrl'>
       <meta expr:content='data:blog.postImageThumbnailUrl' name='twitter:image:src' />
      </b:if></b:if></b:if>
<!--TWITTER CARD CODE by www.chrohat.com-->  

الآن أين ستضع هذا؟ اسمح لي بتوجيهك خلال هذا أيضًا.

8. كان وضع بيانات بطاقة تويتر

الآن بعد أن اكتملت بطاقة Twitter ، فقد حان الوقت أخيرًا لإضافتها إلى صفحة ويب. لتحقيق ذلك ، ما عليك سوى أخذ المقتطف ووضعه في قسم العنوان في صفحة الويب.

 إذا كنت تستخدم CMS ، فهناك مكونات إضافية يمكنها تبسيط هذه العملية وتوفير الكثير من الوقت. ومع ذلك ، إذا كنت تفضل الطريقة اليدوية ، فتأكد من وضع الرمز قبل علامة إغلاق الرأس.

› حل لمشكلة عدم وصول الرمز الامان على التويتر Twitter

9. التحقق من عملك

بعد إضافة بطاقة Twitter إلى موقع الويب الخاص بك ، من المهم التحقق من عملك. استخدم أداة التحقق من صحة بطاقة Twitter 

للتأكد من خلو بطاقة Twitter Card Validator Tool  من الأخطاء وفي المكان الصحيح. لا تنسَ التحقق من السجل الموجود في الجزء السفلي الأيسر للتأكد من تحميل بطاقة Twitter بنجاح.

- رابط  أداة التحقق :  Card validator

› طريقة جعل قالب بلوجر متجاوب و متوافق مع شاشات الهواتف و الاجهزة اللوحية الذكية

للمزيد من التوضيح كما عودناكم على مدونة شروحات للمعلوميات شروحات دائما مرفوقة بالدرس فرجة ممتعة

› يمكنك مشاهدة : دورة بلوجر

› رابط  أداة التحقق :  Card validator

› رابط ادة للحصول على الاكود مباشر :  Twitter Card Generator Tool

› الدعم الرسمي لبطاقات تويتر : Getting Started Guide

› أداة تحليلات بطاقة تويتر : Twitter Card Analytics

› كيفية الحصول على رقم معرف حساب تويتر: Twitter ID

› إنشاء حساب : Account-On PC

› إنشاء حساب على الهاتف : Account-On PC