ပို႔စ္ေရးသူ၏ Comment မ်ားအား သိသာေစျခင္း

က်ေနာ္တို႔ ပို႔စ္ေတြ ေရးတဲ့အခါမွာ ဘယ္သူမဆို ကိုယ့္ပို႔စ္ကို ကြန္းမန္႔ေပးတာ လိုလားၾကပါတယ္။ ကြန္းမန္႔ေလး တစ္ခု ၀င္လာၿပီ ဆိုရင္ကို ေပ်ာ္မဆံုးပါ။ တခါတေလက်ေတာ့ က်ေနာ္တို႔ ကြန္းမန္႔ကေန ေမးခြန္းေမးၿပီး စာေရးသူဟာ ဒီေနရာကေနပဲ စာျပန္ရတာ၊ ျပႆနာ ေျဖရွင္းရတဲ့ အခ်ိန္ေတြလည္း ရွိပါတယ္။ ဒါေၾကာင့္ ကြန္႔မန္းေတြထဲမွာ စာေရးသူ ကိုယ္တိုင္ ေရးထားတဲ့ ကြန္းမန္႔ေတြလည္း ပါ၀င္ႏိုင္ပါတယ္။ အခု က်ေနာ္ ဒီပို႔စ္မွာ ေဆြးေႏြးခ်င္တာက ပို႔စ္ေတြရဲ႕ ကြန္းမန္႔မွာ စာေရးသူရဲ႕ ကြန္းမန္႔နဲ႔ တျခားသူရဲ႕ ကြန္းမန္႔ေတြကို ကြဲကြဲျပားျပား ျမင္ႏိုင္ေအာင္ ဘယ္လို လုပ္မလဲ ဆိုတာပါ။ အခု ဒီပို႔စ္မွာ ပါတဲ့ လုပ္ေဆာင္ခ်က္ေတြဟာ Blogger Commenting Service သံုးထားတဲ့ သူေတြ အတြက္ပဲ သက္ဆိုင္ပါတယ္။

ေနာက္ၿပီး ဒီပို႔စ္မွာပဲ ကြန္းမန္႔ေတြကို နံပါတ္စဥ္ တပ္ဖုိ႔ပါ တခါတည္း လုပ္ေပးထားပါတယ္။ တကယ္လို႔ စာေရးသူ ကြန္းမန္႔ကို HighLight မလုပ္ခ်င္ဘဲ နံပါတ္စဥ္တပ္႐ံု သက္သက္ပဲ လုပ္ခ်င္တယ္ ဆိုရင္ေတာ့ ဒီမွာ သြားဖတ္ပါ။ အခု ဒီပို႔စ္က ေျပာထားတဲ့ အတိုင္း လုပ္လုိက္ရင္ေတာ့ နံပါတ္စဥ္ တပ္ၿပီးသား ျဖစ္သလို စာေရးသူ ကြန္းမန္႔ကိုလည္း Highlight လုပ္ၿပီးသား ရပါလိမ့္မယ္။ ကဲ ... က်ေနာ္တို႔ ေလ့က်င့္ခန္း စဖို႔ Layout >> Edit HTML ကို ဖြင့္ၿပီး Expand Widget Templates ကို အမွန္ျခစ္ ျခစ္ေပးပါဗ်ာ။

အဆင့္ (၁) စတိုင္ သက္မွတ္ျခင္း

ဒါက နံပါတ္စဥ္ ေပၚဖို႔ အတြက္ CSS ပါ။
<br />.numberingcomments{<br />float: right;<br />display: block;<br />width: 50px;<br />margin-right: 5px;<br />margin-top: -25px; /*comments-counter position*/<br />text-align: right;<br />font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;<br />font-size: 30px;<br />font-weight: normal;<br />}<br /><br />/*since the numbers are actually links, we need to force the color properties*/<br /><br />.numberingcomments a:link, .numberingcomments a:visited {<br />color: #445566 !important; text-decoration: none !important;<br />}<br />.numberingcomments a:hover, .numberingcomments a:active {<br />color: #FF9933 !important; text-decoration: none !important;<br />}

ဒါကေတာ့ စာေရးသူ ကြန္႔မန္႔ကို Highlight လုပ္ဖို႔ အတြက္ CSS ပါ။ .comment-author ကို ရွာေပးပါ။ တခါတေလမွာ .author-comment လို႔ ျဖစ္ေနတတ္သလို တခါတေလမွာ .comments-author လုိ႔ ျဖစ္ေနတတ္ပါတယ္။ ေတြ႕ၿပီဆိုရင္ color:#CC3300; background: #EEEEEE; ကို } မဆံုးခင္မွာ ထည့္ေပးပါ။ တကယ္လို႔ မေတြ႕ခဲ့ဘူး ဆိုရင္ေတာ့ ေအာက္က CSS Code ကို ကူးထည့္ေပးပါ။

<br />.comments-author {<br />background: #EEEEEE;<br />color: #CC3300;<br />padding: 5px;<br />}

အထက္ CSS ေတြကို Style Sheet မွာ သြားထည့္ေပးပါ။<b:skin><![CDATA[ နဲ႔ ]]></b:skin> ၾကားလို႔ Style Sheet လုိ႔ ေခၚပါတယ္။ သူတို႔ရဲ႕ ၾကား တစ္ေနရာရာမွာ အထက္က CSS ကို ထည့္ေပးပါ။ background နဲ႔ color ကို ကိုယ္ႀကိဳက္တဲ့ အေရာင္ ေျပာင္းထည့္ႏိုင္ပါတယ္။ ကာလာ နံပါတ္ မသိရင္ ဒီမွာ သြားၾကည့္ပါ။

အဆင့္ (၂) Widget တြင္ ျပင္ဆင္ ျဖည့္စြပ္ျခင္း

<b:includable id='comments' var='post'> ကို ရွာေပးပါ။ သူနဲ႔ မနီးမေ၀းမွာ <dl id='comments-block'> နဲ႔ စတဲ့ စာပိုဒ္ ရွိပါတယ္။ ေအာက္က စာပိုဒ္နဲ႔ အနီးစပ္ဆံုး ခပ္ဆင္ဆင္ ရွိပါလိမ့္မယ္။
<br /><dl id='comments-block'><br /><b:loop values='data:post.comments' var='comment'><br /><dt class='comment-author' expr:id='data:comment.anchorName'><br /><a expr:name='data:comment.anchorName'/><br /><b:if cond='data:comment.authorUrl'><br /><a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a><br /><b:else/><br /><data:comment.author/><br /></b:if><br /><data:commentPostedByMsg/><br /></dt><br /><dd class='comment-body'><br /><b:if cond='data:comment.isDeleted'><br /><span class='deleted-comment'><data:comment.body/></span><br /><b:else/><br /><p><data:comment.body/></p><br /></b:if><br /></dd><br /><dd class='comment-footer'><br /><span class='comment-timestamp'><br /><a expr:href='data:comment.url' title='comment permalink'><br /><data:comment.timestamp/><br /></a><br /><b:include data='comment' name='commentDeleteIcon'/><br /></span><br /></dd><br /></b:loop><br /></dl>
ေတြ႕ၿပီ ဆုိရင္ေတာ့ အဲဒီ စာတစ္ပိုဒ္လံုးကို ေအာက္မွာ ျပထားတဲ့ Code နဲ႔ အစားထုိးေပးပါ။
<br /><ul class='commentlist' style='margin: 0; padding: 0;'><br /><script type='text/javascript'>var CommentsCounter=0;</script><br /><b:loop values='data:post.comments' var='comment'><br /><div class='' expr:id='data:comment.id'><br /><b:if cond='data:comment.author == data:post.author'><br /><br /><li class='comments-author' style='margin: 0 0 10px 0;'><br /><b:if cond='data:post.dateHeader'><br /><div class='commentcount'/><br /></b:if><br /><cite><br /><b:if cond='data:comment.authorUrl'><br /><a expr:href='data:comment.authorUrl'><data:comment.author/></a><br /><b:else/><br /><data:comment.author/><br /></b:if><br /></cite><br /><span class='numberingcomments'><br /><a expr:href='"#comment-" + data:comment.id' title='Comment Link'><br /><script type='text/javascript'><br />CommentsCounter=CommentsCounter+1;<br />document.write(CommentsCounter)<br /></script><br /></a><br /></span><br /><br/><br /><div style='clear: both;'/><br /><b:include data='comment' name='commentDeleteIcon'/><br /><p><data:comment.body/></p><br /><div class='commentlink-date'><a class='commentlink' expr:href='"#comment-" + data:comment.id' title='comment permalink'><br /><data:comment.timestamp/><br /></a></div><br /><br /><div class='clear'/><br /><br /></li><br /><br /><b:else/><br /><br /><li class='general-comments' style='margin: 0 0 10px 0;'><br /><b:if cond='data:post.dateHeader'><br /><div class='commentcount'/><br /></b:if><br /><cite><br /><b:if cond='data:comment.authorUrl'><br /><a expr:href='data:comment.authorUrl'><data:comment.author/></a><br /><b:else/><br /><data:comment.author/><br /></b:if><br /></cite><br /><span class='numberingcomments'><br /><a expr:href='"#comment-" + data:comment.id' title='Comment Link'><br /><script type='text/javascript'><br />CommentsCounter=CommentsCounter+1;<br />document.write(CommentsCounter)<br /></script><br /></a><br /></span><br /><br/><br /><div style='clear: both;'/><br /><b:include data='comment' name='commentDeleteIcon'/><br /><p><data:comment.body/></p><br /><div class='commentlink-date'><a class='commentlink' expr:href='"#comment-" + data:comment.id' title='comment permalink'><br /><br /><data:comment.timestamp/><br /></a></div><br /><div class='clear'/><br /></li><br /><br /></b:if><br /></div><br /></b:loop><br /></ul>
ဟုတ္ကဲ့။ ၿပီးၿပီ ဆိုရင္ေတာ့ Template ကို Save လုပ္လိုက္ပါ။ က်ေနာ္တို႔ လိုခ်င္တာ လုပ္လို႔ ၿပီးပါၿပီ။ တစ္ခ်က္ေလာက္ ဘေလာ့ဂ္ကို ေခၚၾကည့္ပါဦး။ အဆင္ေျပပါေစဗ်ာ။