اضافة أخر التعليقات متحركة بشكل مميز

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

معاينــة الاضافــة

بلا شك أنها اعجبتك أخى الزائر 

فلا تقلق ستحصل على شكل مماثل بالخطوات التاليــة 

شرح تركيب الاضافــــــــــة 

اذهب للوحة تحكم مدونتك >> التخطيط >> اضافة أداة 

>> Html/javascript 

انسخ الكود التالى وضعه بها 

<marquee direction="down" scrollamount="3" style="background- text-align: left; width:280px;height:340px;border:0px solid #000000;padding:0px" onmouseover="this.scrollAmount='3'" onmouseout="this.scrollAmount='3'">
<br/><style type="text/css"></style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
 numComments  = 15,
 showAvatar  = true,
 avatarSize  = 40,
 roundAvatar = false,
 characters  = 60,
 showMorelink = false,
 moreLinktext = "More &#187;",
 defaultAvatar  = "https://lh3.googleusercontent.com/-RIC-7Z86S0E/UPYX-7IVLuI/AAAAAAAABTk/qx1fLgBjaJk/s40/user.png",
 hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://widgets.way2blogging.org/blogger-widgets/w2b-recent-comments-gravatar.js"></script>
<script type="text/javascript" src=" http://myebd3at.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=15"></script></marquee>
<style type="text/css">    ul.w2b_recent_comments {
list-style: none;
margin: 0 0 15px 0;
padding: 0;
background: none;
width: 100%
 }
.w2b_recent_comments li {
background: #A9D0F5 !important;
display: block;
clear: both;
overflow: hidden;
list-style: none;
margin: 5px 0;
width: 100%;
 }
.w2b_recent_comments li .avatarImage {
padding: 2px;
border: 1px solid #e7e7e7;
background: #fff;
float: left;
margin: 0 4px 7px 3px;
position: relative;
overflow: hidden
}
.avatarRound {
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
 }
.w2b_recent_comments li img {
padding: 0px;
position: relative;
overflow: hidden;
display: block
 }
.w2b_recent_comments li span {
text-shadow: 1px 1px 1px #fff;
margin-top: 4px;
color: #666;
display: block;
font-size: 12px;
padding: 2px 0 6px 0;
line-height: 1.2
 }
.w2b_recent_comments li a {color: #064f4c;text-shadow:1px 1px 1px #fff}
.w2b_recent_comments li a:hover {margin-left: 4px;}
</style>
</div>

التعديلات المتاحة على الاضافة 

♦  numComments  = 15  >> عدد التعليقات التى ستظهر
♦  showAvatar  = true  >> تفعيل ظهور تعليقات الغير معرف
♦  avatarSize  = 40  >> حجم تعليق الغير معرف
♦ scrollamount="3"  >> سرعة حركة الاضافـــــــــــة
♦ direction="down" >> اتجاه الحركـــــــــــــــــــــــة
♦ لا تنسى تغيير رابط مدونة ابداعاتى فى الكود السابق برابط مدونتك


تم الموضوع بحمد اللـــه
و أتمنى أن ينال الاعجاب والتقدير 
أى مشكلة اتركها فى تعليق

و أستودعكم اللـــه الذى لا تضيع ودائعــــه متابعى ابداعاتى الكرام