إضافة صندوق يعرض اخر التعليقات لمدونات بلوجر

السلام عليكم ومرحبا بكم في مدونة عبدو تكنولوجي اليوم اقدم لكم اضافة لعرض جميع تعليقات المدونة  على بلوجر

هذه الاضافة تم استعمالها في قوالب مارشميلو و الذي يميز هذه الاضافة هوا انه عندما يتم التعليق بفيديو او بصورة يضهر شارة صغيرة تبين نوع الملف الذي رفع 

يمكنك معاينة الاضافة من هنا

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

• ابحث في القالب على </head> وضع الكود التالي فوقه مباشرة

<style type='text/css'>/*<![CDATA[*/ /*===================================== * recent comments * =========================================*/ .abdoutech-comments{padding:4px} .abdoutech-comments .ta3li9{margin-bottom:15px;padding-bottom:15px;overflow:hidden;border-bottom:1px solid #eeeeee} .abdoutech-comments .ta3li9 .avatar{border:3px solid #eeeeee;float:right;width:50px;height:50px;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;margin-left:15px;overflow:hidden} .abdoutech-comments .ta3li9 .avatar img{width:100%;height:100%} .abdoutech-comments .details-ta3li9 cite{-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;font-style:normal;float:right;height:21px;margin:0 0 4px 9px;overflow:hidden} .abdoutech-comments .details-ta3li9 time{overflow:hidden;font-size:10px;float:right;background:#fff;color:#2e3543;padding:4px} .details-ta3li9{overflow:hidden} .abdoutech-comments .details-ta3li9 time i{margin:0 3px} .abdoutech-comments .details-ta3li9 cite a{font-weight:700} .abdoutech-comments .ta3li9 p{padding:6px;overflow:hidden;margin:4px auto} .abdoutech-comments .ta3li9 .comment-url{display:block;padding-right:15px;overflow:hidden;font-size:10px;position:relative} .ta3li9 .att-com{font-size:14px;position:relative;padding:0 9px;background:#2e3543;color:#fff;padding-right:20px;padding-left:4px;border-radius:3px} .ta3li9 .att-com:after{top:4px;display:inline-block;font-family:'FontAwesome';vertical-align:middle;position:absolute;right:3px} span.att-com.vid_youtube:after{content:"\f16a"} span.att-com.img-coment:after{content:"\f1c5"} span.att-com.vid_vimeo:after{content:"\f27d"} .ta3li9 .vid_youtube{background:#f00} .ta3li9 .vid_vimeo{background:hsl(198,89%,50%)} /*]]>*/ </style>

• الان ابحث على هذا الكود </body> وضع الكود التالي فوقه مباشرة
• الكود من هنا

الان يمكنك حفظ القالب و الذهاب الى التخطيط و تفتح اضافة اداة html/javascript  وتضيف هذا الكود

<div class='abdoutech-comments' number-no="5"/></div>

لزيادة عدد التعليقات غير رقم 5 الذي ب الاحمر برقم الذي تريد ضهوره

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

شارك الموضوع عبر :



free-blogger