Friday, February 7, 2014

post author, date, labels and comments ေတြကို ပုံေလးေတြနဲ႕ အလွဆင္မယ္

ဒါေလးကေတာ့ ဘေလာ့တစ္ခုအတြက္ အလွဆင္တဲ့ နည္းေလးျဖစ္သလို  မရွိမျဖစ္လဲ လိုအပ္ပါတယ္.. ဘေလာ့ေတြမွာ title ခ်ည္းသီးသန္႕ ဆိုၾကည့္ရတာ ဟာတာတာ နဲ႕ျဖစ္ေနေပမယ့္
သူ႕ေအာက္က စာေရးသူ-ေန႕စြဲ-အမ်ိဳးအစား- ကြန္မက္ စတဲ့ အိုင္ကြန္ေလးေတြ တပ္ေပးလိုက္ရင္
ၾကည့္ရတာ လွသြားးသလို ဘေလာ့ကိုလဲ ထည္၀ါေစပါတယ္...ဒါေၾကာင့္..
အဲနည္းေလးကို တင္ေပးလိုက္ပါတယ္... အရင္ကလဲ တစ္ခု တင္ေပးထားတာ ရွိပါတယ္...
ဒါကေတာ့ ေနာက္တနည္းေပါ့...




(1)-    ဘေလာ့ကာ၀င္ပါ  Dashboard > Template> Edit HTML  အစဥ္လုိက္သြားလိုက္ပါ။
(3)-    Ctrl + F  အကူညီျဖင့္ ေအာက္ကကုဒ္ကို ရွာလိုက္ပါ။


<div class='post-header-line-1'>
အကယ္လို႕ အေပၚကကုဒ္ရွာ မေတြ႕ခဲ့ပါက ေအာက္က ကုဒ္ကိုရွာၾကည့္ပါ
    <div class='post-header'>

(4. )  ေတြ႕ျပီဆိုတာနဲ႕ ေအာက္ကေပးထားတဲ့ ကုဒ္ေတြကို အေပၚကေန ထည့္ေပးလိုက္ပါ..

<font style='background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgON9xHXgSSSfAhZupoEpnvtIJFleUf87EBeuswDrM4JhsCUBIBVPJjWNDsu9FSIbL5r4f-T_n0wzhZK_vrire5nvkMSUmpym9gbvZ1y5PpnWxoOwTe6Q2XD0xvwpC-TGMDoPIK_OhlmTaL/s1600/author.gif) no-repeat scroll top left;padding-left:25px;font-size:11px;'><data:post.author/></font> | <font style='background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZi6YqHcwVmw-YtN00tZquDpCceCXc3brIUDT0Q5CR2cQdn4Nk4vCJhWI7F8BggARXlQ4_RBANN2ZDnlqLW0uRUnBG_cVpVEYbeu0twL7kW4E3Sd182mOpswdCFlbVrNc8fVyjIbxtFaOo/s1600/clock_icon.gif) no-repeat scroll top left;padding-left:25px;font-size:11px;'><data:post.timestamp/></font> | <font style='background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOIJ44lGYiJbV-IhcozwYVFHW_7LBk0XEn_9iAKhaOSDAUsDqNCffdxOj8MmIq6_78BDDgPAoj_787ejDPXtjqkI0dsgsh2tlvbRBfp8ov-XtYNYl7MqmqR0OFR7hjY1erfgVVqb0SgHcs/s1600/tag+icon.gif) no-repeat scroll top left;padding-left:25px;font-size:11px;'><b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url + &quot;?max-results=8&quot;' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'>|</b:if>
</b:loop>
</b:if></font>
<span class='post-comment-link' style='Float:right;'>
        <b:if cond='data:blog.pageType != &quot;item&quot;'>
          <b:if cond='data:post.allowComments'>
            <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' style='background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkhB95pJj0GZYOIOJr2oXVyX5sBt0GtQj6BJD5b9NBYjYjfXrZCBObdejhBByMkOK6Zgp5fz5nvdGCrYhs0guhcEHWqm2FdUs0F0TgMR9RC5fnWUqNRPtTjdybwJXq7TnGaj6ZxZ4RM831/s1600/comment-icon.png) no-repeat;Padding-left:20px;'><b:if cond='data:post.numComments == 0'>Be the first to comment!<b:else/> <b:if cond='data:post.numComments == 1'><data:post.numComments/> Comment so far<b:else/><data:post.numComments/> Comments so far</b:if> </b:if></a>
          </b:if>
        </b:if>
      </span>

ကာလာနဲ႕ျပထားတာေလးေတြကေတာ့......
Red (Author)
Green (Date)
Blue (Labels)
Pink (Comment bubble)
မိမိတို႕ စိတ္ၾကိဳက္ ပုံရဲ႕ လင့္ေတြကို ဖန္တီးေျပာင္းးလည္း နိဳင္ပါတယ္...

(5.)  Save template..လုပ္လို႕ ရပါျပီေနာ္....


ဘေလာ့ခရီးသည္                                    

0 comments:

Post a Comment

Download link ကိုႏွိပ္ျပီး ေနာက္ tab တစ္ခုနဲ႕ page တစ္ခုေပၚလာပါလိမ့္မယ္။ ငါး စကၠန္႕ေလာက္ ေစာင့္ေပးလိုက္ပါ။ ညာဘက္ေထာင့္မွာ Skip ဆိုတဲ့ button ေလးေပၚလာပါလိမ့္မယ္။ အဲဒီ skip ဆိုတဲ့ button ကိုႏွိပ္လုိက္ရင္ download ဆြဲလိုရတဲ့ page တစ္ခုက်လာပါလိမ့္မယ္။ အဲ့ဒီမွာ download လုပ္ႏိုင္ပါၿပီဗ်ာ