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

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

 _str = _str.replace(/f\(/gi, "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzkisCovFgq9smL3jXMWYz-QItVf8MaOqT0yNy7TsH5eMbXyDJduorJTbfrxZDYLepJgerIm6yTjajOHhlmWodsoie-ApbmmyUFpW4slO4n1vqA_JQ6AaObT3eJXpUQhnA0W8kKZ3Gneo/s1600/merci.jpg ' alt='' height='290' width='379'  class='smiley'/>");

*يمثل مالون بالأحمر  رمز الصورة, التي تكتب في التعليق
*يمثل مالون بالأزرق رابط الصورة المراد وضعها في تعليقك  .
*يمثل مالون بالأخضر قياسات الصورة المراد وضعها في تعليقك .

ولإضافتك لهذه الخاصية في مدونتك ،

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.

قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F ).

</body>

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

<script src='http://abu-iyad.googlecode.com/files/abuiyadSmileythanks4.js' type='text/javascript'/><noscript><a href='http://www.abu-iyad.com'>Onion</a><a href='http://www.abu-iyad.com'>smiley</a></noscript>

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

-بعد تطبيقك لللأداة ،الآن تحتاج للرموز لكي تكتبها في تعليقك وتظهر لك الصورة الموافقة لها .

هذا الجدول يبين كل صورة والرمز المطابق لها :

الصورة	الرمز	الصورة	الرمز
يتم كتابة الرموز من اليمين نحو اليسار لتظهر
	A(		B(
	C(		D(
	E(		F(

الآن سوف نتعرف على طريقة  تغيير الصور في حالة رغبتك في ذلك .

• الطريقة الأولي :

1.قم بتحميل الملف جافاسكريبت (وهو الرابط ذا اللون الأحمر في الكود السابق) من هنا
2.قم بفتح الملف بمحرر النصوص "وورد باد" .Wordpad
3.قم بالبحث عن أحد روابط الصور التي عرضناها سابقا (سوف تجد منه إثنين)
4.قم بإستبدالهما برابطين للصورة التي تريد،ولا تنسي تعديل قياسات الطول والعرض لتحافظ على جودة الصورة.
5.يمكنك كذلك تعديل رموز الصور بالرمز الذي تريد وهو ما لون باللون الأحمر في الكود الأول .
6.عند الإنتهاء من عملية التعديل علي الصور والرموز والقياسات ،قم برفع الملف على السرفر الخاص بك.(أفضل أن تقوم بتحميل الملف علي أحد الموقعين ،جوجل سايت أو جوجل كود)
7.قم بإعادة لصق رابط الملف الذي قمت بتحميله في الكود السابق مكان الرابط ذا اللون الأحمر .
8.قم بحفظ القالب ثم توجه للمعاينة

الطريقة الثانية :هذه الطريقة لا تحتاج رفع ملف الجافا سكريبت على السرفر الخاص بك
1.سوف تقوم بنفس خطوات الطريقة الأولى ،حتى المرحلة 5
2..توجه للكود الذي قمت بلصقه قبل الوسم <body/>،ثم قم بتحديده كاملا وإستبدله بهذا الكود ،ثم توجه للكود جافاسكريبت الذي عدلت عليه ثم حدده كاملا  ثم أضفه في المكان الخصص له في الكود أسفله.

<script type='text/javascript'>
//<![CDATA[

ألصق كود الجافاسكريبت هنا

//]]>
</script>

وأخيرا قم بحفظ القالب ،ومبروك عليك الصور في صندوق التعليقات ،أتمنى أن تنال إعجابكم.

Résuméabuiyad

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

• الطريقة الأولى :

سوف نقوم بعمل أيقونات على هذا الشكل و تكون فوق صندوق التعليقات

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.

قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F ).

<b:if cond='data:post.embedCommentForm'>

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

<div style='background:#FFFFFF; border:2px solid #EDEDED; display:block; padding: 1px 1px 1px 1px; margin: 1px 3px 1px 3px;text-align: center; direction:ltr; color:#ccc;'><b><img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger1.gif' width='30'/> :)<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger2.gif' width='30'/> =))<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger3.gif' width='30'/> :-T<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger4.gif' width='30'/> =((<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger5.gif' width='30'/> :-L<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger6.gif' width='30'/> b-(<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger7.gif' width='30'/> :)(<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger8.gif' width='30'/> ;))<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger9.gif' width='30'/> :(<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger10.gif' width='30'/> :x<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger11.gif' width='30'/> :z<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger12.gif' width='30'/> ;)<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger13.gif' width='30'/> :D<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger14.gif' width='30'/> :a<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger15.gif' width='30'/> :((<a href='http://wwww.leblogger.com' style='display:none;'>Blogger</a><img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger16.gif' width='30'/> x(<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger17.gif' width='30'/> ;;)<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger18.gif' width='30'/> =)(<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger19.gif' width='30'/> :p<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger20.gif' width='30'/> :))<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger21.gif' width='30'/> :-o<img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger22.gif' width='30'/> :-*<a href='http://www.leblogger.com/2009/11/onion-head-smileys-commentaire-messages.html' style='display:none;'>Blogger</a><img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger23.gif' width='30'/> 8-)<a href='http://www.leblogger.com/2009/06/smiley-emoticone-commentaire-blogger.html' style='display:none;'>Smiley</a><img border='0' height='30' src='http://lewordpress.com/Blogger/Image/Onion30/LeBlogger24.gif' width='30'/> 8-(</b></div>

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

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

</body>

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

<script src='http://leblogger.googlecode.com/files/LeBloggerOnions30.js' type='text/javascript'/><noscript><a href="http://www.leblogger.com/2009/11/onion-head-smileys-commentaire-messages.html">Onion</a><a href="http://www.leblogger.com">blogspot</a></noscript>

وأخيرا قم بحفظ القالب  .

• الطريقة الثانية :

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

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.

قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F ).

 <b:if cond='data:post.embedCommentForm'>

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

<div style='background:#F8F8FF; border:2px solid #F0F0F0; display:block; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;text-align:center; direction:ltr;  color:#FE6000;'><b>
<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2839%29.png' width='50'/> :))<a href='http://www.abu-iyad.com' style='display:none;'>Blogger</a><img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%282%29.png' width='50'/> ;))
<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2828%29.png' width='50'/> ;;)
<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2813%29.png' width='50'/> :D<a href='http://www.abu-iyad.com' style='display:none;'>Blogger</a><img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2835%29.png' width='50'/> ;)
<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%284%29.png' width='50'/> :p
<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2817%29.png' width='50'/> :((
<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64.png' width='50'/> :)
<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%286%29.png' width='50'/> :(<a href='http://www.abu-iyad.com' style='display:none;'>Smiley</a><img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2814%29.png' width='50'/> =((
<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2824%29.png' width='50'/> =))<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2821%29.png' width='50'/> :-*<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2820%29.png' width='50'/> :x<img border='0' height='50' src='https://sites.google.com/site/lightbox007/emoticon/64%2819%29.png' width='50'/> b-(<img border='0' height='50' src=' https://sites.google.com/site/lightbox007/emoticon/64%281%29.png' width='50'/>:-t<img border='0' height='50' src=' https://sites.google.com/site/lightbox007/emoticon/64%2822%29.png' width='50'/>8-}</b></div> 

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

</body>

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

<script src='http://abu-iyad.googlecode.com/files/abuiyadSmiley.js.txt' type='text/javascript'/><noscript><a href='http://www.abu-iyad.com/2010/12/blogger-onion-head-smileys.html'>Onion</a><a href='http://www.abu-iyad.com'>smiley</a></noscript>

وأخيرا قم بحفظ القالب  .

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

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.
 قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F ).

<b:if cond='data:comment.adminClass == data:post.adminClass'>
<dd class='blog-author-comment'>

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

<b:if cond='data:comment.author == data:post.author'>
<dd class='comment-body-author'>

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

.blog-author-comment {

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

.comment-body-author {

 وأخيرا قم بحفظ القالب  .

أتمنى أن تعجبكم كلتا الطريقتين ،فلكم حرية الإختيار ،في إنتظار آرائكم وإقتراحاتكم ،دمتم بود

Résuméabuiyad

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

إذا كانت مدونتك تتوفر على الأداة الخاصة بوضع صورة الملف الشخصي للمعلقين سوف تقوم بالخطوات التالية :
انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحرير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>

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

Résuméabuiyad

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

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

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

<iframe allowtransparency='true' class='blogger-iframe-colorize' frameborder='0' height='275' id='comment-editor' scrolling='no' src='' width='417'/>

قم بإستبدال مالون باللون الأحمر بالكلمة التالية:  scrolling='Auto' ،ثم قم بحفظ القالب.

الطريقة الثانية :
تمكننا هذه الطريقة من التحكم في طول صندوق التعليقات وذلك بتغير ما لون باللون الأزرق بالقيمة height='475' ثم قم بحفظ القالب.

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

Résuméabuiyad

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

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

</head>

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

<script language='javascript'>
function toggle() {
var ele = document.getElementById(&quot;toggleText&quot;);
var text = document.getElementById(&quot;displayText&quot;);
if(ele.style.display == &quot;block&quot;) {
ele.style.display = &quot;none&quot;;
text.innerHTML = &quot;<img alt='إظهار التعليقات' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiom3M4F0mxqDXRD0PihT2bzKtRVzt69ct5_fP6SAcNdcivQau7bNNR7YxWwd3Grp8BO8ijX_n4Jg0Yu1o06Iy9SEoPM1iPxR-sm4Rak0fGzdAnVFjTuZQW-N7y8K2YN3UF0ogD_Fl2e_s/s1600/cooltext470930301.png' title='إظهار التعليقات'/>&quot;;
}
else {
ele.style.display = &quot;block&quot;;
text.innerHTML = &quot;<img alt='إخفاء التعليقات' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKudbDjRw8uoED-TsZOS6gSpf_iX7H-2Ws0EkxLMu3dQaXktFDvQ2jre35Bv4U4Ds9CTDMi3vhy5WKCM4WQrkdtMrZc7HxUf5dOrJgHJohooMOj5NXqHzcqpelFGkokNsGo7A423l0d2c/s1600/cooltext470930319.png' title='إخفاء التعليقات'/>&quot;;
}
}
</script>

حيث يمثل الرابط ذا اللون الأزرق صورة الزر "إظهار التعليقات" و الرابط ذا اللون  الأحمر صورة الزر" إخفاء التعليقات "

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

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

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

<a href='javascript:toggle();' id='displayText'><img alt='إظهار التعليقات' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZxQwdu1p_-PUFbNQMVNjqy2XpvGa8KXtoaHaqEFe3JApUzQ_-ERAHHKGTORTznO79f2zic_0lWlySF-F6goXhWL0Et1WAnKiRGdkCpfLA_h_VxH8U3UFRKemERlNRqN2CVvWfUMYhNbU/s1600/cooltext470930250.png' title='إظهار التعليقات'/></a>
<div id='toggleText' style='display: none;'>

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

<b:include data='comment' name='commentDeleteIcon'/>

 </span>

</dd>

</b:loop>

</dl>

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

</div>

وأخيرا قم بحفظ القالب،وتوجه للمعاينة

ولأي إستفسار ،الموجوا وضع تعليقاتكم للإجابة عليها في أقرب وقت ممكن.

Résuméabuiyad

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

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

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

<data:commentPostedByMsg/>

ثم ضع مباشرة تحته هذا الكود :

<span><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=11111111&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0 ,scrollbars=yes,width=450,height=450&quot;); return false;'>
<img src='http://hitskin.com/themes/14/77/83/i_reply.jpg'/></a></span>

1. مع إدراج رقم تعريف المدونة الذي حصلنا عليه في المرحلة الأولى مكان الرقم 11111111في الكود
2. يمكنك إختيار أحد الأزرار التالية وتعويضها بالرابط ذا اللون الأزرق وذلك بعمل كليك يمين على أحد الأزرار التالية ثم نسخ رابط الصورة

ولأي إستفسار المرجو ترك تعليقاتكم لأقوم بالإجابة عليها في القريب العاجل

Résuméabuiyad

السلام عليكم ورحمة الله تعالى وبركاته في هذه الفقرة ،سوف نتعلم كيفية إستبدال كلمة " إرسال تعليق " بصورة أو بكلمة أخرى أو هما معا وتوجد هذه الكلمة فوق مستطيل التعليقات للمدونة ،فهناك بعض المدونات يجعل موضع نموذج التعليق عبارة عن نافذة منبثقة مما يجعل كلمة " إرسال تعليق " غير مرئية للزائر في بعض الأحيان .
انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F).

<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>

وإبحث عن هذا الكود أيضا :

<h4 id='comment-post-message'><data:postCommentMsg/></h4>

والآن ما عليك سوى إستبدال ما لون بالأحمر في الكودين معا بما تريد :

• إستبدال " إرسال تعليق " بنص مثلا : أضف تعليقك،أضف رد،أضف إستفسار...

• إستبدال " إرسال تعليق " بصورة :

<img src="https://sites.google.com/site/lightbox007/photo/addcommentblogger.png" title="أضف تعليق" alt="أضف تعليق"/>

• إستبدال " إرسال تعليق " بصورة ونص معا

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhI1kGYR3OL-qDMgGHl0bTFW2YAEt6noAKLBU_6EqEterIJ1_aHBWOH0IIxV-4TrTbcpyRo58Xdcsmg1vcqLlNzg8HPexnkpN-nIH9gyhQWg7yrXXdaITw9p8-r-nvtDUToopZKQnbCvMg/s320/comments_new.jpeg' alt='Commentaires' title="Commentaires" />أضف تعليقك

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

والآن قم بحفظ القالب وتوجه لمعاينة النتيجة فوق مسيطيل التعليقات

Résuméabuiyad

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


إلا أن هناك طريقة بسيطة لتفعيل هذه الخاصية بصفة مؤقتة و الذي إكتشفها الأخ الكريم سفيان حتى يتم تعميمها على جميع المدونات.
أولا وقبل كل شييء ،لنكتشف ماهي هذه الخاصية و ما مدى فعاليتها على مدونات بلوجر

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

والآن لتفعيل هذه الخاصية على المدونة بصفة مؤقتة للإشراف على التعليقات
من لوحة التحكم الرئيسية –> إعدادات —> تعليقات –> الإشراف على التعليقات—> إختر "دائما" ولا تنسى إدخال بريدك الإلكتروني في المستطيل أسفله لإستقبال التعليقات الجديد .والآن تم تفعيل هذه الخاصية على مدونتك ويمكنك المعاينة حيث سوف يتم إضافة "تعليقات" بين إرسال و إعدادات

Résuméabuiyad

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

انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم. قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F).

]]></b:skin>

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

.comment-bubble { float : left; width : 48px; height : 48px; background : url(http://www.yasour.org/images/comment.jpg) no-repeat; font-size : 18px; margin-top : -15px; margin-right : 2px; text-align : center; padding:0px 0px 0px 0px; /*for more hacks : http://abu-iyad.blogspot.com/ */ }

الآن قم بالبحث على هذا الكود ثم أضف ما لون باللون الأحمر :

<b:includable id='post' var='post'>
<div class='post hentry uncustomized-post-template'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'><b:if cond='data:post.allowComments'>
<a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a>
</b:if>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

أتمنى أن تنال إعجابكم في إنتظار تشجيعاتكم

Résuméabuiyad