إضافة أداة تمييز تعليقات كاتب المدونة لمدونات بلوجر

الرئيسية تطوير بلوجر كل إضافة أداة تمييز تعليقات كاتب المدونة لمدونات بلوجر

تطوير بلوجركل

إضافة أداة تمييز تعليقات كاتب المدونة لمدونات بلوجر

محمد عبد الوهاب 0

A+ A-

facebook twitter

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

والصلاة والسلام على المبعوث رحمة للعالمين سيدنا محمد وعلى آله وصحبه أجمعين أما بعد :

اليوم جايبلكم إضافة أنا شخصياً بحثت عنها كثيراً وهى تمييز تعليقات كاتب المدونة 

والآن مع الأكواد

ملاحظة : الأكواد معربة فى مكانها وليس فى الكلمة 

الكود سوف يغير شكل كل التعليقات أما إذا أردت فقط تمييز تعليقك فسوف أعطيك الكود الخاص به

أولاً توجه إلى لوحة تحكم المدونة وأختر تعديل القالب 

اضغط على توسيع القالب

ثم ابحث عن الكود التالى

]]></b:skin>

ثم أضف الكود التالى فوقها 

* WWW.TECWAB.COM Comment Area Stylization
/



-----------------------------------------*/



#comments{overflow:hidden}



#comments h4{display:inline;padding:10px;line-height:40px}



#comments h4,.comments .comment-header,.comments .comment-thread.inline-thread .comment{position:relative}



#comments h4,.comments .continue a{background:#eE3E0DC}



#comments h4,.comments .user a,.comments .continue a{font-size:16px}



#comments h4,.comments .continue a{font-weight:normal;color:#fff}



#comments h4:after{content:"";position:absolute;bottom:-10px;left:10px;border-top:10px solid #000000;border-right:20px solid transparent;width:0;height:0;line-height:0}



#comments .avatar-image-container img{border:0}



.comment-thread{color:#111}



.comment-thread a{color:#777}



.comment-thread ol{margin:0 0 20px}



.comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a{color:#0011FF}



.comments .avatar-image-container,.comments .avatar-image-container img{width:48px;max-width:48px;height:48px;max-height:48px}



.comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single{margin-left:60px}



.comments .comment-block,.comments .comment-thread.inline-thread .comment{border:1px solid #ddd;background:#f9f9f9;padding:10px}



.comments .comments-content .comment{margin:15px 0 0;padding:0;width:100%;line-height:1em}



.comments .comments-content .icon.blog-author{position:absolute;top:-12px;right:-12px;margin:0;background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5DFiFkhXDxKRjfKag5hwRhpFnAX7l0XOuEA9Y0Qx-B11rv3PV0AALC8U8p-o0l126S9P9IP0z-81B2XO_g5-Ab5Ez6yZ2TO7F4cDmg0lc7TPbtllmi6pVUz1S3UGrGzU6g4N37b-Z1No/s320/red-author.png);width:36px;height:36px}



.comments .comments-content .inline-thread{padding:0 0 0 20px}



.comments .comments-content .comment-replies{margin-top:0}



.comments .comment-content{padding:5px 0;line-height:1.4em}



.comments .comment-thread.inline-thread{border-left:1px solid #ddd;background:transparent}



.comments .comment-thread.inline-thread .comment{width:auto}



.comments .comment-thread.inline-thread .comment:after{content:"";position:absolute;top:10px;left:-20px;border-top:1px solid #ddd;width:10px;height:0px}



.comments .comment-thread.inline-thread .comment .comment-block{border:0;background:transparent;padding:0}



.comments .comment-thread.inline-thread .comment-block{margin-left:48px}



.comments .comment-thread.inline-thread .user a{font-size:13px}



.comments .comment-thread.inline-thread .avatar-image-container,.comments .comment-thread.inline-thread .avatar-image-container img{width:36px;max-width:36px;height:36px;max-height:36px}



.comments .continue{border-top:0;width:100%}



.comments .continue a{padding:10px 0;text-align:center}



.comment .continue{display:none}



#comment-editor{width:100%!important}



.comment-form{width:100%;max-width:100%}

لتعديل خصائص الكود السابق غير ما باللون الأحمر

أما عن الكود الخاص بتمييز تعليقاتك فقط 

نفس الخطوات السابقة ولكن ضع هذا الكود بلاً من السابق

.comments .comments-content .icon.blog-author{position:absolute;top:-12px;left:-12px;margin:0;background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5DFiFkhXDxKRjfKag5hwRhpFnAX7l0XOuEA9Y0Qx-B11rv3PV0AALC8U8p-o0l126S9P9IP0z-81B2XO_g5-Ab5Ez6yZ2TO7F4cDmg0lc7TPbtllmi6pVUz1S3UGrGzU6g4N37b-Z1No/s320/red-author.png);width:36px;height:36px}

ملاحظة خاصة 

إذا أردت تغيير شارة الكاتب بما يناسب لون موقعك أختر من الشارات التالية

انسخ عنوان الصوره وضعة مكان الرابط باللون الأحمر

احفظ القالب بعد الإنتهاء  

  

الوسوم: تطوير بلوجر كل