لتميز تعليقاتك عن تعليقات الزوار

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

اخوانى قراء مدونه العبور استكمالا لموضوعاتنا عن التدوين وبعد موضوع كيفيه تغير قالب المدونه  نبدا اليوم بدرس جديد وهو كيفيه  تميز تعليقات صاحب المدونه عن تعليقات الاصدقاء وهو موضوع جيد يهم الكثير من المدونين ولكى لا اطيل فى الكلام

نبدأ الشرح:

الخطوة الاولى : نذهب الى قائمة ( تخطيط ) ثم ( تحرير HTML ) ثم نقوم بتوسيع القالب . انظر الصورة :

اضغط الصورة لتكبر

الخطوة الثانية : نقوم بالبحث ( CTRL+F ) عن الكود التالي :

]]>

ثم نضع فوقه مباشرة هذا الكود :

.author-comments {
background: #99C9FF;
border: 3px solid #99C9FF;
padding: 5px;

* اللون الاحمر الذي في الكود يمثل لون خلفية التعليقات ، فهو الان عبارة عن لون بخلفية ازرق قم بتغييره اذا شئت .
* اللون الازرق في الكود يمثل لون الاطار المحيط بالتعليق . قم بتغييره اذا شئت .
* اللون الاخضر في الكود يمثل عرض اطار تعليقاتك بالمدونة . قم بتغيير العرض اذا شئت .



الخطوة الثالثة : نقوم بالبحث الكود التالي :

ثم نضع فوقه الكود التالي مباشرة :

ثم نبحث عن الكود هذا :

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

خلاصة الشرح :

يعني باختصار لاحظ معي كيف قمنا بعمل الخطوة الثالثة : الكود الذي ( باللون الاسود ) طبعا موجود من سابق في المدونة ولكن الكود الذي ( باللون الاحمر ) هو الذي قمنا باظافته في المدونة حتى تمييز التعليقات في مدوناتنا عن غيرنا من الزوار الآخرين :

ثم نقوم بالضغط على زر حفظ ومبروك عليك ،،،،

تكبير حجم خط التعليقات 

نقوم بالبحث عن ( COMMENTS ) وبعدها ندور ونبحث في الاكواد بتاعها حتى نلاقي الكود التالي :

#comments-block {
margin: 1em 0 1.5em;
line-height: 1.3em;

ثم نضيف لها كود حجم الخط كالتالي :

font-size: 150%;

اللون الاحمر هو حجم الخط قم بتغيير اذا شئت

خلاصة الشرح : 

انظر النتيجة كيف صار الكود بعد اضافة له كود حجم الخط : طبعا الكود ذو الكتابة الاسود موجود مسبقاً ولكن ماقمنا بتغييره هو الكود ذو اللون الاحمر :

/* Comments
----------------------------------------------- */
#comments h4 {
margin: 1em 0;
color: $dateHeaderColor;
}
#comments h4 strong {
font-size: 160%;
}
#comments-block {
margin: 1em 0 1.5em;
line-height: 1.3em;
font-size: 150%;
}
#comments-block dt {
margin: .5em 0;
}
#comments-block dd {
margin: .25em 0 0;
}
#comments-block dd.comment-footer {
margin: -.25em 0 2em;
line-height: 1.4em;
font-size: 100%;
}
#comments-block dd p {
margin: 0 0 .75em;
}

.deleted-comment {
font-style:italic;
color:gray;
}

.feed-links {
clear: both;
line-height: 2.5em;
}

#blog-pager-newer-link {
float: $startSide;
}

#blog-pager-older-link {
float: $endSide;
}

#blog-pager {
text-align: center;
}

/* Sidebar Content
----------------------------------------------- */

* اللون الاخضر : الكود الذي نبحث عنه علشان نقوم بتكبير الخط
* اللون الاحمر : الكود الذي قمنا باضافته ( كود حجم الخط )

اتمنى ان الموضوع يفيدكم ولا اريد منكم سوى الدعاء والتعليقات الجيده