- မူရင္းစာမ်က္ႏွာ »
- Blog Blog HTML »
- မိမိရဲ့ဘေလာ႔Comment အေရအတြက္ Bubble Icon ေလးနဲ႕ေပၚေစခ်င္ရင္
ေရးသားသူ : Christ Leo
Tuesday, July 26, 2016
မိမိရဲ႕ဘေလာ့Postတခုစီရဲ႕အေပၚမွာ Comment အေရအတြက္ Bubble Icon ေလးနဲ႕ေပၚ
ေအာင္လုပ္တဲ့နည္းေလးပါ၊တခ်ိဳ႕Template မွာၾကေတာ့ Autoပါလာတယ္၊ထည့္နည္းေလးကေတာ့
ေအာက္မွာပံုနဲ႕တကြ Code
၁။ Layoutနိုပ္ပါ၊
၂။ edit HTMLထပ္နို္ပ္ပါ၊
၂။ edit HTMLထပ္နို္ပ္ပါ၊

၃။Expand Widget Templatesကိုအမွန္ျခစ္ေပးပါ၊

ေအာက္က Code ကိုရွာပါ
]]></b:skin>
ေတြ႕ျပီဆိုရင္အေပၚမွာcssေနရာမွာေအာက္ကစာေတြထည့္လိုက္ပါ
.comment-bubble {
float : right;
width : 48px;
height : 48px;
background : url(http://i43.tinypic.com/dljpzo.jpg) no-repeat;
font-size : 18px;
margin-top : -15px;
margin-right : 2px;
text-align : center;
position:absolute;
}
cssေနရာမွာထားျပီးသြားျပီဆိုရင္
ေအာက္ကCodeကိုထပ္ရွာျပီးေတြ႕ျပီဆိုရင္ေအာက္မွာေတြ႕ျမင္ရသည့္အတိုင္း
အနီ ေရာင္ Code ေတြကိုထပ္ျဖည့္ေပးလိုက္ပါ
<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>
]]></b:skin>
ေတြ႕ျပီဆိုရင္အေပၚမွာcssေနရာမွာေအာက္ကစာေတြထည့္လိုက္ပါ
.comment-bubble {
float : right;
width : 48px;
height : 48px;
background : url(http://i43.tinypic.com/dljpzo.jpg) no-repeat;
font-size : 18px;
margin-top : -15px;
margin-right : 2px;
text-align : center;
position:absolute;
}
cssေနရာမွာထားျပီးသြားျပီဆိုရင္
ေအာက္ကCodeကိုထပ္ရွာျပီးေတြ႕ျပီဆိုရင္ေအာက္မွာေတြ႕ျမင္ရသည့္အတိုင္း
အနီ ေရာင္ Code ေတြကိုထပ္ျဖည့္ေပးလိုက္ပါ
<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>

၄။Save Template button.ႏိုပ္ပါ ၿပီးပါၿပီ။
အျခားPostမ်ားၾကည့္လိုပါကအေပၚက Menu မွာၾကည့္လို႔ရပါတယ္ေနာ္
ကၽြန္ေတာ္ပိုင္ေနရာေလးမ်ား
ေရာင္ျပန္ေလးစာေပသို႔ဒီမွာသြားပါ
18+တို႔ဆံုဆည္းရာသို႔ဒီမွာသြားပါ
****အဆင္မေျပမႈ႔တစ္စံုတစ္ရာရွိပါက****
Facebook Account ျဖစ္တဲ႔
ေအာက္ပါပံုေလးကိုႏွိပ္ျပီးေ၀ဖန္အၾကံေပးႏိုင္ပါတယ္