طريقة اظافة صندوق المعجبين الفيسبوك " Fun Box "

طريقة اظافة صندوق المعجبين الفيسبوك " Fun Box " 

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

بسم الله الرحمن الرحيم

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

إلى يمين الصفحة في موقعك سيظهر المعجبون عند مرور الماوس على الإيقونة وهي طريقة تتبيث الصندوق بتقنية الـ JQuery ،إنها حقاً أسهل طريقة  ،وحتى لا أُ كثر من الحديث أتركك مع خطوتيان فقط! ،ادراج صندوق معجبين الفيسبوك إلى مدونتك أو موقعك بكل سهولة

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

وبعد توسيع القالب قم بالبحث عن هذ الكود بالضغط على Ctrl + F

</head>

ثم أضف فوقه مباشرة الكود التالي

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

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

<script type="text/javascript">

//<!--

$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});

//-->

</script>

<style type="text/css">

.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzy_sc1WPGBMpSD5ukqkFzZvqM-UqWwqZGRa-qE9V7A4wUC6usbpzqI7h6N2ErHmmH82SMZya9KUXFtF4GpPM1ILrSmo1Gs7EAQKMqWojVM-NmiiNC5NpgVn1J7DjUVgEDFJAfOk8HbEY/s1600/facebook-right.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}

.w2bslikebox div{border:none;position:relative;display:block;}

.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}

.w2bslikebox span a{color: #808080;text-decoration:none;}

.w2bslikebox span a:hover{text-decoration:underline;}

</style><div class="w2bslikebox" style=""><div><iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/touspro1&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe></div></div>

شرح الكود :-

1. استبدل "http://www.facebook.com/touspro1" برابط صفحة مدونتك على الفيسبوك .
2. لتغيير الصورة استبدال رابط الأزرق رابط الصورة التي تريدها . 

أتمنى أن كون قد أفدتكم لاي استفسار اتركو تعليقاتكم