تاريخ نشر : 03‏/04‏/2013

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


صندوق التعليقات الفيس بوك على المدونة الخاص بك بمثابة وسيلة جيدة لجعل موقعك أكثر جاذبية وتشجيع القراء على إضافة التعليقات إذ بالفعل مسجل على facebook. كما أنه بمثابة مصدر لحركة المرور الزوار باستخدام مشاركة التعليق ، لأنه إذا قم زائر بالتعليق  في مدونتك تلقائيا سوف يتم مشاركة التعليق في الحائط الزائر أي الذي قم بتعليق. على الرغم من ذلك ينبغي ملاحظة شيء واحد : مربع التعليقات الفيس بوك لا قيمة له لـ SEO لأنه يعرض في إطار (IFRAME) و لا يتم فهرسته في google. 
مربع التعليقات بلوجر العادي الافتراضي على موقعك لديه بعض المزايا الرائعة وخاصة إذا كنت تحصل على الكثير من التعليق، أكثر الكلمات الرئيسية التي لم تذكر في محتوى مشاركتك ستظهر في تعليقات الزوار وسوف تأتي بالمزيد من حركة المرور من محرك البحث. لآن مربع تعليق Blogger الافتراضي يتم فهرسته من قبل جوجل. وهذا شيء يفتقره تعليق الفيس بوك ، باستثناء حركة المرور الإضافية التي تحصل عليها من الفيسبوك.

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



يمكنك تحقق أيضا من العرض التجريبي من هنا.

كيفية إضافة صندوق تعليق الفيس بوك على Blogspot

يوجد نحو خمس خطوات للقيام بذلك ولكن هدئ أعصابك، فهذا سهل جدا طيب؟ فقط اتبع الخطوات وسيكون لديك صندوق تعليق الفيس بوك جميل مثبت على مدونتك في كل الأوقات.

1. إنشاء تطبيق الفيس بوك

I. أولا وقبل كل شيء يجب عليك إنشاء تطبيق فيس بوك, توجه إلى صفحة الفيسبوك المطور، يجب إنشاء التطبيق جديد من خلال النقر على زر إنشاء تطبيق جديد (Create New App) في اعلى اليمين.




II. أدخل اسم التطبيق في خانة App Name وفي App namespace, تم إدخال الرمز كلمة التحقق و تم إنقر على متابعة .



III. في الصفحة التالية، أدخل اسم النطاق (دومين) الخاص بك مخصص (إذا كنت تستخدم دومين مخصص) أو blogspot.com فقط (إذا كنت تستخدم بلوغسبوت نطاق الفرعي) في خانة App domain.

وفي الخانة Site URL‎ إدخل عنوان URL مدونتك/موقعك الويب كما في صورة أدناه .



IV. انتقل لأسفل قليلا واضغط على زر حفظ التغييرات. الآن تم  الانتهاء من إنشاء تطبيق الفيس بوك ولكن هناك شيئا آخر للقيام به. على نفس الصفحة، يجب أن تشاهد ID التطبيق الخاص بك . نسخه وحفظه في مكان ما، سوف تحتاج إليه.



الآن دعونا نذهب لمدونة الخاص بك، والانتهاء من هذا الأمر

2. إضافة أكواد برمجية إلى القالب


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

تسجيل الدخول إلى حساب Blogger الخاص بك وانقر على قالب> تحرير HTML> تم إنقر على مربع توسيع قوالب عناصر واجهة المستخدم

I. اضغط على Ctrl + F على لوحة المفاتيح والبحث عن هذا الرمز:
<html
ينبغي إيجاد هذا على السطر الثاني أو الثالث من القالب.

- مباشرة أمام ذلك، قم بإضافة الكود البرمجية التالي:
xmlns:fb='http://www.facebook.com/2008/fbml'
- تأكد من أن هناك مسافة قبل وبعد هذا الكود. إنظر إلى المثال التالي:
<html xmlns:fb='http://www.facebook.com/2008/fbml' expr:dir='data:blog…………..2005/gml/expr' >
II. اضغط CTRL + F على لوحة المفاتيح والبحث عن هذا:
<body>
- إذا لم تتمكن من العثور على هذا، ابحث عن شيء مماثل. يجب عليك ان تبحث عن هذا بدلا من ذلك:
<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
- في السطر التالي، لصق هذا الكود:
<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>
تأكد من استبدال ID التطبيق الخاص بك هنا مع ID تطبيق الذي قمنا نسخه من قبل ، تذكر؟

III. الآن، دعونا نضيف العلامة graph meta المفتوحة . أبحث عن هذا الرمز في القالب:
</head>
- في السطر فوقه، لصق هذه القطعة من الكود البرمجية:
<meta property="fb:app_id" content="YOUR_APP_ID" />
استبدل YOUR_APP_ID بنفس ID التطبيق الذي نسخته سابقا.

IV. الآن هنا هو الجزء الأخير من تعديل القالب الخاص بك لجعل القالب يعرض صندوق التعليق الفيس بوك. الشيء الأخير هو  iframe (الإطار لعرض مربع حيث تريد تعليق). ابحث عن هذا في القالب الخاص بك :
<data:post.body/>
- إذا كنت تستخدم قالب نمط مجلة، من المحتمل أن تجد الكتير من هذا الكود. ويمكن أن تستخدم الخاطئ و هذا لا يجعل تعليق تظهر. إذا كنت غير متأكدة من أي واحد سوف تستخدم ، أبحث عن هذا بدلا من ذلك:
<div class='post-footer-line post-footer-line-1'>
- وفي السطر تحته، الصق هذا الكود:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
.doncaprio-share-buttons
{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border:1px solid #BBBBBB;
background-color:#F2F2F2;
-webkit-box-shadow: #B3B3B3 5px 5px 5px;
-moz-box-shadow: #B3B3B3 5px 5px 5px;
box-shadow: #B3B3B3 5px 5px 5px;
padding: 5px;
margin: 10px;
}
</style>
<p align='center'>
<div align='center' class='doncaprio-share-buttons' style='background: #f2f2f2;'>
<font size='6'><strong>أحب أن أسمع رأيك!</strong></font> <img src='http://2.bp.blogspot.com/-cuyBP8zUQU8/UVuVERkPUbI/AAAAAAAAKgA/Sk_s99UQpqM/s1600/comment.png'/>
<br/>
<script src='http://connect.facebook.net/ar_AR/all.js#xfbml=1'/>
<div><fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id'
width='450'/></div><div align='right'><a href='http://stupcomp.blogspot.com/2013/04/new-facebook-comment-box-for-blogger-with-notifications.html' target='blank'><small>[تعليق الفيس بوك لبلوجر]</small></a></div></div></p></b:if>
تم قم بحفظ القالب، يجب أن يظهر نموذج التعليق الفيسبوك الآن. إذا كان يبدو صغيرا إلى حد ما، استبدل width=’450′ مع
width=’600′ . هذا يزيد من العرض 450px إلى 600px

أيضا إن كنت تريد تغيير الجملة الموجودة فوق نموذج تعليق استبدل أحب أن أسمع رأيك! إلى الجملة التي تريد . أو إذا كنت تريد إزالته من النموذج هي و الأيقونة زرقاء قم  بإحذف هذا الكود:
<font size='6'><strong>أحب أن أسمع رأيك!</strong></font> <img src='http://2.bp.blogspot.com/-cuyBP8zUQU8/UVuVERkPUbI/AAAAAAAAKgA/Sk_s99UQpqM/s1600/comment.png'/>
3. تمكين الأشعار للتعليقات على كل مشاركة

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

- زيارة هذا رابط https://developers.facebook.com/tools/comments/?id=YOUR_APP_ID

- تأكد من استبدال YOUR_APP_ID  مع ID التطبيق الخاص بك
- على الصفحة التي تفتح، انقر على الإعدادات وإضافة نفسك كمشرف



- انقر على اسمك عندما يظهر وحفظ التغييرات التي أجريتها. عندما يقوم شخص ما بإضافة تعليقا على المدونة الخاص بك، يجب أن يتم إعلامك تلك اللحظة في الفيس بوك.



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

أيضا إذا كنت تواجه مشاكل في تنفيذ هذا، لا تتردد في ابلاغي في نموذج تعليق ربما يمكن أن أساعدك .

هل يعجبك هذا؟

إتصل بنا

الاسم

بريد إلكتروني *

رسالة *

إشترك في النشرة البريدية للحصول على آخر المواضيع


تابعنا في اليوتيوب

تابعنا على الفيس بوك