الأربعاء، 27 مارس 2013

طريقة اضافة تعليقات الفايسبوك لمدونة بلوجر 2013

بسم الله الرحمان الرحيم
السلام عليكم،،

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




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



نقوم بحفظ معرف التطبيق في مكان ما اوملف text 
الان نقوم باستخراج معرف حسابك على الفايسبوك
ندخل على الرابط التالي http://graph.facebook.com/xxxxxxxx
غير الحروف xxxxxxxباسم حسابك
وبعدها نحفظ معرف حسابك 


المرحلة2:

ننسخ الكود التالي
xmlns:fb='http://www.facebook.com/2008/fbml'

 ليصبح هكذا
<html xmlns:fb='http://www.facebook.com/2008/fbml' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

بعدها 
نبحث عن <body> و بعده مباشرة ألصق الكود الآتي بعد استبدال معرف التطبيق بالأرقام التي نسختها سابقا في الخطوة الأولى: 
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
    FB.init({xfbml: true, appId: معرف التطبيق });
  };
  (function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol +
      '//connect.facebook.net/ar_AR/all.js'
    document.getElementById('fb-root').appendChild(e);
  }());
</script>


بعد ذلك ابحث عن </head> ثم قبله مباشرة ألصق الكود الآتي:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta   expr:content='data:blog.pageTitle' property='og:title'/>
<meta   expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta   expr:content='data:blog.title' property='og:title'/>
<meta   expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta   content='عنوان المدونة' property='og:site_name'/>
<meta   content='http://google.com/help/hc/images/logos/blogger_logo.gif'   property='og:image'/>
<meta content='معرف التطبيق ID'   property='fb:app_id'/>
<meta content='معرف حسابك على فيسبوك ID'   property='fb:admins'/>
<meta content='article'   property='og:type'/>

هذا الكود خاص ب Open Graph protocol وهو يتيح لفيسبوك التعامل مع موقعك أو مدونتك كما لو كان صفحة كما صفحات فيسبوك... طبعا لا تنس تغيير ما أشير إليه بالألوان كما يلي:
عنوان المدونة : عنوان مدونتك أو أي اسم تحب أن يظهر على فيسبوك عندما يعجب أحدهم بإحدى تدويناتك.
الرابط البرتقالي : استبدله برابط صورة لشعار مدونتك.
معرف التطبيق ID : طبعا هو نفسه المعرف الذي نسخته في الخطوة الأولى.
معرف حسابك على فيسبوك ID : هو مجموعة أرقام يمثل حسابك على فيسبوك لمعرفته يمكنك زيارة هذا الموضوع. فبحسابك هذا ستكون مدير التعليقات Admin.


ثم ابحث عن <data:post.body/> و بعده مباشرة ألصق الكود الموالي مع تعديل ما لون:
560 استبدلها بالعرض المناسب الذي تريد أن يبدو عليه صندوق تعليقات فيسبوك، و هذا هو الكود الذي يتولى إظهار صندوق التعليقات، فيمكنك إدراجه في أمكنة أخرى غير الذي ذكر بما يناسب مدونتك.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div><script src='http://connect.facebook.net/ar_AR/all.js#xfbml=1'/>
<fb:comments width='560' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' migrated='1'/>
</div>
</b:if>

ملاحظة: لمن يملكون قوالب داكنة أو سوداء اللون يمكنه استعمال صندوق تعليقات فيسبوك باللون الأسود و لفعل ذلك نضيف colorscheme='dark' مباشرة بعد <fb:comments في الكود السابق.

و أخيرا اضغط زر الحفظ و هنيئا لك.






0 التعليقات:

إرسال تعليق

 
قالب بلوجر مجاني|ال سيد الشيخ احمد - | ,