كود اخر التعليقات احترفي.

السلام عليكم ورحمة الله  وبركاته :

اليوم  جت لكم بكود اخر تعليقات المدونة بشكل جذاب واحترفي بكل معنى الكلمة.

1-اذهب الى لوحه التحكم فى مدونتك 

ثم التخطيط

ثم أضافه أداة

اختار 

HTML/JavaScript

ثم قم بوضع الكود التالي:

h2><p style="text-align: justify;"></p><div style="height: 200px; overflow: auto; width: ancho;"><style type="text/css">#komentar{background:#fff;border:1px solid #FFFFFF;-moz-border-radius-bottomright:10px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;border-radius:5px;margin:5px 0;:5px}#komentar ul{margin:0;padding:0;list-style:none}#komentar ul li:first-child{border-top:0}#komentar ul li{height:46px;background:#a9d0f5;list-style-type:none;margin:0 0 5px 0;padding:5px 5px 5px 5px!important;font-size:12px!important;font-weight:550;border:1px solid #8181f7;-moz-border-radius-bottomright:10px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;border-radius:5px;margin:5px 0;padding:5px}#komentar ul li:last-child{border-bottom:0}#komentar ul li:hover{background:#cff;-moz-border-radius-bottomright:10px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;border-radius:5px;margin:5px 0;padding:5px}#komentar a,#komentar a:link,#komentar a:visited{clear:both;color:#222;display:block;text-decoration:none}#komentar .gamen{display:block;float:left;height:42px;left:4px;margin-right:15px;position:relative;width:42px}#komentar .gamen>img{border:2px solid #fff;-webkit-border-radius:22px;-moz-border-radius:22px;border-radius:22px;box-shadow:0 1px 2px #222;background:url(http://tipstrikblogging.googlecode.com/files/Avatar%20Blogger%20Comments.jpg)repeat-x}#komentar ul li div.ismen{color:#333;text-shadow:-1px -1px 1px #ccc}#komentar .ismen{line-height:1.2;:2px 4px 2px 0}#komentar .gamen>span{width:150px;height:auto;line-height:20px;padding:5px;left:115px;margin-left:-64px;font-size:1em;font-weight:bold;color:#212121;text-shadow:1px 1px 1px rgba(0,0,0,0.1);text-align:center;border:4px solid #5858fa;background:rgba(255,255,255,0.7);text-indent:0;border-radius:5px;position:absolute;pointer-events:none;bottom:100px;opacity:0;box-shadow:1px 1px 2px rgba(0,0,0,0.2);-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;transition:all .3s ease-in-out}#komentar .gamen>span:before,#komentar .gamen>span:after{content:'';position:absolute;bottom:-15px;left:50%;margin-left:-9px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid rgba(0,0,0,0.1)}#komentar .gamen>span:after{bottom:-14px;margin-left:-10px;border-top:10px solid #5858fa}#komentar .gamen:hover>span{opacity:.9;bottom:55px}</style><div id="komentar"><ul><script type="text/javascript">var jmlkomentar=100;var jmlkarakter=60;</script><script src="http://tipstrikblogging.googlecode.com/files/RecentComment-W-Gravatar-Tooltip.js" type="text/javascript"></script><script src="http://ayoub-pro.blogspot.com/feeds/comments/default?alt=json&amp;callback=tampilkankomentar" type="text/javascript"></script></ul></div></div></div> <div dir="rtl" style="text-align: right;" trbidi="on"> <div style="text-align: center;"> <b><span style="font-family: &quot;Trebuchet MS&quot;,sans-serif;"><span style="font-size: large;">تطوير </span>: <span style="color: #3d85c6;"><span style="font-size: large;"><a href="http://ayoub-pro.blogspot.com/" target="_blank">أيوب برو </a></span></span></span></b></div> </div>

ملاحضة: قم بتغيير ما لون بالون الاحمر.