اضافة تعليقات بلوجر والفيسبوك جنبا إلى جنب اضافات بلوجر

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

صورة بعد تطبيق الشرح :

اضافات بلوجر

للتجربة الحية :

مدونة تجريبية

شرح التركيب :

قم بأخذ نسخة احتياطية وقم بحذف أي كود متعلق بتعليقات الفيسبوك إذا كنت تستخدمها

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

لتحصل على معرف التطبيق + معرف الحساب

من تحرير HTML قم بتوسيع قوالب عناصر واجهة المستخدم وابحث عن :

<div class='comments' id='comments'>

قد تجد أكثر من واحد المهم أضف بعد كل واحد الكود التالي :

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='أضف تعليقك عن طريق الفيسبوك'>

<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>

<fb:comments-count expr:href='data:post.url'/> تعليقات

</div>

<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='أضف تعليقك عن طريق بلوجر'>

<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> تعليقات

</div><div class='clear'/>

</div>

<div class='comments-page' id='fb-comments-page'>

<b:if cond='data:blog.pageType == "item"'>

<div id='fb-root'/>

<fb:comments expr:href='data:post.url' num_posts='2' width='580'/>

</b:if>

</div>

<div class='comments comments-page' id='blogger-comments-page'>

الآن ابحث عن </head> وأضف قبلها الكود التالي مع تغيير معرف الحساب :

<script src='http://connect.facebook.net/ar_AR/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='معرف الحساب' property='fb:admins'/><script type='text/javascript'>function commentToggle(selectTab) {$(".comments-tab").addClass("inactive-select-tab");$(selectTab).removeClass("inactive-select-tab");$(".comments-page").hide();$(selectTab + "-page").show();}</script>

الآن ابحث عن ]]></b:skin> وأضف قبلها :

.comments-page { background-color: #f2f2f2;}#blogger-comments-page { padding: 0px 5px; display: none;}.comments-tab { float: right; padding: 5px; margin-left: 3px; cursor: pointer; background-color: #f2f2f2;}.comments-tab-icon { height: 14px; width: auto; margin-left: 3px;}.comments-tab:hover { background-color: #eeeeee;}.inactive-select-tab { background-color: #d1d1d1;}

ابحث عن <html أضف بعده مباشرة الكود التالي :

xmlns:fb='http://www.facebook.com/2008/fbml'

ليصبح الكود هكذا :

<html xmlns:fb='http://www.facebook.com/2008/fbml'

الآن ابحث عن وأضف <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>

المصدر : معهد خبراء بلوجر

اضافات بلوجر › اضافة تعليقات بلوجر والفيسبوك جنبا إلى جنب
اضافة تعليقات بلوجر والفيسبوك جنبا إلى جنب

إنضم معانا على الفيسبوك

اخر التعليقات

أقسام المدونة

المتابعون

صاحب الموقع

اضافات بلوجر › اضافة تعليقات بلوجر والفيسبوك جنبا إلى جنب اضافة تعليقات بلوجر والفيسبوك جنبا إلى جنب