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

السلام عليكم ورحمة الله وبركاته وفى درس جديد من دروس موقع التواصل الاجتماعى الامثل (face book )
الان اصبح موقع التواصل الاجتماعى الفيس بوك هو حلقة الوصل بين الانسان والعالم من حوله فكثيرا مايبهرنا باضافاته الرائعة لاصحاب المدونات (بلوجر ) واليوم اقدم لكم درس لكيفية اضافة صندوق اعجابات صفحتك على الفيس بوك فى مدونتك بلوجر بطريقة رائعة

صورة الاضافة





طريقة تخصيص الاضافة 


  قبل كل شيء قم بأخذ نسخة إحتياطية للقالب 

اولا أدخل على حسابك في بلوغر ثم انقر على  تصميم ثم تحرير HTML واختر توسيع القالب .
بعد ذلك قم بالبحث على  </head>
 
وقبله نضيف الكود التالى 
 
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'/>
احفظ القالب


ثم توجه إلى تصميم/عناصر الصفحة وأضف أداة

<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/AVvXsEi4feggTK4MpcC8LQIwoM8CaZbesBgwtji89QeWCG79WHkz8MjPQSgso_enfTG1bN0mdqKByArEY7bX3meL-7OV3XXZsTjfYDWDm6U9nm26HE9l6oNLLPORs20ZsNdBnHArFC6Vm8zA32-V/s150/w2b_facebookbadge.pn") no-repeat scroll left center transparent !important;display: block;float: right;height: 370px;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=ضع هنا رابط صفحتك على الفيس بوك&width=245&colorscheme=light&show_faces=true&connections=9&stream=false&header=false&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://everi-thing.blogspot.com/2011/10/blog-post_8685.html">+Get This!</a></span></div></div> 


وغير ما باللون الاحمر ومبروك عليك الاداة

هناك تعليق واحد:

  1. It's going to be finish of mine day, except before end I am reading this fantastic article to increase my know-how.

    My site :: meuble salle de bain

    ردحذف

تكلم حتى اراك واترك تعليقك بوجهة نظرك