شرح اضافة زر "أعجبني" من الفايسبوك لمدونات بلوجر

بسم الله و الحمد لله و الصلاة و السلام على محمد الأمين. السلام عليكم و رحمة الله. و بعد، في هذا الموضوع بإذن الله سنتطرق و رفقتكم الطيبة إلى الطريقة المثلى لإدراج زر "أعجبني" المقدم من فيسبوك. أولا و قبل التطرق لطريقة الإضافة في بلوجر ووردبريس نطرح سؤالا رئيسا، ما نفع هذا الزر؟ كما تعلمون يعد فيسبوك Facebook أول و أكثر الخدمات الاجتماعية رواجا في الشبكة يتشارك من خلاله المتصفحون روابطهم، صفحاتهم، و كل ما راقهم و أعجبهم، فعندما يضغط زائر زر "أعجبني" فإنه يشار في حسابه على فيسبوك إلى أنه قد أحب موضوعا فهو يعرضه على أصدقائه و يزكيه عندهم، فالزائر يجلب زوار آخرين و هكذا و بالصور نوضح ذلك.
جرب الآن أن تضغط الزر أسفله (طبعا يجب أن تكون متصلا بحسابك في فيسبوك).


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

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

أولا: في مدونات بلوجر Blogger

من لوح تحكم مدونتك توجه إلى صفحة تحرير Html ، و قبل بدء التعديل احفظ نسخة احتياطية من القالب ثم ضع علامة في خانة توسيع القوالب و جد هذا الكود. (في حال وجدت منه اثنين فالمقصود هو الثاني).

<data:post.body/>

بعده مباشرة تضع كود زر "أعجبتني" و هو الآتي.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>

لتخصيص الزر غير ما أشير إليه في الكود بالألوان.

• like  يمكن تغييرها إلى recommend  لتغيير النص الظاهر في الزر من "أعجبتني" إلى "ننصح بهذا" ليصبح هكذا.

• arial لتغيير الخط كأن تضع مكانها مثلا tahoma فيصبح هكذا.

• light غيرها إلى dark لتحصل على لون آخر للزر هو الآتي.

ثم تحفظ القالب و به تكون قد أنهيت المهمة.

\!/ تحديث : جدد مظهر الزر بحيث يظهر عدادا للمعجبين بالموضوع، رجاء ممن يضعون الكود القديم أن يبحثوا عن layout=standard ثم يستبدلوه ب layout=button_count ، أما من يضع الكود للمرة الأولى فلا يفعل هذا لأني عدلت كود الزر ليظهر الشكل الجديد.