ပန္းတစ္ခင္း...ခ်စ္ျခင္းေတြရွိမွ...လွႏုိင္မွာပါ။

ပန္းတစ္ခင္း...ေဒါသမီးေတြၿငိမ္းမွ လွႏုိင္မွာပါ။

ပန္းတစ္ခင္း...အတၱေတြရွင္းမွ လွႏုိင္မွာပါ။

Saturday, September 27, 2008

Posts ေတြေခါက္သိမ္းျခင္း

မိမိရဲ႕ Posts ကုိ ေခါက္သိမ္းဖုံုးကြယ္ထားခ်င္ရင္ေအာက္ပါအတုိင္းလုပ္ၾကည့္ပါ။ Peek-A-Boo Post လုိ႔ေခၚပါတယ္။ ကဲမနီေရ စလုိက္ၾကရေအာင္-
(၁) ေအာက္ေဖာ္ျပပါ code ကုိ Javascript Document(*.js)File type နဲ႔ Save ပါ။ Dreamweaver Software တုိ႔လုိမ်ိဳးမွာ ထည့္သြင္း Save ႏုိင္ပါတယ္။

function toggleIt(id) {
post = document.getElementById(id);
if (post.style.display != 'none') {
post.style.display = 'none';
} else {
post.style.display = '';
}
}
function showFullPost(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "readmore")
spans[i].style.display = 'none';
}
}
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}
function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'none';
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
found = 1;
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
function commentDisplay(json) {
for (var i = 0; i < numcomments; i++) {
var entry = json.feed.entry[i];
var alturl;if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;break;
}
}
alturl = alturl.replace("#", "#comment-");if (entry.content) {
comment = entry.content.$t;
} else if (entry.summary) {
comment = entry.summary.$t;
}
var re = /<\S[^>]*>/g;
comment = comment.replace(re, "");
document.write('<a href="' + alturl + '">' + entry.author[0].name.$t + '</a> commented:<br/>');
if (comment.length < numchars)
document.write(comment + '<br/><br/>');else
document.write(comment.substring(0, numchars) + '...<br/><br/>');
}
document.write('Widget sponsored by:<br/><a href="http://bvibes.com">< img src="http://fbvibes.com/templates/yget/images/vibes_logo.png"/></a><br/>');
}


>>အသင့္လုပ္ၿပီးသား File ကုိပဲလုိခ်င္ရင္ေတာ့ Download လုပ္ယူပါ။
(၂) ၄င္း(.js)File ကုိ File Hosting Site တစ္ခုတြင္ Upload လုပ္ၿပီး URL Link ကုိရယူပါ။
>>ေအာက္ပါ က်ေနာ္ Share ေပးထားတဲ့ URL link ကုိပဲသံုးမယ္ဆုိရင္လည္း သံုးႏုိင္ပါတယ္။
http://pethein2008.googlepages.com/hackosphere.js
(၃) ေအာက္ေဖာ္ျပပါ Attribute Tag တြင္ ၄င္း(.js)file ၏ URL link ကုိထည့္သြင္းေပးရပါမယ္။
<script type='text/javascript' src='URL link' />

ဥပမာ---
<script type='text/javascript' src='http://sgt.pethein.googlepages.com/hackosphere2.js' />

(၄) Dashboard မွ Layout==>Edit HTML သုိ႔သြားၿပီး အရင္ဆံုး
-Download Full Template ကုိႏွိပ္ၿပီး Backup လုပ္ထားပါ။
-Expand Widget Templates ရဲ႕ box ေလးမွာ Tick လုပ္ေပးလုိက္ပါ။
-ၿပီးရင္ Edit HTML ထဲမွ </Head> ဆုိတဲ႔ Tag ကုိရွာပါ။ ေတြ႕ရင္ ၄င္းရဲ႕အေပၚကပ္လွ်က္မွာ (.js)file ၏ URL link ထည့္သြင္းထားခဲ့ေသာ Attribute Tag ကုိထည့္သြင္းေပးလုိက္ပါ။
(၅) ၄င္း Attribute Tag ကုိထည့္သြင္းၿပီးၿပီဆုိရင္ ေအာက္ေဖာ္ျပပါ code ကုိရွာပါ။ အျမန္ရွာခ်င္ရင္ေတာ့ ctrl+F ကုိႏွိပ္ၿပီး fine: box ထဲတြင္ <b:includable id='post' var='post'> ကုိ ရုိက္ထည့္ၿပီး next ကုိႏွိပ္၍ ရွာပါက ခ်က္ခ်င္းေတြ႕ႏိုင္ပါသည္။
<b:includable id='post' var='post'>
<div class='post hentry'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<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>
<div class='post-header-line-1'/>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

-၄င္း code ကုိေတြ႕ရင္ Select လုပ္ၿပီး ေအာက္ေဖာ္ျပပါ code အားလံုးကုိ copy / paste လုပ္ကာ ထည့္သြင္း ေပးလုိက္ပါ။
<b:includable id='post' var='post'>
<div class='post uncustomized-post-template' expr:id='"post-" + data:post.id'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>

<div class='post-header-line-1'/>

<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>

<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>Read More>></a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>Collapse>></a></p>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>

<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

-အထက္ပါ code အတြင္း အနီေရာင္ ျဖင့္ျပထားေသာ ေနရာတုိ႔တြင္ မိမိႀကိဳက္ရာ ေျပာင္းထည့္ေပးႏုိင္ပါတယ္။
ဥပမာ- အျပည့္အစံုသုိ႔>>> ႏွင့္ ျပန္ေခါက္ထားခ်င္ရင္>>> စသည္ျဖစ္ပါ။
-ၿပီးရင္ Save Template ကုိႏွိပ္ၿပီး Save ပါ။ Expand Widget Template ရဲ႕ box မွ Tick ကုိျဖဳတ္ၿပီး Save လုပ္ပါ။
(၆) Dashboard မွ Settings==>Formatting ကုိသြားပါ။ Post Template ၏ box ထဲတြင္ ေအာက္ပါ code ကုိ ထည့္သြင္းေပးလုိက္ပါ။
Type your summary here.
<span id="fullpost">
Type the rest of your post here.
</span>

-ဒီလုိထည့္သြင္းေပးျခင္းအားျဖင့္ မိမိ post ေရးတဲ့အခါတုိင္း Edit HTML ဘက္တြင္ အၿမဲေတြ႕ေနရမွာပါ။
-Comopse ဘက္မွာေတာ့ ေအာက္ေဖာ္ျပပါအတုိင္း လုိ္က္ေဖာ္ျပေပးေနမွာပါ။
-အေပၚဆံုးစာတန္းကုိ Select လုပ္ၿပီး မိမိအၿမဲတမ္း ေဖာ္ျပေပးခ်င္တဲ့ Post စာသားတစ္ခ်ိဳ႕ကုိ ေရးႏုိင္ၿပီး ေအာက္ကစာတန္း ကုိေတာ့ Select လုပ္ၿပီး မိမိေခါက္ထားခ်င္တဲ့ Post ေတြကုိေရးသားႏုိင္ပါတယ္။
-အဓိက မိမိသိထားရမွာကေတာ့ မိမိေခါက္ထားခ်င္တဲ့ text စာသားေတြဟာ ေအာက္ေဖာ္ျပပါ Attribute tag အတြင္းတြင္ ရွိေနေစရမွာပါ-
<span id="fullpost">ေခါက္ထားရန္စာသားမ်ား</span>

ေရးၿပီးသား Post ေတြကုိ ျပင္မယ္ဆုိရင္လည္း အခုလုိပဲ ျပင္ဆင္ေပးရမွာပါ။

မွတ္ခ်က္။ ဒီ Post ကုိ ကုိရန္ေအာင္လည္း ေရးခဲ့ဘူးၿပီးျဖစ္ကာ အခုနားလည္ေစရန္အလုိ႔ငွာ ရွင္းလင္းျပရျခင္း သာျဖစ္ပါသည္။ မူရင္း Post ကေတာ့ ဒီ blogspot ေလးမွာပါ။

အဆင္ေျပပါေစ

3 comments:

  1. ေက်းဇူးတင္ပါတယ္။
    လာလည္ပါအံုး။

    ReplyDelete
  2. လုပ္လို႔လည္းရဘူး :(

    ReplyDelete
  3. အပုိဒ္(၃)မွ Attribute Tag code တုိ႔ကုိ ျပင္ဆင္ထားပါတယ္-Blog site ၂ခု ၃ခုေလာက္ကုိ ထမ္မံစမ္းထားၿပီးျဖစ္ပါသည္။ အသံုးျပဳလုိသူမ်ားထပ္မံစမ္း သပ္ၾကပါဦး။ ရၿပီဆုိရင္ေတာ့ သတိျပဳရမယ့္အခ်က္ တစ္ခ်က္ရွိပါတယ္။ (မိမိေရးသားလုိက္တဲ့ Post text မ်ားကုိ justify လုပ္လုိက္တဲ့အခါေတြမွာ <span id="fullpast"> နဲ႔ </span> တုိ႔ဟာ တစ္ခ်ိဳ႕မလုိအပ္တဲ့ေနရာတြမွာ လုိက္ေပၚေန တတ္ပါတယ္) သံုးစြဲသူတစ္ခ်ိဳ႕ေျပာေျပာေနၾကတဲ့ "ေနာက္ပုိင္းအစဥ္မေျပဘူးဆုိတဲ့အခ်က္ျဖစ္ႏုိင္ပါတယ္ ခင္ဗ်ာ။

    ReplyDelete

မဂၤလာပါဗ်ာ ေက်းဇူးတင္ပါတယ္