كبفبة اضافة صندوق like box بخصائص css

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

بحول الله سنتطرق الى كبفبة اضافة صندوق like box بخصائص css الى منصة بلوجر 

وهذه صورة للاضافة :

 اول شيئ نتجه صوب : Design > Edit HTML

ثم  نوسع القالب عبر الضغط على زر “Expand Widget Templates"

ثم نبحث عن 

]]></b:skin> 

ثم نضيف كود css التالي : 

.fb_like_box {
margin-top:10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px;
background-color:#3B5999;
border:3px solid #2B2B2B;
margin-bottom:10px;
padding:10px 7px;
width:540px;
}
.fb_like_top {
overflow:visible;
padding:0;margin:0 0 5px;
width:349px;
height:24px;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAeYmlCHFhRig5kbu8rYe4khmy75CH3UpJRrWldZe6xtQhkZ5BhQ-VoWZbnmIT9H5_riKbg1TB2om14obKSbyVptTIja0ArikGyQ3hx8tzI_lcKDO24N8y7CqgjjhctFIszxGmIYKFsVg/") no-repeat scroll left top transparent;
}
.fb_like_top a {
height:24px;
width:114px;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjosAd-htXpM7OecTM_DT-kJVgHY-8pyzK3HW8JWJ-4KR1yfN40DmGrEprH4j7PZToH0Yek8IOS44x3nCCTc2dqaDbKvI_zkOFVQfSe0JUwYnzLih4cclThh1Y759SnokmdiSpK6IGEzQ/") no-repeat scroll left top transparent;
display:block;
margin-left:425px;
text-indent:-5000px;
}.fb_like_button_holder {
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px;
background:none repeat scroll 0 0 #FFFFFF;
padding:12px 12px 0 12px;
width:515px;
height:42px;
}

ثم نبحث عن : 

<data:post.body/>

ونضيف كود html التالي :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='fb_like_box'>
<div class='fb_like_top'><a rel='nofollow' href='http://www.facebook.com/pages/3alymni/128605887189860'>Be a Fan</a></div>
<div class='fb_like_button_holder'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&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:30px;'/>
</div>
</div>
</b:if>

مع استبادل ما اشير له باللون الاحمر برابط صفحة مدونتك على الفيسبوك

تم بحمد الله