كيفية إضافة أحدث التعليقات بالصور

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

قم بالذهاب إلى تخطيط ثم إختر إضافة أداة ثم  HTML/JAVASCRIPT ثم أضف الكود التالي.
<style type="text/css"> ul.w2b_recent_comments{list-style:none;margin:0;padding:0;} .w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;} .w2b_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;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{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;} </style> <script type="text/javascript"> //<![CDATA[ // Recent Comments Settings var numComments = 3, showAvatar = true, avatarSize = 50, roundAvatar = true, characters = 40, showMorelink = true, moreLinktext = "إقرأ المزيد »", defaultAvatar = "http://www.gravatar.com/avatar/?d=mm", hideCredits = false; //]]> </script> <script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/svn/trunk/w2b-recent-comments-w-gravatar.js"></script> <script type="text/javascript" src="http://arabs-c.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=3"></script>
قم بتغيير مالون بالأحمر بعدد التعليقات التي تريد أن تظهر.
قم بتغيير مالون بالأزرق ب false إذا لم ترد أن تظهر الأيقونة الخاصة بالمعلق.
قم بتغيير مالون بالوردي ب false إذا لم ترد أن تكون للصورة حواف دائرية.
قم بتغيير مالون بالأخضر ب false  إذا لم ترد أن تظهر إقرأ المزيد.

                      &&إذا أعجبك الموضوع قم بمشاركته ولاتكن ممن يحتكر المعلومة&&

تنبيه : المرجوا عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا

هل اعجبك هذا الموضوع ؟

جميع المواد الواردة في هذا الموقع حقوقها محفوظة لذى ناشريها ،ممنوع النقل بدون تصريح أو ذكر للمصدر . Privacy-Policy | إتفاقية الإستخدام

إن جميع المواد الموجودة في الموقع تعبر عن آراء كتابها ولاتعبر عن رأي الموقع لذلك لايتحمل الموقع أي مسؤوليات تجاهها