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

12:04 م

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

إذا كانت مدونتك تتوفر على الأداة الخاصة بوضع صورة الملف الشخصي للمعلقين سوف تقوم بالخطوات التالية :
انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرhtml, ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.قم بالبحث عن الكود التالي :

]]</b:skin>

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

.avatar-image-container {
background:url(http://www.gstatic.com/s2/profiles/images/silhouette64.png) no-repeat;
width:64px !important;
height:64px !important;
}
.avatar-image-container  img {
    width:64px !important;
    height:64px !important;  
    border: 1px solid #cfcfcf;
    display: block;
    margin: 0 0 .8em;
}

ثم قم بحفظ القالب .

ملاحظة : الرابط ذا اللون الأزرق يمثل صورة الشخص المخفي ، حيث أن قياسها هو 64*64 فإذا أردت تغير الصورة بقياسات أخرى لا تنسى تغير القيم ذات اللون الأحمر بقياس الصورة المراد وضعها .

أما إذا كانت مدونتك لا تتوفر على الأداة الخاصة بوضع صورة الملف الشخصي للمعلقين سوف تقوم بزيادة  الخطوات التالية :
انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرhtml, ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.قم بالبحث عن الكود التالي :

<dl id='comments-block'>

فإن لم تجده ، قم بالبحث عن الكود التالي :

<div id='comments-block'>

ثم قم بإستبدال أحد الأكواد الذي وجدتها بالكود التالي :

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

 الآن قم بالبحث عن الكود التالي :

<a expr:name='data:comment.anchorName'/>

ثم قم بإستبداله بالكود التالي :

<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='35px' style='margin-bottom:-2px;' width='35px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<div expr:class='data:comment.avatarContainerClass'>
<data:comment.authorAvatarImage/>
</div>
</b:if>

أتمنى أن تكونو قد إستفدتم من هذا الدرس ،في إنتظار إستفساراتكم دمتم بألف خير