فأنت تسمح للآخرين أو زوار المدونة بالتعليق على المواضيع باستخدام حساب الفيسبوك الخاص بهم. و هنا تستفيد من مشاركت التعليقات مع الاصدقاء عن طريق تغذية الفيسوك. و بسبب التحديثات الكثيرة التي جرت مؤخرا في فيس بوك, فاصبح صندوق تعليقات فيسبوك القديم بدون اي فائدة على مدونات بلوجر لذلك يجب عليك تحديث الاكواد و تركيب النظام الجديد الذي سوف نطرحه في هذا الدرس على
من خلال تركيب تعليقات الفيسبوك على بلوجر فأنت تسمح للآخرين أو زوار المدونة بالتعليق على المواضيع باستخدام حساب الفيسبوك الخاص بهم. و هنا تستفيد من مشاركت التعليقات مع الاصدقاء عن طريق تغذية الفيسوك. و بسبب التحديثات الكثيرة التي جرت مؤخرا في فيس بوك, فاصبح صندوق تعليقات فيسبوك القديم بدون اي فائدة على مدونات بلوجر لذلك يجب عليك تحديث الاكواد و تركيب النظام الجديد الذي سوف نطرحه في هذا الدرس على مدون محترف. لأن فيسبوك أعلنت إن دعم النسخ القديمة سوف ينتهي في 23 يونيو 2015. و من لا يملك تعليقات فيس بوك في مدونته على بلوجر فيمكنه إتباع الدرس التالي و تركيب صندوق التعليقات الجديد, و هو متجاوب مع جميع الشاشات لذلك ركز جيدا في الشرح.
الخطوة الأولى
ابحث عن الوسم </body> و اضف الكود التالي تحته, وإذا كان موجود الكود القديم امسحه و اضف هذا
<div id="fb-root"></div>
<script>
//<![CDATA[
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//]]>
</script>
الخطوة الثانية
يجب عليك إضاقة كود CSS من أجل إخفاء تعليقات بلوجر و إظهار تعليقات فيسبوك ابحث عن الوسم ]]></b:skin>
و اضف الكود التالي فوقه
.fb-comments,.fb_iframe_widget span,.fb_iframe_widget iframe{width:100%!important}
.fb-comments{padding:0 15px!important;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
#comments{display:none!important}
إعدادات الكود السابق
قم بتغيير رقم 15px و هو الخاص بالبعد بين التعليقات داخل المواضيع
الخطوة الثالثة
قم بنسخ الكود التالي اولا
<b:includable id='fb-comments' var='post'>
<div class="fb-comments" id="fb-comment" expr:data-href='data:post.url' data-numposts="5"></div>
</b:includable>
بعد نسخ الكود السابق ابحث عن الكود التالي
<b:includable id='comments' var='post'>
...........
...........
...........
</b:includable>
ثم قم بلصق الكود الذي قمنا بنسخه في اول الخطوة الثالثة تحته ليصبح الكود على هذا الشكل
<b:includable id='comments' var='post'>
...........
...........
...........
</b:includable>
<b:includable id='fb-comments' var='post'>
<div class="fb-comments" id="fb-comment" expr:data-href='data:post.url' data-numposts="5"></div>
</b:includable>
الخطوة الرابعة
قم بنسخ الكود التالي <b:include data='post' name='fb-comments'/> ثم ابحث عن الكواد التالي و قم بلصقه كما في الكود التالي
<b:includable id='main' var='top'>
............
............
<b:if cond='data:blog.pageType == "static_page"'>
<b:include data='post' name='fb-comments'/>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='fb-comments'/>
<b:include data='post' name='comments'/>
</b:if>
............
............
</b:includable>
او على النحو التالي في قوالب بلوجر الافتراضية
<b:includable id='main' var='top'>
............
............
<div class='post-outer'>
<b:include data='post' name='post'/>
<b:include cond='data:blog.pageType in {"static_page","item"}' data='post' name='fb-comments'/>
<b:include cond='data:blog.pageType in {"static_page","item"}' data='post' name='comment_picker'/>
</div>
............
............
</b:includable>
لعرض عدد التعليقات استخدم الكود التالي
<a expr:href='data:post.url + "#fb-comment"'><span class="fb-comments-count" expr:data-href='data:post.url'></span> comments</a>
و أخيرا قم بحفظ القالب و ادخل على احد مواضيع مدونتك و انظر إذا التعليقات هل تم إستبدال تعليقات بلوجر بصندوق تعليقات فيس بوك او لا. اي سؤال او استفسار لا تترد بوضعه في تعليق.
اعلن هنا