How To Add A Comment Bubble Just Next To Blogger Post Titles

ဒီေန႔တင္တဲ့ ပုိ႔ေလးကေတာ့ ဘေလာ့ပုိ႔(စ္)ေခါင္းစဥ္မွာ ထုိပုိ႔(စ္)ရဲ႕ Comment  ဘယ္နွစ္ခုရွိလဲဆုိတာေလးကုိ ေဖာ္ျပေပးနုိင္တဲ့ Box / မွတ္စဥ္ ေလးထည့္နည္းေလးပါ။ က်ေနာ္တုိ႔ ျမန္မာ ဘေလာ့ေတြမွာေတာ့ သုံးတဲ့သူ မရွိသေလာက္ပါပဲ။ မႀကဳိက္ၾကတာလားေတာ့မသိပါ။ ႀကဳိက္တဲ့မိတ္ေဆြရွိခဲ့ရင္ ယူသုံးနုိင္ေအာင္တင္ေပးလုိက္တာပါ။ ေအာက္မွာ Demo သြားၾကည့္လုိ႔ရေအာင္ Link နွင့္ တကြ Cond ထည့္နည္းနဲ႔ Cond ကုိလည္းေပးထားပါတယ္။

၁။Sign In Blogger

၂။ Template
Cond ေပါင္းထည့္ရမွာ စိတ္မခ်ပါက Backup/Restore အရင္လုပ္ေပးသင့္ပါတယ္။
၃။ Edit HTMl

၄။ Proceed
Expand Widget Templates ကုိအမွန္ျခစ္ေပးလုိက္ပါ

၅။ ေအာက္က Cond ေလးကုိရွာပါ။Ctrl + F ကုိတြဲနုိပ္၍ရွာပါ ၊ ရွာရလြယ္ပါတယ္။

]]></b:skin>

၆။ ေတြ႕ၿပီးဆုိရင္ ]]></b:skin> ရဲ႕ အေပၚမွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။

.comment-bubble {

    float: right;

    width: 48px;

    height: 48px;

    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEKzOMY2s69s0hqon1NXxCkbJqCEj4zj5fqFA_hBDuwE3XKvErfk47YsZB7PMvI9dN2nq4G_SGxrLitnD5ChOgKDDc2wG2wfgsk8CI0VqUxVONnJpVrGluXB9TTQx2gNADAXEEcMhOWbpB/s1600/blue.png) no-repeat;

    font-size: 18px;

    float: right;

    margin-top: -15px;

    margin-right: 2px;

    text-align: center;

    position: float;

    text-align: center;
}

၇။ ေအာက္က Cond ကုိ ထပ္ရွာပါ။

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

၈။ ေအာက္က Cond နွင့္ လဲေပးပါ။  "(<b:if cond='data:post.link'> ကုိ ျဖဳတ္ၿပီး ထုိေနရာမွာ ေအာက္က Cond ကုိ အစာထုိးေပးပါ)"

<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'>

၉။ အားလုံးထည့္ၿပီးသြားရင္ Save Template ကုိ နုိပ္ေပးလုိက္ပါ။

မွတ္ခ်က္။  ။ https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEKzOMY2s69s0hqon1NXxCkbJqCEj4zj5fqFA_hBDuwE3XKvErfk47YsZB7PMvI9dN2nq4G_SGxrLitnD5ChOgKDDc2wG2wfgsk8CI0VqUxVONnJpVrGluXB9TTQx2gNADAXEEcMhOWbpB/s1600/blue.png  ဒီ Cond ကေတာ့ ပုံရဲ႕ Link ျဖစ္ပါတယ္။ ထုိေနရာမွာ မိမိႀကဳိက္တဲ့ ပုံ ရဲ႕ ေျပာင္းထည့္နုိင္ပါတယ္။ ေအာက္မွာ ပုံေတြကုိ က်ေနာ္ရနုိင္သေလာက္ စုစည္းေပးထားပါတယ္။ ပုံေပၚကုိ Mouse Pointer တင္ၿပီး Right ခ်လုိက္ပါ၊ ေပၚလာတဲ့ Message Box ထဲက Copy Image URL ကုိ ေရြးခ်ယ္ေပးလုိက္ပါ။