သည္ေန႕တင္မဲ့ နည္းလမ္းေလးကေတာ့ မိမိတို႕ ပို႕စ္ေတြရဲ႕ ေန႔စြဲေလးေတြမွာ ျပကၡဒိန္ေလးနဲ႕ ေပၚေနေအာင္ လုပ္တဲ့နည္းပညာေလးျဖစ္ပါတယ္.. ကဲ စလိုက္ရေအာင္ေမနာ္....
လုပ္နည္းေလးကို ပုံေလးေတြ နဲ႕ တစ္ကြ ရွင္းးျပသြားပါ့မယ္..
အဆင့္(၁)
ပုံမွာ ျပထားသလို ဘေလာ့ကာ ၀င္ပါ setting ကေန formatting ကိုဆက္သြားလိုက္ပါ...
အဲမွာဘဲ Date header format ဆိုတဲ့ေနရာမွာ ရွိတဲ့ date ေလးကို ၾကည့္ထားပါ။
အဆင့္(၂)
သည္မွာကလဲ အေပၚကအဆင့္ (၁) နဲ႕ အတူတူပါဘဲ ပို႕တင္တဲ့ ဘေလာ့ကာ ပုံစံကို သုံးၾကတာခ်င္းမတူညီ ၾကပါဘူး ဒါေၾကာင့္ ၂ မ်ိဳးစလုံးးတင္ျပလိုက္တာပါ.. အဆင့္ (၁) နဲ႕ (၂) က အတူတူပါေနာ္။
<h2 class='date-header'><span><data:post.dateHeader/></span></h2>
ေတြ႕ျပီဆုိတာနဲ႕ အဲေနရာကို ေအာက္က ကုဒ္ေတြ အစားထိုးေပးလိုက္ပါ
<div id='Date'>
<script>changeDate('<data:post.dateHeader/>');</script>
</div>
<b:else/>
<div id='Date'>
<script>changeDate('');</script>
</div>
ေနာက္ တဆင့္အေနနဲ႕ </head> ကိုထပ္ရွာပါ -- ေတြ႕တာနဲ႕ သူ႕ရဲ႕ အေပၚကပ္လွ်က္ ေအာက္ကကုဒ္ေတြ ထည့္ေပးပါ။
<script type='text/javascript'>ျပီးးတာနဲ႕ Preview နဲ႕ ကလစ္ျပီးးၾကည့္လုိက္ပါ.... ေသျခာျပီ ဆိုတာနဲ႕ save template ကို ကလစ္ျပီးး save လုိက္ၾကပါေတာ့... ေကေကပါျပီ... ဟိဟိ..
//<![CDATA[
var DateCalendar;
function changeDate(d){
if (d == "") {
d = DateCalendar;
}
var da = d.split(' ');
day = "<strong class='date_day'>"+da[0]+"</strong>";
month = "<strong class='date_month'>"+da[1].slice(0,3)+"</strong>";
year = "<strong class='date_year'>"+da[2]+"</strong>";
document.write(month+day+year);
DateCalendar = d;
}
//]]>
</script>
<b:if cond='data:blog.pageType != "static_page"'>
<style type='text/css'>
/* Calendar style date
----------------------------------------------- */
#Date {
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMjsLrJXZC79Sud1XQiAqYFKxacQUJNVPFDm-J45NeoVgqfYpuGhlOmDGh6iok1OPbv_J98tLp8SIxP3zj3HPsNPPucA2K_EXFX7VawUwfK57Uh3K2W_3vtVHuFh2AN8F05KsltQF6tp1U/s1600/calendar07.png) no-repeat;
display: block;
width:60px;
height:60px;
float: left;
margin: 15px 2px 0 -108px;
padding: 0 0 8px 0px;
border: 0;
text-transform: uppercase;
}
.date_month {
display: block;
font-size: 15px;
font-weight:bold;
margin-top:-1px;
text-align:center;
color:#ffffff; /* Month's color */
}
.date_day {
display: block;
font-size: 28px;
font-weight:bold;
margin-top:-8px;
text-align:center;
color:#282828; /* Day's color */
}
.date_year {
display: block;
font-size: 10px;
margin-top:-8px;
text-align:center;
color:#282828; /* Year's color */
}
</style>
</b:if>
ေမာလုိက္တာ...ေရခ်မ္းခ်မ္းေလးတခြက္ေလာက္ဂ်ာ... အားေပးးတာေက်းဇူးပါ.. ၾကိဳးစားလွ်က္
0 comments:
Post a Comment