√ إضافة تعليقات فيس بوك وأدوات أخرى للمواقع والمدونات

إضافة تعليقات فيس بوك وأدوات أخرى للمواقع والمدونات

ميستر معلم

3/29/2013

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

التعليقات.
أزرار المشاركة.
مربع الإعجاب والمتابعين.

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

لزيادة التفاعل على موقعك، يمكنك إضافة التعليقات بحيث يمكن لأي زائر ترك تعليق على المواضيع عند قرائتها.

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

صندوق تعليقات فيس بوك على بلوجر

1. أنت بحاجة أولا لانشاء تطبيق على الفيسبوك، وللقيام بذلك راجع الدرس التالي: انشاء تطبيق على فيس بوك

2. بعد انشاء التطبيق والحصول على ID الخاص به، سنقوم باضافة الكود الخاص بتفعيل ادوات فيس بوك على المدونة.

3. من واجهة بلوجر قم بالنقر على المظهر.
4. انقر على الثلاث نقط ثم تعديل HTML.
5. قم بالنقر بعد ذلك وسط كود القالب في أي مكان ثم Ctrl+F من لوحة المفاتيح للبحث عن الكود التالي : <body/>

6. بعد ايجاد <body/>، فوقه مباشرة ألصق الكود التالي مع تغيير رقم App ID بالأحمر الذي ستحصل عليه من تطبيق الفيسبوك الذي عملته في المرحلة الأولى :

7. قم بالبحث مرة أخرى عن الكود التالي: <data:post.body/> والذي يظهر المشاركات.
8. وتحته مباشرة أضف الكود التالي الذي سيظهر تعليقات فيس بوك:

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

صندوق المتابعة

عوض استعمال الإعلانات للحصول على المزيد من المتابعين. يمكن تحويل زوارك لمعجبين عن طريق إظهار مربع الإعجاب في الواجهة.

يمكنك انشاء مربع بالشكل الذي تريده وإظهاره على مدونتك. وهذه هي الطريقة:

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

صندوق الاعجاب الثابت

1. أول شيء أنت بحاجة لانشاء ال plugin قبل اضافته للمدونة.
2. قم بالدخول لصفحة مطوري الفيس بوك وأدخل المعلومات التالية كما:

إعداد الأداة في صفحة مطوري الفيس بوك

لإضافة مربع الإعجاب فيس بوك لمدونتك، تتبع الخطوات التالية:

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

اعدادات الاداة

بعد النقر على Get Code سيتم فتح نافذة تحتوي على كودين اثنين.

الكود الأول: هو الذي يحمل الأداة من فيسبوك.
الكود الثاني: يظهر الأداة على مدونتك.

بعد الحصول على الأكواد حان الوقت لاضافتها على المدونة.

إظهار الصندوق على المدونة

1. من واجهة مدونتك قم بالنقر على التخطيط ثم إضافة أداة

التخطيط لاضافة اداة جديدة

2. بعد ذلك تختار نوع الأداة وهي HTML/JavaScript

أداة بلوجر من نوع html javascri^t

3. داخل إطار الأداة قم باضافة الكودين الإثنين واحفظ التغييرات.

صندوق على شكل نافذة منبثقة

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

لكن هذه المرة في نافذة متحركة تنبثق وسط واجهة المدونة. وما يميز هذه الاداة أنها تظهر لمرة واحدة تجنبا لإزعاج الزوار.

شكل مربع الإعجاب فيس بوك المتحرك لمدونات بلوجر

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

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

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

1 - من منصة بلوجر ستنقر على التخطيط
2- ثم إضافة أداة
3- اختر HTML/JavaScript
4- وتلصقون الكود التالي داخل إطار الأداة:

5- يكفي تعويض إسم صفحة Folfoly بالأزرق بإسم صفحتكم على الفايسبوك قبل حفظ التغييرات. إليك طريقة الحصول على اسم خاص لصفحة فيسبوك:

تصميم آخر للصندوق المنبثق

هل تريد الإستفادة أكثر من زوار مدونتك وزيادة عدد المتابعين عير فيس بوك؟ جرب هذه الأداة وإن كانت لا تعتبر من الإضافات الضرورية إلا أنها مهمة.

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

مشاهدة مثال

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

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

لإضافة نافذة منبثقة على شكل مربع متابعة فيس بوك، اتبع الخطوات التالية:

لا تنسى حفظ نسخة من القالب تجنبا لفقدانه.

1 - من واجهة التحكم في المدونة قم بالنقر على المظهر ثم تحرير html

2 - قم بالبحث عن الكود التالي:

<body

وتحته مباشرة اضف الكود التالي:

4 - بعد ذلك، قم بالبحث عن </head> وفوقه مباشرة اضف:

5 - مرة اخرى بالبحث عن </body> وفوقه مباشرة اضف الكود:

قم بتغيير المكان المحدد بالأحمر بإسم صفحتك على فيس بوك.

<div id='mba-likebox-bg'>
<div id='mba-likebox-bg-out'>
</div>
<div id='mba-likebox'>
<div id='mba-likebox-out'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ffolfoly&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false&' style='width:390px; height: 230px;'/>
<div id='credits'>
أداة من <a href='http://www.folfoly.com' id='creditlink' rel='nofollow' target='_blank' title='تعلم كيف تستفيد من الانترنت'>فولفولي</a>
</div>

</div>

</div>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {
// key and at least value given, set cookie...
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// key and possibly options given, get cookie...
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script src='https://yourjavascript.com/7411453777/blogger.js' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_user_login') != 'yes'){
$('#mba-likebox-bg').delay(100).fadeIn('medium');
$('#mba-likebox-out, #mba-likebox-bg-out').click(function(){
$('#mba-likebox-bg').stop().fadeOut('medium');
});
}
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });
});
</script>

6 - قم بحفظ التغييرات، تم.

لقد قمت للتو بإضافة كود تظهر صندوق تابعنا على فيس بوك، وسترى زيادة في عدد المعجبين بمرور الوقت.

بلوجر

ميستر معلم 3/29/2013