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

السلام عليكم زوار مدونة سامي سهيل
في سلسلتنا المتواصلة لتطوير و دعم مدونات بلوجر-Blogger عمل هذا الشرح السريع:

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

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


1# معاينة الاضافة:

و انا بدوري استخدمها في مدونة سامي سهيل

يمكنك تجريبها على يمين الصفحة و الانضمام لنا ^^
بالضغط على Like او J'aime او اعجبني


2# طريقة التركيب:
 

ادخل على تصميم/ تحرير html/ قم بتوسيع القالب وخذ نسخة احتياطية لتجنب الخطأ.
الان ابحث عن:
 </head>
  ثم اضف قبله هذا الكود
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
احفظ القالب
ثم توجه إلى تصميم/عناصر الصفحة
وأضف أداة HTML/JavaScript Add  والصق بها الكود التالي :
ممنوع ازالة الحقوق جزاكم الله خيرا
<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/AVvXsEj37t8VMeAo4wKjhyXfj8mbJE2a_eyqGsDxdq9gjsEYtTnzN72P3WCocjw4p_DkqsZdjs4GbIhSdMNOQmYjk5yDMlwGU4Wbxm991yMch3eQclPUy5BMfKfjOFppuZtQzyjcXNhr6MvZlD8/s1600/w2b_facebookbadge.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%3A%2F%2Ffacebook.com%2Fsamysouhail.blogspot&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><span><a href="http://samysouhail.blogspot.com/">by Samy Souhail</a> # <a href="http://samysouhail.blogspot.com/2011/09/jquery.html">+Get This</a></span></div></div>
3#تخصيص الكود: 

 و قبل كل شئ انتبه معي لتخصيص هذا الكود
اللون الازرق هو اسم المستخدم للصفحة مثلا
www.facebook.com/samysouhail.blogspot
اذن استبدل samysouhail.blogspot ب الـ  ID الخاص بصفحتك
 .
.
تحياتي لكم
و اي استفسار المرجو كتابته في التعليقات
----
http://samysouhail.blogspot.com
Samy Souhail
بواسطة : Samy Souhail
أول تجربة له كانت سنة 2010، حيت أنشأ مدونة سامي سهيل كأول موقع ويب عام يضم مواضيع حول شروحات الحاسوب وبرامجه وكذا كيفية تطوير المواقع الاكترونية وفهم تطبيقات الهاتف الذكي وكل ما يتعلق بأمن الحواسيب الشخصية والاجابة عن أغلب الأسئلة التي يصادفها المستخدم العربي في شتى المجالات المعلوماتية.
تعليقات