ဘေလာ့ Comment ေတြကို နံပါတ္စဥ္တပ္မယ္

ကိုယ့္ဘေလာ့မွာ comment ေပးသြားတဲ့ သူေတြကို နံပါတ္စဥ္ တပ္လို႔ ရပါတယ္။ အဲဒီလို တပ္လိုက္ျခင္းအားျဖင့္ ပို႔စ္ တစ္ခုခ်င္းစီမွာ ဘယ္သူက အရင္ comment ေပးသြားတယ္ဆိုတာ အလြယ္တကူ သိႏိုင္သလို comment အေရအတြက္ ဘယ္ေလာက္ ရွိသြားၿပီ ဆိုတာလည္း သိႏိုင္ပါတယ္။ ဒီပံုထဲကလိုမ်ိဳးေလးေပါ့....

အဲဒီ widget ေလးကို ဘယ္လိုထည့္မလဲ။ blogger.com ကိုေတာ့ မျဖစ္မေန sign in ၀င္ရမွာေပါ့ဗ်ာ.. ၿပီးရင္ Layout ထဲက Edit HTML ကိုသြားရပါမယ္။ ၿပီးရင္ Expand Widgets ကို ကလစ္ေပးခဲ့ပါ။ ေအာက္မွာ ျပထားတဲ့ code ေတြ အတိုင္း အနီေရာင္နဲ႔ ျပထားတဲ့ code ေတြကို ထပ္ျဖည့္ေပးရမွာ ျဖစ္ပါတယ္။ ကဲ လိုက္ၾကည့္ရေအာင္

<dl id='comments-block'>

<script type='text/javascript'>var CommentsCounter=0;</script>

<b:loop values='data:post.comments' var='comment'>

<div class='' expr:id='data:comment.id'>

<dt expr:class='"comment-author " data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>

<span class='comment-number'>

<a expr:href='"#comment-" data:comment.id' title='Comment Link'>

<script type='text/javascript'>

CommentsCounter=CommentsCounter 1;

document.write(CommentsCounter)

</script>

</a>

</span>

</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>

</div>

</b:loop>
</dl>

အဲလို code ေတြကို ထပ္ျဖည့္ၿပီးၿပီဆိုရင္ေတာ့ save ေပးလိုက္ပါ။ ၿပီးရင္ Ctrl+F နဲ႔ ]]></b:skin> ကို ရွာၿပီး ေအာက္က code ေတြကို သူ႔ရဲ႕ အေပၚမွ ထည့္ေပးရပါမယ္။ အနီေရာင္နဲ႔ ျပထားတဲ့ background image ကို ကိုယ့္စိတ္ႀကိဳက္ ျပဳျပင္ႏိုင္ပါတယ္။

.comment-number {
float: right;
background: url(http://i40.tinypic.com/14tmp9e.jpg) no-repeat;
width:50px;
height:50px;
margin-right: 15px;
margin-top: -35px; /*comments-counter position*/
text-align: center;
font-family: 'Century Gothic','Lucida Grande',Arial,Helvetica,Sans-Serif;
font-size: 18px;
font-weight: bold;
}

/*since the numbers are actually links, we need to force the color properties*/

.comment-number a:link, .comment-number a:visited {
color: #445566 !important;
text-decoration: none !important;
}
.comment-number a:hover, .comment-number a:active {
color: #FF9933 !important;
text-decoration: none !important;
}

]]></b:skin> ရဲ႕အေပၚမွာ ထည့္ၿပီး ရင္ေတာ့ save ေပးလိုက္ပါ။ ဒါဆိုရင္ေတာ့ Comment မွာ Number ထည့္ပံုေလး ၿပီးသြားပါၿပီ။ အဆင္မေျပရင္ပဲ ျဖစ္ျဖစ္ ၊ မွားေနရင္ပဲ ျဖစ္ျဖစ္ comment ေပးသြားၾကပါ။ ေက်းဇူးတင္ပါတယ္။

Ref: www.anshuldudeja.com

Posted in: Blog ဆုိင္ရာနည္းပညာ,ကုဒ္မ်ား