kp3နည္းပညာ၊၁၇၆၊ဘေလာ့ Comment ေတြကိုလွပစြာပိုင္းျခားနည္း

ဒီေန႕ Post ေလးကေတာ့သိပ္လည္းအေ၇းေတာ့အၾကီးပါဘူး၊ဒါေပမယ့္မိမိ၇ဲ႕ Comment ေန၇ာေလးကၾကည့္၇ တာ ပိုျပီးလွလာသလိုဘဲေနာ္၊ေအာက္မွာနမူနာၾကည့္လို႕၇ေအာင္ပံု ေလးျပထားေပးပါတယ္၊မိမိရဲ႕ Comment ေတြကိုသပ္သပ္၇ပ္၇ပ္ေလးျဖစ္သြားပါတယ္၊မိမိရဲ႕ဘေလာ့ Comments Box ေလးကိုတကယ့္လွပ ေအာင္လုပ္ ခ်င္၇င္ေတာ့kp3နည္းပညာ၊၁၄၇၊မွာရိွပါတယ္။ေအာက္ပံုနဲ႕တကြ Code

၁။Layout

၂။Edit HTML

 

ေအာက္က Code ကိုရွာပါ၊

/* Comments
----------------------------------------------- */
#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color: $sidebarcolor;
}

#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;
}
#comments-block .comment-author {
margin:.5em 0;
}
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}
.deleted-comment {
font-style:italic;
color:gray;
}

အေပၚက Codeအားလံုးႏွင့္တူခ်င္မတူမွာပါ

ေတြ႕ျပီဆိုရင္ေအာက္က Code ႏွင့္အစားထိုးေပးလိုက္ပါ။။

/* Comments
----------------------------------------------- */

.comment-form {
margin-left:.5em;}

.comments {
margin-left:.5em;}

#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color: #0B486B;
}

#comments-block {
font-size:13px; color:#333333;
}
#comments-block .comment-author {
color:#53524b;
font-size:12px;
background:#d7e8f0;
padding:4px;
font-weight:bold;
text-decoration:none;
}
#comments-block .comment-author a:link, .comment-author a:visited, .comment-author a:hover {
font-weight:bold;
color:#53524b;
border-bottom:solid 1px #80a8ba;
padding-bottom:2px;
text-decoration:none;
}

dd{margin:0; border:0; padding:0; padding:0 10px; background:#f5f8fa;}
dd.comment-body{border:solid 2px #d7e8f0; border-bottom:none; border-top:none;}
dd.comment-body p{border:0; padding:0; margin:0; padding:10px 0;}
dd.comment-footer{border:solid 2px #d7e8f0; border-top:none; margin-bottom:10px;}

#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}

.comment-timestamp{font-size:11px; color:#333333;}
.comment-timestamp a:link, .comment-timestamp a:visited {
font-size:11px; color:#999999; background:none; width:auto; height:auto;
text-align:left; font-weight:normal;}


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

အေ၇ာင္ေတြကိုမိမိၾကိဳက္သလို HTML colourနဲ႕အစားထိုးေပးလို႕၇ပါတယ္။


၃။Save Template ကိုႏိုပ္ပါ။ျပီးပါျပီ။။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

Related Post

Posted in: BLOGGER TIPS, BLOGGER TUTORIAL