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

السلام عليكم ورحمة الله وبركاتة 
يوجد الكثير يريد تركيب صندوق تعليقات (الفيس بوك) ولكن بعض الشرح الذى يتوفر على الإنترنت يظهر بعض الأخطاء فى أو يتم تركيب الصندوق وتظهر أخطاء ما لان إدارة (الفيس بوك) قامت بتطوير صندوق التعليقات لذلك أتيت لكم بشرح على النظام الجديد ولن تظهر أى أخطاء بإذن الله شرح وافى خطوة بخطوة .
أول خطوة وهى إنشاء تطبيق على الفيس بوك يتيح لك التحكم بـ التعليقات أنا أنشأت واحداً سابقاً ولكن قمت بعمل تطبيق جديد لكى أشرح لكم والآن إفتح هذا الرابط 
https://developers.facebook.com/apps
بعد الدخول إلى هذا الرابط ستجد مثل الصورة التالية 
ستقوم بإنشاء تطبيق جديد مع كتابة المعلومات المطلوبة بسيطة جداً مثل الآتى 
ستكتب معلومات مثل ما هو موضح ولكن طبعا معلومات تناسبك أنت أم الإسم باللغه (الإنجليزية) فلازم يكون هكذا لانه لن يقبل (عربى) وستختار مجال مدونتك إختار أى شئ ليس (هام جداً)
بعد ذلك والضغط على متابعه تابع معى الآن 
ستقوم بكتابة الكلام الخاص بالإختبار الأمنى مثل ما هو موضح بالصورة أعلاه 
وفى هذة الصورة أعلاه تقوم بالتأكيد على المعلومات وإختيار الدومين الخاص بموقعك مثل ما هو موضح 
تابع معى الخطوة التاليه 
ستقوم بكتابة رابط مدونتك / موقعك بنفس الشكل 
والآن إذهب إلى تحرير القالب الخاص بك وإبحث عن هذا الكود <html
ستجده أول القالب ضع بجانبة هذا الكود 
xmlns:fb='http://www.facebook.com/2008/fbml'
بحيث يكون بهذا الشكل 
الآن نبحث عن هذا الكود <body> وبعد مباشرة ذع الكود التالى
<div id="fb-root"></div>
<script>
    window.fbAsyncInit = function() {
    FB.init({
      appId  : 'معرف الـ id ',
      status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the   session
      xfbml  : true  // parse XFBML
    });
  };
    (function() {
    var e = document.createElement('script');
      e.src = document.location.protocol +   '//connect.facebook.net/en_US/all.js';
    e.async = true;
      document.getElementById('fb-root').appendChild(e);
    }());
</script>
- ستجد هذا الكود فى تطبيقك الذى قمت بإنشاءه سنجده بنفس الشكل التالى 
الآن إفتح المفكرة من جهازك وضع بها الكود التالى مع تغير ما يناسبك لاننا سنحتاجها ولكن ليس الآن قم بحفظ الكود التالى على المفكرة .
        <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://4.bp.blogspot.com/-BivYpFoi6-s/UqBsCvKK8LI/AAAAAAAAD4E/iVGoGFuAf2A/s1600/%D8%A8%D9%86%D8%B1-%D8%AE%D8%A7%D8%B5-%D8%A8%D9%89-125.png'   property='og:image'/>
        <meta content='اكتب الـID الذي نسخته سابقا هنا'   property='fb:app_id'/>
        <meta content='انسخ المعرّف (ID) الخاص ببروفايلك في الفيسبوك'   property='fb:admins'/>
        <meta content='article'   property='og:type'/>
كيف أجد معرف الـ id  الخاص بحسابى ؟ بسيطة جداً إفتح الرابط الاتى لايجاده
https://graph.facebook.com/hady.mana 
مع تغير إسمى بإسمك ستجد المعلومات عن حسابك بما فيها الـ id مثل الصورة التاليه 
- الكود السابق الذى تم حفظة فى المفكرة ضعه قبلة هذا الكود مباشرة </head>  
- والآن إبحث عن الكود التالى 
<data:post.body/>
- ضع الكود التالى بعده مباشرة 
   <b:if cond='data:blog.pageType == &quot;item&quot;'>  <script src='http://connect.facebook.net/ar_AR/all.js#xfbml=1'/>  <div><script src='http://connect.facebook.net/ar_AR/all.js#xfbml=1'/> <fb:comments migrated='1' expr:href='data:post.url'  expr:title='data:post.title' expr:xid='data:post.id' width='450'/>  </div> </b:if>
يمكنك تغيير هذة القيمة بحسب العرض الذى يناسبك width='450'
- ملحوظة : من الممكن أن تجد أكثر من كود مثل هذا <data:post.body/> قد يكون الأول او الثانى هى نختلف فى بعض القوالب
والآن قم بحفظ القالب وأعذرونى إن قصرت فى شرحى

10 Responses to "شرح بالتفصيل إضافة صندوق تعليقات الفيس بوك لمدونتك"

  1. شكرا لك بارك الله فيك ...
    جعله الله في ميزان حسناتك ...

    ردحذف
  2. أخي هادي لو سمحت تساعدني لما أضيف اول شيء قلتة xmlns:fb='http://www.facebook.com/2008/fbml' وأعمل كل شيء وأحفظ يأتيني خطأ من أول شيء

    ردحذف
    الردود
    1. أخى ضع الرابط مثل ما هو موضح بالصورة تماماً

      حذف
  3. بقالي ساعه ماشي مع الشرح بدون اخطاء وفي الاخر الكود ده

    لاقيتو مقرر 3 مرات حطيت الكود بعديه في كل مره ولم يظهر شيء اسفل المواضيع كع الاسف

    وشكرا لشرحك الوفي

    ردحذف
    الردود
    1. أهم شئ أخى نفذت خطوات إن شاء التطبيق صح

      حذف
  4. السلام عليكم , ممكن طريقة اضافة رسالة تنبيه زى الموجودة فى مدونتكم لو سمحت !

    ردحذف
  5. انا عندى مش كدة ارجو الحل

    ردحذف

المشاركات الشائعة

المشاركات الشائعة