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

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

1 - ندخل إلى لوحة تحكم المدونة من هنا : blogger
2 - نضغط على " تخطيط" :

3 - نضغط على " HTML/Javascript" :

4 - في العنوان نكتب ما نشاء مثل التحق بصفحتنا على الفايسبوك..... وفي المربع الأسفل نقوم بلصق الكود الخاص (يوجد أسفل المدونة)

5- نضغط " حفظ" ثم نختار المكان الذي نريد أن تظهر فيه الإضافة بتحريكها بواسطة الماوس.

- كود الإضافة:

<div class="metro-social">

<li>technoproff">>

<li> khalid10020">>

<li> https://plus.google.com/+%D8%A8%D9%8A%D8%AA%D8%A7%D9%84%D8%AD%D9%83%D9%85%D8%A92/posts">>

<li> https://www.pinterest.com/arroumkhalid/">>

<li> https://tn.linkedin.com/pub/khalid-arroum/">>

<li>0000Challenge ">>

<li>beit-elhekma1">>

div>

<style>

/*Metro UI Social Profile Widget v3.0 by Tech Prevue Labs

Web link to gadget code: http://www.techprevue.com/2013/02/social-profile-widget-metro-style.html

Distributed under license CC BY-NC-ND 3.0 INT

Please keep license information intact while using this widget*/

.metro-social{width:285px}

.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}

.metro-social .fb,.tw,.gp,.pi,.in,.yt,.fd{z-index:7;float:left;margin:1px;position:relative;display:block}

.metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}

.metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:68px;height:70px}

.metro-social .gp{background:url(//goo.gl/oT0kF) no-repeat center center #da4a38;width:69px;height:70px}

.metro-social .pi{background:url(//goo.gl/7olxx) no-repeat center center #d73532;width:68px;height:69px}

.metro-social .in{background:url(//goo.gl/PhFhj) no-repeat center center #0097bd;width:69px;height:69px}

.metro-social .yt{background:url(//goo.gl/zcwjB) no-repeat center center #e64a41;width:140px;height:69px}

.metro-social .fd{background:url(//goo.gl/lhBP1) no-repeat center center #e9a01c;width:140px;height:69px}

.metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}

.metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}

.metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}

.metro-social li:hover .pi{background:url(//goo.gl/IORvy) no-repeat center center #d73532}

.metro-social li:hover .in{background:url(//goo.gl/2zHrm) no-repeat center center #0097bd}

.metro-social li:hover .yt{background:url(//goo.gl/I1c4a) no-repeat center center #e64a41}

.metro-social li:hover .fd{background:url(//goo.gl/CjzDP) no-repeat center center #e9a01c}

style>

لا تنسى تغيير ما باللون الاحمربالأسماء الخاص بك على مواقع التواصل الاجتماعي

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

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